Код кнопок «поделиться» для популярных социальных сетей (WordPress)

Проще всего конечно, кнопки для соцсетей вроде Facebook и Vkontakte разместить с помощью плагинов: в сети масса вариантов для WordPress с подробными описаниями. Однако, это не всегда удобно: часто подставить своё изображение для кнопок или ещё как-то их кастомизировать с плагином, бывает проблематично. Кроме того, зачем использовать тонны кода, если можно обойтись двумя-тремя строчками?

Способ хорош, если вы не планируете обновлять тему своего сайта, т.к. при обновлении темы (не движка), изменения скорее всего затрутся. В противном случае рекомендую использовать плагины, или более сложные, но менее нежные в этом плане способы.

В первую очередь, необходимо открыть для редактирования файл шаблона записи WordPress. В зависимости от темы (темы обычно расположены в каталоге wp-content/themes/), он может иметь название single.php или content-single.php, а может и ещё как-то: разработчики тем часто не придерживаются стандартов.

После того, как нашли нужный файл, можно приступать к размещению кода. Простейшая ссылка «поделиться» для Facebook выглядит так:

<a data-href="https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(get_permalink());?>&p[images][0]=<?php echo wp_get_attachment_url(get_post_thumbnail_id());?>">Поделиться на fb</a>

где: echo urlencode(get_permalink()); — постоянная ссылка на пост; &p[images][0]=<?php echo wp_get_attachment_url(get_post_thumbnail_id());?>» — миниатюра записи (будет расположена как основная картинка поста в fb, если оно вам не нужно, этот кусок можно удалить).

Ссылка «поделиться» для vkontakte:

<a data-href="http://vkontakte.ru/share.php?url=<?php echo urlencode(get_permalink());?>&title=<?php wp_title(); ?>&description=<?php the_excerpt(); ?>&image=<?php the_post_thumbnail_url(); ?>">Поделиться в vk</a>

тут чуть сложнее: <?php echo urlencode(get_permalink());?> — постоянная ссылка, &title=<?php wp_title(); ?> — заголовок поста, &description=<?php the_excerpt(); ?> — короткое описание (до тэга «more»), &image=<?php the_post_thumbnail_url(); ?> — миниатюра записи. Удалив любой участок кода (кроме ссылки конечно же), вы убираете его из просмотра.
Twitter, всё по аналогии:

<a data-href="https://twitter.com/intent/tweet?url=<?php echo urlencode(get_permalink());?>&amp;text=<?php echo urlencode(get_the_title());?>">Поделиться в tw</a>

Google+:

<a data-href="https://plus.google.com/share?url=<?php echo urlencode(get_permalink());?>">Поделиться в G+</a>

Pinterest:

<a href="javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());">Поделиться в Pinterest</a>

Одноклассники:

<a data-href="http://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl=<?php the_permalink(); ?>">Поделиться в ok</a>

LiveJournal:

<a href="http://www.livejournal.com/update.bml?subject=<?php wp_title(); ?>&amp;event=%3Ca%20href=%22<?php echo urlencode(get_permalink());?>/%22%3E<?php the_excerpt(); ?>%3C/a%3E&amp;">Поделиться в LJ</a>

При необходимости, вместо надписи «Поделиться в», можно добавить кнопку-изображение с логотипом соцсети, сути это не поменяет.

Добавить комментарий

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

три × 3 =