Кнопки добавления в социальные сервисы без плагинов

Наверно, вы уже заметили небольшое усовершенствование на моем блоге — кнопки добавления статьи на социальные сервисы. Эта штука не является нововведением — до этого я использовал плагин «ОднаКнопка» для WordPress. Как-то на днях я подумал, что подгрузка js плагином со стороннего сайта может замедлить (и иногда действительно замедляла) загрузку страницы — ведь браузер с настройками по умолчанию (Opera, Firefox, Chrome — проверено на этих браузерах) будет ожидать полной загрузки скрипта, прежде чем рендерить дальше страницу. Далее, лишний JavaScript на странице может замедлить работу браузера (не утверждаю, что у меня много JavaScript, но для владельцев сайтов с большим количеством js это актуально). Ну и пункт 3 — известно, что чем больше плагинов установлено в WordPress, тем больше он жрет системных ресурсов. Как следствие, устанавливать ради двух строчек инклюда js на каждый пост в странице блога целый плагин, считаю немного лишним :) . Придя к такому заключению, я решил сделать очередную модификацию в теме своего блога (это определенно минус, т.к. после смены темы придется изменять новую тему). Мне понадобилось определенное время для того, чтобы откопать методы добавления статьи в социальные сервисы через GET-запрос, и теперь я хочу поделиться ими с вами.

Итак, я выбрал небольшой список социальных сервисов, вот они:

Далее я нашел подходящие иконки для отображения на страницах блога. Мне очень приглянулись иконки этого товарища, за них ему спасибо. Самое скучное было дальше — поиск GET-запросов к сервисам для добавления постов. Оказывается, аналогичное проделал и Глобатор, за что ему тоже спасибо — некоторые запросы перекочевали ко мне именно из его статьи :) .

Итак, код:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<!--mail.ru-->
<a href="http://connect.mail.ru/share?share_url=<?php the_permalink(); ?>" rel="nofollow" target="_blank"><img title="Поделиться В Моем Мире" src="<?php bloginfo('template_url'); ?>/icons/mail-ru.png" alt="" width="32" height="32" /></a>

<!--facebook-->
<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в Facebook" src="<?php bloginfo('template_url'); ?>/icons/facebook.png" alt="" width="32" height="32" /></a>

<!--delicious-->
<a href="http://del.icio.us/post?url=<?php the_permalink() ?>&title=<?php the_title(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в Delicious" src="<?php bloginfo('template_url'); ?>/icons/delicious.png" alt="" width="32" height="32" /></a>

<!--digg-->
<a href="http://digg.com/submit?phase=2&url=<?php the_permalink() ?>" rel="nofollow" target="_blank"><img title="Поделиться в Digg" src="<?php bloginfo('template_url'); ?>/icons/digg.png" alt="" width="32" height="32" /></a>

<!--friendfeed-->
<a href="http://friendfeed.com/?url=<?php the_permalink() ?>&title=<?php the_title(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в FriendFeed" src="<?php bloginfo('template_url'); ?>/icons/friendfeed.png" alt="" width="32" height="32" /></a>

<!--buzz-->
<a href="http://www.google.com/buzz/post?message=<?php the_title(); ?>&url=<?php the_permalink(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в Google Buzz" src="<?php bloginfo('template_url'); ?>/icons/google.png" alt="" width="32" height="32" /></a>

<!--twitter-->
<a title="Добавить в Twitter" href="http://twitter.com/home?status=RT @ru_tingol <?php the_title(); ?>: <?php the_permalink(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в Twitter" src="<?php bloginfo('template_url'); ?>/icons/twitter.png" alt="" width="32" height="32" /></a>

<!--mister-wong-->
<a title="Добавить в Mister-Wong" href="http://www.mister-wong.ru/index.php?action=addurl&bm_url=<?php the_permalink(); ?>&bm_description=<?php the_title(); ?>" rel="nofollow" target="_blank"><img title="Добавить в Mister Wong" src="<?php bloginfo('template_url'); ?>/icons/mister-wong.png" alt="" width="32" height="32" /></a>

<!--reddit-->
<a href="http://reddit.com/submit?url=<?php the_permalink() ?>&title=<?php the_title(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в Reddit" src="<?php bloginfo('template_url'); ?>/icons/reddit.png" alt="" width="32" height="32" /></a>

