Автор Тема: Добавить иконку "Избранное" рядом с корзиной  (Прочитано 46 раз)

20 Сентября 2016, 14:27:08
  • Новичок
  • *
  • Сообщений: 13
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Здравствуйте, гуру.
Появилась потребность добавить иконку с ссылкой на раздел "Избранное", рядом с корзиной.
В идеале, было бы отлично, чтобы иконка была реализована с помощью CSS Font Awesome:
<i class="fa fa-star" aria-hidden="true"></i>Но, подойдет и просто картинка в виде звездочки с ссылкой. Главное, чтобы она была закреплена слева от иконки корзины.
Ссылка на сайт: http://banuskids.com
Подскажите пожалуйста, как это сделать?
P.S. Версия PrestaShop 1.6.1.7., шаблон Jakiro

20 Сентября 2016, 15:07:57
Ответ #1
  • Модератор
  • Ветеран
  • *****
  • Сообщений: 85948
  • Репутация: +25399/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Добавьте код ссылки в шаблон /themes/default-bootstrap/modules/blockuserinfo/nav.tpl.
Для показа иконки с помощью CSS Font Awesome добавьте описание стилей в файл  /themes/default-bootstrap/css/global.css.
20 Сентября 2016, 16:16:05
Ответ #2
  • Новичок
  • *
  • Сообщений: 13
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Добавьте код ссылки в шаблон /themes/default-bootstrap/modules/blockuserinfo/nav.tpl.
Для показа иконки с помощью CSS Font Awesome добавьте описание стилей в файл  /themes/default-bootstrap/css/global.css.

Спасибо за Ваш ответ. Но ссылка должна быть слева от "Корзины", а не возле "UserInfo".

У меня есть модуль: public_html/themes/jakiro/modules/xprtblockcart

Есть файл: xprtblockcart.tpl

Вот его содержимое:

<!-- MODULE Block cart -->
{if isset($xprtblockcart_top) && $xprtblockcart_top}
<div class="shopping_cart_area {if $PS_CATALOG_MODE} header_user_catalog{/if}">
{/if}
<div class="shopping_cart">
<a href="{$link->getPageLink($order_process, true)|escape:'html':'UTF-8'}" title="{l s='View my shopping cart' mod='xprtblockcart'}" rel="nofollow">
<b>{l s='Cart' mod='xprtblockcart'}</b>
(<span class="ajax_cart_quantity">{$cart_qties|intval}</span>)
<span class="ajax_cart_product_txt{if $cart_qties != 1} unvisible{/if}">{l s='Product' mod='xprtblockcart'}</span>
<span class="ajax_cart_product_txt_s{if $cart_qties < 2} unvisible{/if}">{l s='Products' mod='xprtblockcart'}</span>
<span class="ajax_cart_total{if $cart_qties == 0} unvisible{/if}">
{if $cart_qties > 0}
{if $priceDisplay == 1}
{assign var='xprtblockcart_cart_flag' value='Cart::BOTH_WITHOUT_SHIPPING'|constant}
{convertPrice price=$cart->getOrderTotal(false, $xprtblockcart_cart_flag)}
{else}
{assign var='xprtblockcart_cart_flag' value='Cart::BOTH_WITHOUT_SHIPPING'|constant}
{convertPrice price=$cart->getOrderTotal(true, $xprtblockcart_cart_flag)}
{/if}
{/if}
</span>
....и тд
<!-- /MODULE Block cart -->

Я добавляю код с ссылкой:

<div class="favor">
<a href="http://banuskids.com/module/blockwishlist/mywishlist">
<img border="0" alt="Favorites" src="http://chyzhovy.ru/wp-content/uploads/2016/09/star.png" width="16" height="16">
</div>

В CSS файл mod_style.css добавляю:

#header .favor {
  position: relative;
  float: right;
  margin-left: 20px;
}

Результат на скриншоте: http://chyzhovy.ru/wp-content/uploads/2016/09/2.png

Подскажите, пожалуйста, как поправить, чтобы все было на своих местах и иконка была просто слева от иконки корзины с небольшим отступом?
20 Сентября 2016, 16:20:54
Ответ #3
  • Администратор
  • Ветеран
  • *****
  • Сообщений: 102466
  • Репутация: +34217/-0
    • Просмотр профиля
Цитировать
иконка была просто слева от иконки корзины с небольшим отступом?
float:left;
margin-right: 10px;
20 Сентября 2016, 16:23:35
Ответ #4
  • Новичок
  • *
  • Сообщений: 13
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Цитировать
иконка была просто слева от иконки корзины с небольшим отступом?
float:left;
margin-right: 10px;

Тогда получается вот так:
http://chyzhovy.ru/wp-content/uploads/2016/09/3.png
20 Сентября 2016, 16:36:52
Ответ #5
  • Партнер
  • Ветеран
  • ****
  • Сообщений: 22094
  • Репутация: +17108/-1
  • Разработка веб-сайтов и веб-программирование
    • Просмотр профиля
Вы измените стили для
.shopping_cart_area  {
  float: right;
  margin-left: ...px;
  padding-right: ..px;
  position: relative;
}
Потом можно будет двигать блоки внутри этого класса.
Интернет-магазин под ключ.
Какой выбрать движок для интернет магазина ?
Какой движок лучше ?
Magento или Prestashop ?
Решение всех Ваших вопросов в создании Интернет-магазина.