|
Как сделать свои социальные кнопки на сайт
|
|
Kosten |
Вторник, 22 Августа 2017, 15:34 | Сообщение 1 |
|
Не могу понять, какие ссылки нужно прописывать в код, сам код представлю, возможно кому пригодиться, только там нет ссылок по открывание окна или переход поделиться. Вот хочется узнать что и какие ссылки ставить, проверил на окне, но там реально большие по знакам ссылки.
Вот такие кнопки под шрифтовые иконки.

Код <ul class="social-list"> <li> <a href="#"><span class="fa-stack fa-lg"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-vk fa-stack-1x"></i> </span></a> </li> <li> <a href="#"><span class="fa-stack fa-lg"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-facebook fa-stack-1x"></i> </span></a> </li> <li> <a href="#"><span class="fa-stack fa-lg"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-google-plus fa-stack-1x"></i> </span></a> </li> <li> <a href="#"><span class="fa-stack fa-lg"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-twitter fa-stack-1x"></i> </span></a> </li> <li> <a href="#"><span class="fa-stack fa-lg"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-instagram fa-stack-1x"></i> </span></a> </li> </ul>
|
| [ RU ] |
|
|
Slavik |
Вторник, 22 Августа 2017, 17:10 | Сообщение 2 |
|
Цитата Kosten (  ) Не могу понять, какие ссылки нужно прописывать в код, сам код представлю Это Material Design Iconic Font можешь выбрать любую иконку, и установить в этот код, код простой и понятный.
Kentos311.uCoz.com - Добро пожаловать в мир читов!
|
| [ RU ] |
|
|
Kosten |
Вторник, 22 Августа 2017, 21:42 | Сообщение 3 |
|
Slavik, про то какие ссылки ставить?
|
| [ RU ] |
|
|
Slavik |
Вторник, 22 Августа 2017, 21:54 | Сообщение 4 |
|
Kosten, Берешь, переходишь на сайт который я указал выше, там выбираешь иконку ту которую тебе нужно, дальше в этом коде замени их class, со стандартными значениями.
Пример твой:
Код <i class="fa fa-vk fa-stack-1x"></i>
Замена на:
Код <i class="zmdi zmdi-group-1x"></i>
Где "замена на", взято с того сайта код иконки, и я подставил -1x Вроде должно работать, я на своем SourceBans ставил, всё работает по сейчас, тут не знаю как на юкозе будет). В любом случаи должно работать
Kentos311.uCoz.com - Добро пожаловать в мир читов!
|
| [ RU ] |
|
|
Kosten |
Среда, 23 Августа 2017, 01:06 | Сообщение 5 |
|
Slavik, это все понятно, по шрифтовым иконкам нет вопроса, вопрос такой, там место для ссылок, как их можно социальных сетей взять, но чтоб по клику там окно появилось или на страницу поделиться выйти могло. То там # вместо ссылок установлен, просто не приходилось в ручную устанавливать.
|
| [ RU ] |
|
|
-SAM- |
Среда, 23 Августа 2017, 06:04 | Сообщение 6 |
|
Kosten, можете посмотреть, как у вас в контейнере ссылки идут, что потом и туда подставить, используя переменные uCoz (на адрес страницы и ее заглавие). Есть много подобных сервисов, что используя api тех ресурсов отсылают им. У вас на сайте от Яндекса кнопки поделиться стоят. Да и, как мне кажется, смысла нет такое прописывать на сайте, по крайней мере, в таком формате - нужно запаковать в виде скрипта это всё, а не пихать довески такие в код, чтоб еще и индексировалось потом лишнее (и ссылки эти)... в общем, не советую ставить так. Скриптом, кстати, можно и адрес страницы документа и его заглавие выудить, а нее использовать переменные uCoz, чтобы потом всё это и запаковать в один скрипт и сжать.
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
|
| [ UA ] |
|
|
First-1 |
Среда, 23 Августа 2017, 09:11 | Сообщение 7 |
|
Цитата Kosten (  ) Не могу понять, какие ссылки нужно прописывать в код
Код <li> <a class="social_share vk" data-type="vk" rel="nofollow"><span class="fa-stack fa-lg"> <i class="fa fa-square-o fa-stack-2x"></i> <i class="fa fa-vk fa-stack-1x"></i> </span></a> </li>
Цитата -SAM- (  ) чтоб еще и индексировалось потом лишнее
|
| [ UA ] |
|
|
-SAM- |
Среда, 23 Августа 2017, 09:38 | Сообщение 8 |
|
First, ты хоть понял чего выложил? Про rel="nofollow" тут писать не нужно, как и анкор заполнен не ссылкой (нет href). Это из разряда "слышал звон, да не понял, откуда он"... а всё потому, что нужно еще скрипт подключать помимо всего прочего. Вот первые статейки из Google: Доступно только для пользователей И под всем лишним я имел весь код на вывод этих кнопок, который полностью лишний в плане индексации.
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
|
| [ UA ] |
|
|
-SAM- |
Среда, 23 Августа 2017, 10:16 | Сообщение 9 |
|
Ну и правильно про Хабрахабр упомянули в одной из статей, ссылку на которую дал, что введя в тот же Google запрос "Хабрахабр поделиться в соц. сетях" - выдаст еще темы, где этот вопрос разбирался (что свои кнопочки делали, да отправляли в share и принимали инфу оттуда по количеству уже добавленных страниц, счётчики). Доступно только для пользователей пример такой статейки. Это всё на любителя поковыряться рассчитано, что своё привыкли делать, а в большинстве случаев "изобретать велосипед" такой не станут - просто готовые сервисы использовать будут.
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
|
| [ UA ] |
|
|
-SAM- |
Среда, 23 Августа 2017, 10:50 | Сообщение 10 |
|
Помог? Скажи спасибо в виде "+" - вам мелочь, а мне приятно. Бесплатное оказание помощи в ответах на "Вопросы про uCoz".
|
| [ UA ] |
|
|
First-1 |
Среда, 23 Августа 2017, 11:03 | Сообщение 11 |
|
Цитата -SAM- (  ) First, ты хоть понял чего выложил? Не понял видно ты, а увидел только звон в моем посте, и дурака с меня делать не нужно. А дал в таком виде так как скрипт на тот шаблон, что кнопки он эти поставил давно уже есть, ещё с тех пор как ставил его.
|
| [ UA ] |
|
|
First-1 |
Среда, 23 Августа 2017, 11:34 | Сообщение 12 |
|
Цитата -SAM- (  ) анкор заполнен не ссылкой (нет href) Не смеши. Тут мы получаем параметры через data
|
| [ UA ] |
|
|
Kosten |
Среда, 23 Августа 2017, 14:51 | Сообщение 13 |
|
First, поставил, все работает, но только на одну социальную сеть в контакте.
Также не хватала класса style="cursor:pointer;" это что отвечает за клик при наведение, если у кого нет этого эффекта, то вот статья как поставить.
|
| [ RU ] |
|
|
Kosten |
Среда, 23 Августа 2017, 15:03 | Сообщение 14 |
|
Можно такие ссылки поставить, то там полностью окно открывается.
Код http://www.facebook.com/sharer.php?s=100
Но есть как First сделал, что поставил в контакте и нормально в небольшом окне идет.
|
| [ RU ] |
|
|
First-1 |
Среда, 23 Августа 2017, 15:07 | Сообщение 15 |
|
vk - В контакте ok - Одноклассники fb - Facebook lj - ЖЖ tw - Twitter gg - Google+ mr - Mail.Ru
Шаринга для инстаграм нет
|
| [ UA ] |
|
|