Скрипт для WordPress “Добавить в закладки”
Поговорим о кнопках добавления ссылки на пост в социальные закладки, тех, которые мы обычно наблюдаем в начале или в конце каждого поста на многих блогах.
На этом блоге средства социализации постов были поочередно реализованы 3-мя разными способами: сначала я вставлял коды ссылок на социалки вручную, редактируя шаблон WP, затем поставил плагин, делающий то же самое, и, наконец, остановился на 3-м способе, когда эти ссылки выводятся полностью с помощью технологии JavaScript.
Хочу отметить, что первые 2 варианта совсем не нравились мне. Все потому, что в результате под каждым постом блога я получал ужасающий кусок хтмл-кода (с инлайновым ява-скриптом) внушающего размера. Чтобы увидеть ЭТО, посмотрите в исходный код, например, такой страницы. Поисковики наверняка пугаются, видя сие безобразие.
Помимо размера кода не прельщало и то, что в результате появлялось множество лишних исходящих ссылок. Сами понимаете, что абсолютно “левый” тег <noindex>, равно как и атрибут rel=”nofollow” - не панацея.
Мне нужно было простое решение, так сказать, два в одном.
Вадим Ласто в очередной раз удивил меня, когда я обнаружил, что на его блоге появились ссылки добавления в социальные закладки и реализованы они с помощью небольшого ява-скрипта. Это и было то, что нужно мне.
Полагая, что данное решение придется по душе не только мне, расскажу, как данный скрипт адаптировать под популярный движок WordPress, на котором работает большинство stand-alone блогов (автор скрипта дал на это добро).
Процесс установки довольно прост, рассмотрим его последовательно:
- Необходимо в файл functions.php Вашей WP-темы добавить нижеследующий код (если такого файла еще нет, то создать его):
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
42
43
44
45
46
47
48
49
50<?php
function social() {
$u = urlencode(get_permalink());
$t = get_the_title();
$social=<<<EOF
function so(u,t) {
for (i=0; i< s.length; i=i+2) document.write(
'<a target="blank" href="http://'+s[i]+'/'+s[i+1].replace('{u}',u).replace('{t}',t)+'">'+
'<img src="/wp-content/themes/default/social/'+s[i]+'.ico" border="0" width="16" height="16" alt="Добавить в '+s[i]+'"></a>'
);
}
var s=new Array(
"del.icio.us","post?url={u}&title={t}",
"news2.ru","add_story.php?url={u}",
"google.com","bookmarks/mark?op=edit&bkmk={u}&title={t}",
"bobrdobr.ru","add.html?url={u}&title={t}",
"memori.ru","link/?sm=1&u_data[url]={u}&u_data[name]={t}",
"moemesto.ru","post.php?url={u}&title={t}",
"mister-wong.ru","add_url/?bm_url={u}&bm_description={t}",
"rumarkz.ru","bookmarks/?action=add&popup=1&address={u}&title={t}&description={t}",
"rucity.com","bookmarks.php?action=add&address={u}&title={t}&description=",
"linkstore.ru","servlet/LinkStore?a=add&url={u}&title={t}",
"myscoop.ru","add/?title={t}&URL={u}",
"vaau.ru","submit/?action=step2&url={u}",
"newsland.ru","News/Add/type/news/"
);
EOF;
$social=<<<EOF
<p class="social">
<script>
$social so (
'$u',
encodeURIComponent('$t')
);
</script>
</p>
EOF;
echo $social;
}
?> - Сохранить иконки социалок в какую-либо папку.
- В вышеуказанном коде заменить путь /wp-content/themes/default/social/ на путь к Вашей папке с иконками.
- Добавить в свою WordPress-тему в то место, где желаете выводить ссылки на социалки, такой код: <?php social(); ?>
- Готово. То, что получается в результате, Вы можете увидеть, посмотрев код данной страницы.
Для удобства Вы можете скачать готовый архив, содержащий и файл functions.php, и иконки социалок.
В результате мы получили значительно уменьшенный код и решили задачу с излишними исходящими ссылками. Добавление в скрипт новых ссылок на социальные сервисы, думаю, труда не составит, все делается по аналогии.
Одно плохо, с выключенным JS не увидишь ничего ((
Да, но и Бог с ним. Оригинальные коды тоже содержат в себе JS, поэтому и они не сработают так, как надо, с выключенным JS.
2Dimox то что у тебя стоит социалки сделанно таким же образом ?
Ну тогда и правда, бог с ним с JS.
Красивое решение.
Спасибо!
Берия Лаврентий Павлович, да, я же написал об этом в посте.
Comfi, пожалуйста.
сегодня в Lifehacker увидел что-то подобное http://odnaknopka.ru/get/
Yuriy, я тоже вчера об этом узнал с того же сайта.
“Добавление в скрипт новых ссылок на социальные сервисы, думаю, труда не составит, все делается по аналогии” - к сожалению, не все дядьки с сервисов закладок разглашают синтаксис урла для своих добавлялок. Или я такой криворукий-кривоглазый, что не смог найти на их сайтах такого описания.
Бомж квадратный , как правило код для добавления ссылки в свою систему данные сервисы публикуют где-то на страницах помощи. На всех социалках, что я бывал, такой код присутствует. Если же у них этого нет, то большой им минус за это. Возможно, ты не нашел, потому что плохо искал :).
К сожалению, у меня не получилось. Я с Вордпрессом пока на длинной ноге, но все сделал по инструкции. Залил в default иконки, в functions.php вставил код, вставил код для вывода блока:
Но не заработало все равно.
Презренный манимейкер, по идее, должно было работать. Могу помочь разобраться, если что, пиши через контакты вверху страницы.
Кстати, в качестве альтернативы можешь попробовать поставить “Одну кнопку” - http://odnaknopka.ru/get/. Там есть плагин для ВП, достаточно его только активировать.
А у меня почему то с http://odnaknopka.ru/get/ выдается в IE что в ява скрипте не хватает скобки ) И это каким то образом влияет на RSS записей (чушь выдало с куском кода явы этой одной кнопки), зато в single.php всё ок вроде было без ошибок…
Хотел добавить ваш php скрипт, но он почему то не подсвечивается корректно в Dreamweaver, я в php не силен, но заметил что не подсвечивается в конце закрытие скрипта ?> , значит внутри скрипта что то не закрыто… И ещё вопрос, куда именно (перед какими элементами) этот скрипт лучше вставить в functions.php ?
Я копировал со своего рабочего примера, так что по идее все должно быть в порядке.
Совершенно без разницы, в какое место. Главное - не во внутрь функций, которые там уже имеются.
Может быть и не нашел. Например, берем 100zakladok.ru На их сайте я нашел только html-код вставки кнопки. А вот как их кнопку запихнуть в массив твоего кода - вот в чем вопрос :) Или нужно просто смотреть как они формируют запрос и по аналогии вписать в код? Эх… не силен я в этом… :(
Лови, вот что получилось у меня, надеюсь, знаешь куда это вставить :)
И еще, если эту запись добавляешь последней в массиве, то запятую в конце не надо.
может кому пригодится:
По одному ему понятным причинам сервер отказывался воспринимать иконки в формате .ico
С помощью утилиты IcoFX импортировал иконки в формат .gif
В файле functions.php поменял в 12 строчке: .ico на .gif
..вроде все работает
:)
Хорошо, когда всё в одном месте (я про то, что не надо под каждую социалку своё мутить :) )
Dimox, а как ты комментируешь, в стиле форумов, например как в 14 каменте?
Это плагин такой?
Если имеете в виду цитаты на зеленом фоне, то это всего лишь html-тег <blockquote>
Мда, всё гениальное - просто ))
Здравствуйте,
установила плагин. Надеюсь в будущем будет выглядеть хорошо. Но пока, к сожалению, картинки отображаются так же, как и у вас на странице, сплошные квадраты.
Путь к папке с картинками я прописала правильно, тем не менее они не отображаются.
В чем там может быть дело?
Кстати, подскажите, начинающему блогеру: почему путь к папке нужно прописывать полностью, а не так, как прописывают в HTML?
И раз я уже попала в компанию людей знающих, то наберусь наглости спросить:
Подскажите, пожалуйста, как русифицировать тему? У неня на странице выводятся надписи на английском, а когда я попыталась добавить в файл index.php надпись: “добавить в социальные закладки”, получились сплошные квадраты.
По-видимому, кодировка не та.
Буду благодарна за любую подсказку.
Людмила
Людмила, у меня нет никаких квадратов, это что-то с вашей стороны неправильно работает.
Не знаю. Если прописано верно, то работать должно.
Не совсем понимаю, о чем вы. Приведите пример.
Возможны 2 способа:
1) С помощью словаря самостоятельно перевести все английские слова и фразы в файлах темы.
2) Скопировать из какой-то русскоязычной темы соответствующие слова и фразы и заменить их в вашей теме.
Необходимо сохранять файлы темы в той кодировке, в которой работает Ваш сайт.
“Не совсем понимаю, о чем вы. Приведите пример.”
Пример: папка social и файл functions.php находятся в папке с темой, ее название: oldschool-10.
Файл functions.php ссылается на папку social, в которой находятся картинки.
Почему путь к папке прописывается не img src=”social/имя графич. файла,
а img src=”/wp-content/themes/oldschool-10/social/?
И если путь к картинкам я указала неправильно, то как в данном случае будет правильно?
“Необходимо сохранять файлы темы в той кодировке, в которой работает Ваш сайт.”
Как мне узнать, в какой кодировке работает мой сайт (он у меня не спрашивал, в какой кодировке ему работать) и как мне сохранить файлы темы в той же кодировке?
Заранее благодарна за подсказку.
Людмила
Потому что в этом скрипте не используется переменная из движка ВП, которая подставляет путь до темы.
Если картинки у вас лежат в папке /wp-content/themes/oldschool-10/social/ и при этом не отображаются, тогда не знаю… Видимо, еще какие-то причины.
В исходном коде страниц сайта есть такая строка в самом верху:
здесь после charset= указана кодировка.
Нужно воспользоваться каким-либо текстовым редактором, который умеет сохранять файлы в разных кодировках. Например, PSPad или Notepad++.
Сейчас без JS почти никто в Нет не ходит… Скрипт очень разумно придуман - респект!
Интересное решение, надо будет попробовать…В любом случае спасибо).
[quote post=”109″]И еще, если эту запись добавляешь последней в массиве, то запятую в конце не надо.[/quote]
Ошибки всё равно по идее не должно быть
Подскажите пожалуйста куда добавить
Уже все места перепробовал, подскажите пожалуйста.
Саня возмите “Одну кнопку” - http://odnaknopka.ru/get/. И напрямую вставьте в шаблон своего блога.
Мне как-то более приятен вариант с “одной кнопкой!. Но хотя кому как, кто и поизвращаться любит :))
SEO, а вот я не сторонник сервисов, которые требуют загружать код с их сайта, как это сделано у “Одной кнопки” (в общем-то сюда можно отнести и любую систему контекстной рекламы). Стоит их серверу стать недоступным (от этого никто не застрахован), как страницы блога станут грузиться с ощутимой задержкой, что не придется по душе посетителям блога.
[quote comment=”3218″]SEO, а вот я не сторонник сервисов, которые требуют загружать код с их сайта, как это сделано у “Одной кнопки” [/quote]
Dimox, аналогично. Собственно полностью разделяю мысли в посте (эмм, это не спам комментов).
Предлагаю посмотреть мой вариант скрипта на javascript, подключается чрезвычайно просто на любые сайты-блоги-cms:
http://web-mastery.info/scripts/javascript-83.html
Положительный момент - минимум кода на странице(код сервисов реально разворачивается на клиентской машине), простое добавление/удаление и, главное, скрипт лежит на своем хосте.
sabotage, да, это тоже хорошее решение.
Прошу прощения за ламерский вопрос, но вот такая штука получается.
У меня в теме посты выводятся, как я понимаю, вот таким кодом:
Если тупо вставить вызов функции после the_post(); то почему-то блок иконок выводится перед собственно постом, а не после, как вроде бы должно быть. Совершенно не понимаю, почему такое =(
Как исправить? Заранее спасибо. И в любом случае огромное спасибо за сам код.
15g, все дело в том, что текст самого поста выводит код the_content() (или the_excerpt()). Вставляйте функцию закладок после него, и все будет гуд ;)
Упс. Спасибо.
Надо было не разбираться в коде, оказывается, а курить вопрдпрессовский кодекс =))
Кодекс вообще штука рулезная, жаль на английском, мне например сложно немного, чуть отвлекся - потерял нить :(
я так понял, что у тебя счас немного измененный скрипт стоит?
можешь его выложить?
Dux, возможно, однажды выложу его.
К сожалению, так не получается. У вас в коде выводится всего одна короткая строчка (<script type=”text/javascript”>social()</script>)
А у меня весь скрипт целиком.
(<script>
function so(u,t) { … и до конца)
Не подскажете, как действительно достичь такого же результата, как у вас?
Сергей, пост написан почти года назад. Скрипт за это время изменился. Может быть однажды напишу о новом.
Да, спасибо. Скрипт от Ласто работает практически везде, не только на WordPress. Кстати недавно написал пост о том, как его встоить в любой динамический сайт. Надеюсь будет полезно…
Добрый день.
Воспользовался материалом данного поста, установил иконки для регистрации в социалках. Сейчас обследовал Ваш блог , и не нашел ничего подобного, в связи с чем возник вопрос: насколько наличие этих кнопок оправдывает себя, есть ли какой нибудь пусть самый минимальный эффект от этого сейчас? или тема уже себя исчерпала и смысла городить огород уже нет?
Потому что теперь используется усовершенствованный скрипт.
Если на блоге публикуется интересный многим читателям материал, то, конечно, оправдывает.