Скрипт социальные закладки на ваш сайт
Трудно представить сайт без социальных закладок под материалом или на главной странице, здесь подборка горизонтальных кнопок. Которая идет в светлом дизайн и на них размещены кнопки соответствующих социальных площадок. Они созданы под вид материалов и комментариев к нему, это там где будет написана статья или размещены разные файлы, чтоб скачать. Основном администратор сайта берет скрипты на разных сервис, что иногда сильно тормозит сайт при их загрузки. Здесь они будут автономны и только зависеть от вашего интернет ресурса. С ними идут стили, а это означает, вы по дизайн из можете изменить, ко кроме самой кнопки, так как она на ссылке. Проверены материал на работоспособность и все отлично открывает и отправляет. Так они реально будут смотреться и настроены по умолчанию. Приступаем к установке: 1. Ставим там где нужно, но не забываем, что они горизонтально будут расположены. 2. Потом находим ссылку "http://zornet.ru" у каждой кнопки и убираем ее и ставим свою, чтоб от вашего портала работало. Код <div class="news_btn" align="center"> <div class="vk_btn"><a href="http://connect.mail.ru/share?url=http://zornet.ru" target="_blank"><span><img src="http://zornet.ru/Aben/ABGER/mail.png" title="$SITE_NAME$" alt="Mail.ru" />Мне нравится</span></a></div> <div class="vk_btn"><a href="http://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl=http://zornet.ru" target="_blank"><span><img src="http://zornet.ru/Aben/ABGER/od.png" title="Поделиться с друзьями на Одноклассниках $SITE_NAME$!" alt="Одноклассники" />Мне нравится</span></a></div> <div class="vk_btn"><a href="http://vk.com/share.php?url=http://zornet.ru" target="_blank"><span><img src="http://zornet.ru/Aben/ABGER/vk.png" title="Мне нравится новость: $SITE_NAME$!" alt="Вконтакте" />Мне нравится</span></a></div> <div class="vk_btn"><a href="https://www.facebook.com/sharer.php?u=http://zornet.ru" target="_blank"><span><img src="http://zornet.ru/Aben/ABGER/fb.png" title="Поделиться новостью в Facebook" alt="Я.ру" />Мне нравится</span></a></div> <div class="vk_btn"><a href="http://twitter.com/share" target="_blank"><span><img src="http://zornet.ru/Aben/ABGER/tw.png" title="Твиттнуть" alt="Google" />Твиттнуть</span></a></div> </div> <div class="clr"></div> </div> CSS Код .news_btn {overflow:hidden; clear:both; margin:5px 0 0 0;} .vk_btn {font-size:11px; display:block; float:left; margin:0 5px 0 0;} .vk_btn a {color:#2b5e81;} .tw_btn {font-size:11px; display:block; float:left; margin:0 5px 0 0; } .tw_btn a {color:#2b5e81;} .ya_btn {font-size:11px; display:block; float:left; margin:0 5px 0 0;} .ya_btn a span:first-letter {color:#2b5e81;} .google_btn {font-size:11px; display:block; float:left; margin:0 5px 0 0;} .google_btn a {color:#2b5e81;} .code_btn {font-size:11px; display:block; float:right;} .code_btn a {color:#72990e;} .news_btn a, .news_btn a span {float:left; max-width:290px; overflow:hidden; height:30px; padding: 0 0 0 5px; background: url('http://zornet.ru/Aben/ABGER/soc_btn.png') no-repeat; } .news_btn a span {display:block; line-height:27px; padding: 0 8px 0 0; background-position: 100% 100%;} .news_btn a span img {vertical-align:middle; margin:0 5px 0 0;} .news_btn a:hover {text-decoration:none;} PS - проверка происходила на светлом по стилистике сайта, и там они отлично вписываются в основу. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 1 | |
| |