<!--myspace-->
<a href="http://www.myspace.com/Modules/PostTo/Pages/?u=<?php the_permalink() ?>" rel="nofollow" target="_blank"><img title="Поделиться в MySpace" src="<?php bloginfo('template_url'); ?>/icons/myspace.png" alt="" width="32" height="32" /></a>

<!--orkut-->
<a href="http://promote.orkut.com/preview?nt=orkut.com&tt=<?php the_title(); ?>&du=<?php the_permalink() ?>" rel="nofollow" target="_blank"><img title="Поделиться в Orkut" src="<?php bloginfo('template_url'); ?>/icons/orkut.png" alt="" width="32" height="32" /></a>

<!--./-->
<a href="http://slashdot.org/bookmark.pl?url=<?php the_permalink() ?>&title=<?php the_title(); ?>" rel="nofollow" target="_blank"><img title="Поделиться в Slashdot" src="<?php bloginfo('template_url'); ?>/icons/slash-dot.png" alt="" width="32" height="32" /></a>

<!--Technorati-->
<a href="http://technorati.com/signup/?f=favorites&Url=<?php the_permalink() ?>" rel="nofollow" target="_blank"><img title="Поделиться в Technorati" src="<?php bloginfo('template_url'); ?>/icons/technocrati.png" alt="" width="32" height="32" /></a>

<!--StumbleUpon-->
<a href="http://www.stumbleupon.com/submit?url=<?php the_permalink() ?>" rel="nofollow" target="_blank"><img title="Поделиться в StumbleUpon" src="<?php bloginfo('template_url'); ?>/icons/stumbleupon.png" alt="" width="32" height="32" /></a>

Пара нюансов.
Во-первых, необходимо поменять пути к вашим иконкам.
Во-вторых, размер ваших иконок может быть другим, поэтому вам может понадобиться изменить параметры width=»32″ height=»32″ в теге IMG или вовсе убрать их. В последнем случае иконки будут отрисовываться со своим натуральным разрешением.
Этот код необходимо прописать в файле «index.php» и/или «single.php» вашей темы после строки:

1
<?php the_content(''); ?>

Первый файл отвечает за вывод информации на главную страницу (где, как правило, отображаются подряд несколько постов), а второй — за вывод отдельного поста — когда вы посещаете страницу, содержащую один пост. Например, эту :) . Можно сделать и покрасивее — сохранить приведенный выше html-код в отдельный файл и назвать его как-нибудь с расширением .php, например «services.php». Далее, этот файл кладется в директорию с темой (можно и в любое другое место), и в вышеуказанных файлах после

1
<?php the_content(''); ?>

пишем

1
<?php include("path/to/services.php"); ?>

Путь, конечно же, надо изменить на свой. Второй вариант хорош тем, что вам не нужно прописывать html-код со ссылками прямо в теме, вы делаете это в отдельном файле, который можно положить в любое удобное место и просто подключать (функция include() php) там, где это нужно.
Вот что у меня было:

А вот что стало:

По-моему, неплохо 😉 . К тому же, оно теперь и грузится быстрее :)

Похожие статьи:

Запись опубликована в рубрике Wordpress с тэгами , , , , , , , , . Создать закладку на запись. Оставить комментарий или trackback: Trackback URL.

6 комментариев

  1. Опубликован 3 Август 2010 в 17:19 | Прямая ссылка

    Интересная статья, расписано подробно. Обязательно возьму на вооружение.

    А я вот нашел кучу всяких иконок. Написал заметочку, посмотрите, плиз berezablog.com/vybiraem-ikonki-dlya-bloga/

    • Опубликован 3 Август 2010 в 17:34 | Прямая ссылка

      Спасибо за отзыв.

      Интересный сайтик с иконками вы нашли, спасибо за ссылочку :)

  2. Опубликован 31 Август 2010 в 21:45 | Прямая ссылка

    Спасибо! Давно искал «чистый» код без лишних скриптов и прочего хлама...

  3. Опубликован 18 Февраль 2012 в 7:55 | Прямая ссылка

    Огромное СПС

2 trackback'ов

  1. blogistica.ru 23 Июнь 2010

    Кнопки добавления в социальные сервисы без плагинов | Заметки одного программиста...

    Как сделать свои кнопки добавления в социальные сервисы без использования плагинов...

  2. [...]пост, в котором автор рассказывает, как создать кнопки добавления в социальные сервисы без плагинов. Рекомендую всем любителям настраивать свой блог [...]

Оставить комментарий

Ваш e-mail никогда не будет опубликован или передан третьим лицам. Обязательные поля отмечены *

*
*