Модуль "Блок соц. сетей". Добавить логотип VK

Автор Dacent, 31 марта 2014, 15:44:49

« назад - далее »

Dacent

Подскажите, каким образом можно в стандартный модуль "Блок соц. сетей" добавить ссылку на сеть "Вконтакте"?
Как вариант  - можно использовать одну из неиспользуемых сетей, например Pinterest.
Только надо заменить логотип Pinterest  на VK.
Где находятся логотипы, и как можно сделать замену?


Adik


Dacent

#2
В modules/blocksocial/blocksocial.tpl о логотипе упоминания нет.
Например, хочу заменить лого pinterest на vkontakte.
Вот что сейчас в фале blocksocial.tpl

{/if}
{if $pinterest_url != ''}<li class="pinterest"><a href="{$pinterest_url|escape:html:'UTF-8'}">{l s='Pinterest' mod='blocksocial'}</a></li>{/if}

Насколько я понял, надо копать в сторону <li class="pinterest">
Только как и что - не понятно.

P.S. Prestashop 1.6.0.5
В предыдущих версиях замена логотипов вроде проще делалась.

coder

В стилях global.css иконки определены
.footer-container #footer #social_block ul li.facebook a:before {content: "\f09a"; }
.footer-container #footer #social_block ul li.twitter a:before {content: "\f099"; }
...

Поставьте firebug тогда сможете легко определить что  и где менять.

Dacent


jazz2000

Цитата: coder от 01 апреля 2014, 11:45:23
В стилях global.css иконки определены
.footer-container #footer #social_block ul li.facebook a:before {content: "\f09a"; }
.footer-container #footer #social_block ul li.twitter a:before {content: "\f099"; }
...

Поставьте firebug тогда сможете легко определить что  и где менять.
Скажу честно, не сразу понял что надо сделать. Для тех, кто тоже понял не полностью: картинки соц сетей прописаны кодами, в файле global.css. Код ВКонтакте "f189". Заменяем на этот код, код не используемой соц сети (у меня пинтерест) в файле global.css. Выходит:

.footer-container #footer #social_block ul li.pinterest a:before {
            content: "\f189"; }

А в модуле "Блок соц. сетей" ставим ссылку вконтакте в строке пинтереста. 

oleg1394


Adik

Какой добавите в стили такой и будет. В стандарной теме prestashop 1.6 коды иконок для модуля соц. сетей:
.footer-container #footer #social_block ul li.facebook a:before {content: "\f09a"; }
.footer-container #footer #social_block ul li.twitter a:before {content: "\f099"; }
.footer-container #footer #social_block ul li.rss a:before {content: "\f09e"; }
.footer-container #footer #social_block ul li.youtube a:before {content: "\f167"; }
.footer-container #footer #social_block ul li.google-plus a:before {content: "\f0d5"; }
.footer-container #footer #social_block ul li.pinterest a:before {content: "\f0d2"; }

oleg1394

а вот выше писал кто-то просто поменял соц сеть принтест на вк, просто поменял код (f и цифры) например я хочу юту поменять, для иконки истаграм какие цифры?

oleg1394

Код ВКонтакте "f189"
а для инстаграма есть такой?


-SiGi-

Для иконки истаграм класс уже есть
http://fortawesome.github.io/Font-Awesome/icon/instagram/
Можно наверное просто поменять класс в шаблоне.

rooffer

Цитата: jazz2000 от 10 июня 2014, 12:34:41
Цитата: coder от 01 апреля 2014, 11:45:23
В стилях global.css иконки определены
.footer-container #footer #social_block ul li.facebook a:before {content: "\f09a"; }
.footer-container #footer #social_block ul li.twitter a:before {content: "\f099"; }
...

Поставьте firebug тогда сможете легко определить что  и где менять.
Скажу честно, не сразу понял что надо сделать. Для тех, кто тоже понял не полностью: картинки соц сетей прописаны кодами, в файле global.css. Код ВКонтакте "f189". Заменяем на этот код, код не используемой соц сети (у меня пинтерест) в файле global.css. Выходит:

.footer-container #footer #social_block ul li.pinterest a:before {
            content: "\f189"; }

А в модуле "Блок соц. сетей" ставим ссылку вконтакте в строке пинтереста. 
Спасибо за подробное объяснение. Все работает. Жаль только иконка не с русской буквой "В", а с английскими "vk".
Кто-нибудь знает есть ли там иконка для одноклассников и какой у нее код?
Пробовал искать на этом сайте http://fontawesome.veliovgroup.com/
Там ничего не нашел для одноклассников.
P.S. Там даже для вконтакте ничего нет, хотя иконка в шрифте есть...

rooffer

#13
В продолжение темы.
Нашел иконочный шрифт, в котором есть одноклассники. Шрифт называется brandico.
Пробовал вставлять по инструкции с этого сайта http://weloveiconfonts.com
Вместо иконок вставились просто слова.
Вот код, который вставлял
          .footer-container #footer #social_block ul li.facebook a:before {
            content: "brandico-vkontakte-rect"; }
          .footer-container #footer #social_block ul li.twitter a:before {
            content: "brandico-odnoklassniki-rect"; }

DarinSr