Сегодня мы рассмотрим сервисы и расскажу как самим добавить кнопки социальных сетей на сайт бесплатно, а также покажу как сделать красивую кнопкк “добавить в закладки” на сайт при нажатии на которую пользователь сможет добавить понравившуюся страницу в закладки и в любое время, не вводя заново адрес сайта просмотреть понравившийся ему материал.
Данные фишки применяются на многих сайтах, да и вообще должны быть в обязательном порядке там, так как имеют огромное значение в плане продвижения сайта и его отдельных страниц. Могу отметить основные положительные моменты применения подобного рода кнопок, среди который:
- ускорение индексации новых страниц;
- улучшение поведенческих факторов на страницах сайта;
- привлечение дополнительного траффика с социальных сетей;
- раскрутка своего бренда в социальных сетях;
- запоминание сайта и быстрый доступ из закладок браузера.
Сегодня существует огромное количества сервисов по созданию кнопок социальных сетей, но не стоит сразу же бросаться к тому или иному сервису. В статье я постараюсь подробнее рассказать Вам какие сервисы самые лучшие и на что стоит обратить внимание.
Перед установкой социальных кнопок на свой сайт стоит обратить внимание на скорость их загрузки. Скрипты и плагины должны быть максимально облегченными иначе есть риск увеличения нагрузки на сервер, что также скажется и на долгой загрузки страниц сайта, а пользователи ждать не любят и стараются как можно скорее покинуть сайт.
Существую 2 способа прикрутить данные кнопки в нужное нам место с помощью плагина или же вручную вставить нужный нам код в шаблон и страницы сайта. Лично я не против использовать оба способа, хотя на блоге поставит все же кнопки от Яндекса. Во избежание замедления загрузки страниц.
Если кото-то думает, что ставить такого рода кнопки на свой сайт не стоит, так как на них никто и не нажимает, тогда он прав, но по отношению к своему сайту, который наверняка неинтересен никому, а те пользователи, которые нашли полезную и нужную информацию всегда лайкнут и поделятся со своими друзьями, которых у каждого в соц. сетях сейчас сотни. Вот вам и бесплатная рассылка за Ваш труд -))).
Также очень важным фактором является ускорение индексирования новых страниц сайта. Лично я всегда, после добавления нового поста на блог, включая этот, используя кнопки социальных сетей добавляю страницу с материалом на свою страницу ВК, Facebook, Google+ и Twitter? А также закидываю в группу. По наблюдениям используя кнопки и связку с сервисом пингов типа Letusindex мои новые страницы индексируются уже на следующие сутки. Проверял сервисом AdvegoPlagiatus на оригинальность авторства и всегда указана только мое.
Добавить кнопки социальных сетей на сайт от Яндекса
Яндекс как передовой поисковик русскоязычного интернета не стоит на месте и постоянно предлагает новые сервисы для установки на сайт, недавно я писал про необходимость установки микроразметки на сайт, которые также очень полезны в плане продвижения сайтов и лояльного отношения поисковика, я имею ввиду техническую сторону сайтов по внутренней оптимизации, без которой далеко не уедешь.
Лично я предпочитаю вставлять код кнопок на сайт именно с Яндекса и сейчас расскажу куда и что вставлять на примере любого сайта на Джумла, но суть тут одна и та же как и для рукописных так и на сделанных на WordPress.
Установка кнопок не представляет трудностей и для начала нам необходимо попасть в раздел Яндекса «Блок поделиться» (адрес страницы: https://tech.yandex.ru/share/). Тут нам необходимо выбрать внешний вид блока и получить соответствующий код для вставки.
Теперь берем полученный код нашего скрипта и заходим в шаблон джумла в файл index.php по следующему пути:
…/templates/ваш_шаблон/index.php
И подключаем полученный скрипт путем вставки перед закрывающимся тегом <head> следующей строки:
<script type="text/javascript" src="//yastatic.net/share/share.js" charset="utf-8"></script>
А также идем по следующему пути к файлу который отвечает за формирование вывода материалов в самом шаблоне после строчки <?phpecho $this->item->text; ?> и вставляем полный код с Яндекса:
.../templates /ваш_шаблон /html /com_content /article/default.php
Отлично, кнопки работают и отображаются на сайте. Но посмотрите они какие-то маленькие и не особо смотрятся на общем фоне. Тут нам необходимо в самом коде скрипта поменять текст small (маленький) на big (большие) как показано на скриншоте.
Теперь мы научились устанавливать код наших кнопок в материалы Джумла. Давайте теперь рассмотрим пару интересных сервисов, которые мне очень приглянулись.
Социальные кнопки для Джумла 3 с помощью плагинов Uptolike и Pluso
Если уж Вам не по душе или же не хотите заморачиваться с простановкой кода кнопок на сайт, тогда можно воспользоваться готовыми, а самое главное БЕСПЛАТНЫМИ решениями с помощью специальных сервисов. Данные два сервиса совсем не будут грузить систему и грузятся очень быстро.
Давай рассмотрим основные преимущества первого сервиса под названием Pluso. Перейдя на официальный сайт разработчиков мы должны всего лишь настроить наш внешний вид кнопок, а также выбрать нужные нам сервисы с помощью который пользователи смогут делать репосты на свои странички в социальных сетях.
Среди основных достоинств по сравнению с кнопки социальных сетей от Яндекса является следующие моменты:
- Большое количество популярных социалок можно добавить в общий блок;
- Возможность выбрать оформление в 2 строки для интернет-магазинов и т.п.;
- Можно выбрать отображение как вертикально, так и горизонтально;
- Можно поставить цветной фон для блока с миниатюрами.
Вставку кода делаем таким же образом как показывал в случае с Яндексом. Также можно почитать рекомендации в разделе FAQ на интересующие вопросы.
А теперь давайте рассмотрим интересный плагин социальных кнопок с названием Uptolike. Мне он очень понравился так как имеет множество прикольных настроек как отображения начиная от размера и заканчивая положениями на сайте. Предлагается как готовый плагин для Джумла и WordPress. Вот некоторые преимущества по сравнению с остальными вариантами:
- Прописывать код никуда не надо, а просто устанавливаем плагин для CMS, который все сделает сам (есть и генератор кода);
- Можно онлайн видеть, как будут расположены и отображены кнопки на сайте;
- Есть возможность отображать кнопки в самой статье или же ввиде боковой панели слева или справа в окне сайта;
- Можно поставить различные вариации, помимо самих кнопок, которые тоже идут в комплекте (скачиваете одно, а получаете целый букет бонусов БЕСПЛАТНО, очень круто);
- Можно создать и настроить одновременно с кнопками: поделиться картинкой, создать опрос, голосовать за статью лайком, свою метрику и социальную авторизацию на сайте.
Отлично, вопрос по добавлению социальных кнопок на сайт думаю решен полностью и вопросов не должно остаться.
Кнопка “добавить в закладки” на сайт
С размещением кнопом социальных служб мы разобрались, а теперь давайте рассмотрим такую интересную и полезную вещь как для коммерческих сайтов, так и для блогов как возможность добавления страниц сайта в панель закладок браузера пользователя.
Возможность добавить в закладки очень хорошо сказывается на продвижении и получении дополнительного траффика так как в закладки в основном добавляют самые интересные и полезные материалы, чтобы в будущем обратиться к ним снова будь то инструкция по созданию чего-либо вроде моей статьи или же просто нужный контент.
Тут нам необходимо немного поработать головой, но Ваш покорный слуга уже все сделал за Вас и вам остается просто скопировать нужный код и вставить как я покажу далее. Все очень просто главное делать как я говорю. Показывать буду также на примере своего блога, кстати, как раз недавно поставил на блог такую кнопку с левой стороны сайта…… не забываем добавлять в закладки мой блог -))))).
В первую очередь нам необходимо попасть в файл index.phpнашего шаблона на Джумла по пути:
.../templates /ваш_шаблон /html /index.php
И вставляем перед закрывающимся тегом <head> вот такой код вызова окна закладок браузера:
<div class=”book”><a onclick=”window.external.AddFavorite(‘http:// firelinks.ru/’); yaCounter6405709.reachGoal(‘zakladki’); return false;” href=”#” class=”test_class1″ rel=”sidebar”></a> </div>
Не забудьте поменять адрес сайта на свой, а то работать ничего не будет. Следующим шагом нам необходимо прописать стили отображения нашего окна.
Идем в наш файл стилей шаблона CSS и в самый низ кода вставляем следующий блок:
.book {
height: 151px;
width: 22px;
padding-left: 0px;
position: fixed;
top: 45%;
left: 0px;
z-index: 5;
background-image: url(“/images/ zakladka. png”);
background-position: -10px -10px;
}
.test_class1 {
position: absolute;
top: 0px;
left: 0px;
display: block;
width: 25px;
height: 151px;
text-decoration: none;
z-index: 1;
}
Ну практически все готово. Остается только в папку images закинуть нашу картинку самой кнопки под названием zakladka.png, как это было указано в самом стиле, но вы можете делать свои картинки и задавать ей свои размеры.
Ниже приложу картинку, которую можете скачать и залить уже к себе на сайт. Вот такими нехитрыми методами можно добавить кнопки социальных сетей на сайт и тем самым улучшить юзабилити своего сайта. Не забываем подписываться на обновления блога.
Всего самого наилучшего и до скорых встреч.
С уважением, Галиулин Руслан.
