Opencart 2.1 - Информация В Карточке Товара (1 Часть)

Тема в разделе "Модули и дополнения", создана пользователем admin, 12 сен 2016.

  1. TopicStarter Overlay
    Offline

    admin Команда форума Администратор

    Сообщения:
    2.317
    Симпатии:
    75.692
    Репутация:
    170
    Всем привет, в этой статье мы вставим в карточку товара информацию для покупателей нашего интернет магазина, в этой статье мы воспользуемся самым простым и самым быстрым вариантом (в следующий раз рассмотрим чуть более сложный вариант – если конечно вы проявите к этой статье интерес).

    OpenCart-20.jpg


    1. Подберём пару иконочных символов на http://fontawesome.io/icons/, в моём случае это:

    Код:
    <i class="fa fa-envelope" aria-hidden="true"></i>
    <i class="fa fa-phone-square" aria-hidden="true"></i>
    2. Откроем файл ../catalog/view/theme/default/template/product/product.tpl и после этих строк (326-329):

    Код:
    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_default_style"><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a> <a class="addthis_button_tweet"></a> <a class="addthis_button_pinterest_pinit"></a> <a class="addthis_counter addthis_pill_style"></a></div>
    <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-515eeaf54693130e"></script>
    <!-- AddThis Button END -->
    вставим эти:

    Код:
    <div id="info_product">
    <div id="text">Возникли вопросы по товару ?</div>
    Звоните <i class="fa fa-phone-square" aria-hidden="true"></i><div id="mobile">+7 (925) 200-00-77</div><br>
    или пишите <i class="fa fa-envelope" aria-hidden="true"></i><div id="mail"><a href="mailto:mail@mail.ru">mail@mail.ru</a></div>
    </div>
    (телефон и почту вставьте свои)

    3. Откроем файл ../catalog/view/theme/default/stylesheet/stylesheet.css и в конец файла вставим эти строки:

    Код:
    #info_product {
    border: 2px solid #23a1d1;
    color: #000;
    padding: 10px;
    font-size: 14px;
    }
    #info_product .fa {
    color: #23a1d1;
    padding-left: 5px;
    padding-right: 5px;
    }
    #mobile, #mail {
    display: inline-block;
    color: #000;
    padding-top: 5px;
    font-size: 12px;
    }
    Результат:

    info_block_01.png

    Надеюсь статья была вам полезна, следите за нашими новостями и до новых встреч.

    Источник
     
    Horosho нравится это.
  2. Offline

    Цапыч Пользователь

    Сообщения:
    8
    Симпатии:
    1
    Репутация:
    0
    Статья была полезна, подскажите, как сделать рамку вокруг текста описания товара в карточке товара
     
  3. Offline

    gvozdkoff Пользователь

    Сообщения:
    4
    Симпатии:
    1
    Репутация:
    0
    Сделал все по инструкции, залил измененные файлы, обновил страницу - результата нет, почистил и обновил модификаторы, открыл др. браузер, удалил историю, куки и т.д. Зашел на сайт, обновил страницу - результат снова не виден.
    Что я делаю не так?
    ps/ opencart 2.1.0.2
     
  4. TopicStarter Overlay
    Offline

    admin Команда форума Администратор

    Сообщения:
    2.317
    Симпатии:
    75.692
    Репутация:
    170
    подключите CDN - https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css