Thin Theme Документация

Назначение файлов в пакете

  • INSTALL_ADDON_ThinTheme_vX_X_410x-4xx_cs_cart_version_XXXX-XX-XX.zip – модуль установки Thin Theme
  • icons_pack_for_menu from_demo.zip – aрхив иконок для меню использованных в демо темы, они как вспомогательный материал. Это не модуль.
  • layouts_ThinTheme_blog_05252017.zip – это архив с макетом блога.
    Это не модуль. Установка
  • ath_pie_vX_X_435-45x_cs_cart_version_XXXX-XX-XX.zip – пакет для установки модуля “Эффекты для Изображений Продукта” (установка не обязательна)
  • previous_and_next_vX_X_XXXX-XX-XX.zip – пакет для установки модуля “Предыдущий и Следующий Товар” (установка не обязательна)
  • Checkout_layout_for_4.10.1.zip – это макет страницы заказа, нужен для обновления до CS-Cart 4.10.1
  • Пакеты темы для старых версий CS-Cart предоставлчем по запросу

A) Установка вверх

1. Загрузка

  1. Скачайте модуль
  2. Перейдите в Панель Администратора > Модули > Управление модулями
  3. Нажмите на [+] чтобы открыть диалоговое окно загрузки
  4. Выберите удобный для вас способ:
    Загрузить: zip архив храниться на вашем компьютере
    Сервер: zip архив храниться на вашем сервере
    URL: у вас есть прямая ссылка на zip архив
  5. После того как вы выбрали zip архив для соответствующей версии CS-Cart, пожалуйста, нажмите кнопку Загрузить и установить
  6. Очистите кэш, выберите Администрирование > Хранилище данных > Очистить кэш

2. Активация лицензии

  1. Откройте страницу настроек модуля Панель Администратора > Модули > Управление модулями >
    [TH] Настройки темы Thin
  2. Во вкладке Активация введите Номер лицензии
  3. Сохраните настройки и вернитесь на страницу Управление модулями
  4. В строке с названием модуля, выберите Вкл.
  5. Очистите кэш, выберите Администрирование > Хранилище данных > Очистить кэш

3. Активация темы

  1. Перейдите в Панель Администратора > Дизайн > Темы
  2. Выберите вкладку Просмотреть все доступные темы
  3. Наведите курсор на “Thin theme” и нажмите кнопку Установить
  4. Затем активируйте тему во вкладке Установленные темы

Это всё, тема установлена.

Демонстрационные банеры устанавливаются автоматически, Расширенное меню требует самостоятельной настройки


В теме есть возможность использовать логотип в формате SVG.

  1. Оптимизируйте SVG файл, для этого вы можете воспользоваться онлайн сервисом SVGOMG!
  2. Откройте файл в текстовом редакторе и скопируйте текст
  3. Перейдите в Панель Администратора > Дизайн > Макеты
  4. Выключите блок Logo
  5. Активируйте блок Logo SVG
  6. Нажмите [шестеренку] и выберите вкладку Контент
  7. Вставте скопированный код внутрь тега <a>
    <a href="{""|fn_url}" title="{$logos.theme.image.alt}">
       заменить на SVG код
    </a>

SVG является векторным форматом, поэтому при масштабировании качество изображения не ухудшается. Так же при подключении SVG описаным выше способом, не происходит дополнительного запроса к серверу.

Чтобы заменить логотип на изображение

  1. Перейдите в Дизайн > Темы
  2. Нажмите кнопку Редактор тем рядом с активным макетом
  3. В новой вкладке, вы увидите свой магазин с панелью Редактор тем
  4. В выпадающем списке РЕДАКТИРОВАТЬ выберете Логотипы
  5. После редактирования сохраните изменения, нажав Сохранить и нажмите [X] чтобы закрыть редактор

C) Изменение цветовой схемы вверх

  1. Перейдите в Дизайн > Темы
  2. Нажмите кнопку Редактор тем рядом с активным макетом
  3. В новой вкладке, вы увидите свой магазин с панелью Редактор тем
  4. В выпадающем списке РЕДАКТИРОВАТЬ выберете Цвета
  5. После редактирования сохраните изменения, нажав Сохранить и нажмите [X] чтобы закрыть редактор

D) Изменение стилей вверх

Файлы стилей не должен быть изменены, это может привести к некорректной работе темы. Если необходимо переопределить или добавить стили, пожалуйста, используйте Редактор тем

  1. Перейдите в Дизайн > Темы
  2. Нажмите кнопку Редактор тем рядом с активным макетом
  3. В новой вкладке, вы увидите свой магазин с панелью Редактор тем
  4. В выпадающем списке РЕДАКТИРОВАТЬ выберете Пользовательские CSS
  5. В текстовое поле вы можете добавить свои стили
  6. После редактирования сохраните изменения, нажав Сохранить и нажмите [X] чтобы закрыть редактор

E) Секции на всю ширину вверх

Вы можете с легкостью сделать секцию на всю ширину экрана

В настройках секции добавьте Пользовательский CSS-класс и в настройкеВся ширина выберите Да

Для того что бы секция могла быть сделана на всю ширину, необходимо выполнить два услови

  1. У секции не должно быть родительской секции (секция без вложенности)
  2. Ширина – 16

В теме есть классы с заданным фоном

  • .accent_bg_section – Основной цвет акцентa
  • .content_bg_section – Специальный фон
Fill width section

F) Банеры с тектом вверх

В тему имеется дополнительный вариант отображения графических баннеров. Текст добавляется через настройки блока. Текст задается в виде языковых переменных.

Banners with text


G) Расширенное Меню вверх

Для того что бы создать Расширенное Меню

  1. Перейдите в Панель Администратора > Дизайн > Меню
  2. Нажмите [+] для того что бы открыть диалоговое окно “Новое меню”
  3. Введите название и нажмите Создать
  4. Выберите созданное меню
  5. Нажмите на кнопку [+], чтобы открыть диалоговое окно “Добавить запись(-и)”

Пункты меню 1-го уровня имеют два вида

  1. Все категории (1) – отобразить все категории и баннеры к ним
  2. По умолчанию – отображение пунктов меню и подменюНастройки:
    • Тип отображения – specifies how to display submenu
    • Вывести справа (9) – sets the alignment of the element on the right edge
    • Иконка (2) – изображение для пункта меню
    • SVG Иконка (2) – поле для вставки SVG кода

Меню 2-го уровня имеют два вида

  1. По умолчанию (8) – пункты меню отображать как меню по умолчанию
  2. Текст (7) – пункт меню отображается как wiziwig контент

Все категории

Оно создается автоматически. Содержание определяется на странице настроек категорий

  • Иконка (2) – изображение для пункта меню
  • SVG Иконка (3) – поле для вставки SVG кода
  • Банеер (5) – баннер для категорий первого уровня
  • URL баннера – ссылка для баннера
  • Изображения (4) – отображается под названием категории второго уровня без дочерних категорий


Для создания пункта меню “Контакты”, выполните следующие действия.

Создаем пункт “Контакты”, для него выбираем

  • Тип контента: по умолчанию
  • Тип отображения: Список
  • Вывести справа: Выбрано

Cоздаем подпункт “Информация”

  • Родительский элемент: Контакты
  • Тип контента: Текст
  • Пользовательский CSS-класс: ath_mega-menu__contacts

В визуальном редакторе выбираем режим “Код”, в него вставляем следующий html:

<h4><i class="icon-tt-pin"></i> Адрес:</h4>
<p>3993 Hanover Street, <br>New York, NY 10016
</p>
<p><br>
</p>
<h4><i class="icon-tt-mail"></i> Email:</h4>
<p><a href="mailto:sales@example.com">sales@example.com</a>
</p>
<p><br>
</p>
<h4><i class="icon-tt-phone"></i> Телефон:</h4>
<p>+1 917-722-7425
</p>
<p>(звонок бесплатный)
</p>
<p><br>
</p>
<h4><i class="icon-tt-clock"></i> Часы работы</h4>
<p>10:00 — 6:00
</p>
<p>С понедельника по пятницу
</p>

После, когда меню готово, перейдите Панель Администратора > Дизайн > Макеты и в блоке MegaMenu во вкладке Контент выберите созданное меню

Важно! Расширенное меню предназначено для основного меню сайта, потому рекомендуется использовать только одно меню данного вида.


H) Каталог категорий вверх

Количество столбцов на странице категорий устанавливается в настройках модуля


I) Блог вверх

В теме стилизован модуль Блог компании SIMTECH входящий в базовый CS-Cart

Количество колонок на странице блога устанавливается в настройках модуля

layouts_ThinTheme_blog_05252017.zip – это макет блога, чтобы установить его, выполните следующие действия

  1. Перейдите в Дизайн > Макеты > Шестеренка рядом с плюсом > Импортировать макет
  2. В открывшемся окне выберите “Обновить текущий макет” > “Заменить страницы макета при совпадении”
  3. Загрузите разархивированный файл

J) Иконочный шрифт вверх

В теме используется иконочный шрифт:

Для того что бы изменить иконку, например – в блоке бесплатная доставка, необходимо заменить следующий код

<i class="icon-tt-gift"></i>

на

<i class="icon-tt-clock"></i>

это заменит иконку подарка на иконку часов


K) Обновление темы вверх

Для обновления темы выполните следующие действия
  • сделайте полный бекап магазина
  • закройте магазин
  • установите модуль темы поверх старой версии не удаляя предыдущую
  • обновите кэш
  • по необходимости внесите изменения, которые могут быть стерты при обновлении, если вы изменяли файлы темы напрямую
  • проверьте что все удачно обновилось
  • откройте магазин

Для обновления языковых переменных и настроек модуля:

  • Перейдите в девелоперский режим
  • Для этого в файле local_conf.php добавьте define(‘DEVELOPMENT’, true);
    В случае отсутствия файла создайте его
  • Обновите кэш
  • На странице модулей в выпадающем списке напротив модуля “[TH] Настройки темы Thin” выберите “Обновить”
  • Вернитесь в обычный режим магазина

Для магазинов использующих цветовые схемы созданные до версии 3.0

Обновление цветовой схемы:
  • На странице тем переключитесь на цветовую схему “Crimson”
  • Запустите “Редактор тем”
  • В нем выберите свою цветовую схему и сохраните её.
  • Новые цветовые переменные будут заданы белым цветом. По необходимости замените их
Для доступа к актуальной версии продукта и его поддержке необходима подписка.

Вы можете обновиться самостоятельно или написать нам на support@themehills.com

Обновления макета для CS-Cart 4.10.1

Checkout_layout_for_4.10.1.zip – это макет страницы заказа, чтобы установить его, выполните следующие действия

  1. Перейдите в Дизайн > Макеты > Шестеренка рядом с плюсом > Импортировать макет
  2. В открывшемся окне выберите “Обновить текущий макет” > “Заменить страницы макета при совпадении”
  3. Загрузите разархивированный файл


L) Часто задаваемые вопросы вверх

  • Ошибка: Размер файла слишком большой. Максимальный размер загрузки 2M.

    Проблема вызвана тем, что у вас есть ограничение на сервере.
    Пожалуйста, обратитесь в службу технической поддержки Вашего сервера, чтобы увеличить это значение.
    – или –
    Распакуйте архив и скопируйте его содержимое в корневой каталог магазина.

  • Корзина выглядит не так, как в теме

    Вероятнее всего у вас включен модуль “Стили и дополнения для русской темы“, начиная с версии CS-Cart 441 он не требуется, его необходимо выключить.

  • Как сделать пункт меню Контакты как на демо

    Способ подробно описан в пункте Расширенное Меню

  • Как сделать блоки с баннерами “популярное” в 4 или 5 колонок?

    Для этого необходимо у секции заменить пользовательские классы “col_3 col_3–special” на “col_4 col_4–special” и “col_5 col_5–special” соответственно

  • Как сменить логотип используемый по умолчанию для вендоров?

    Замените файл design/themes/thin_theme/media/images/logo.png на свой и очистите кэш.


Список изменений

3.08 (20 Sep 2019)
Добавили настройку для перемещения описания категории под продукты
Добавили настройку для скрытия текста у иконки аккаунт
Исправления лейблов на мобильном виде
Актуализация продукт даты и страниц товара

3.07 (26 Aug 2019)
Добавили иконки платежных систем:
- Apple Pay
- Google Pay
Обновили иконочный шрифт, добавили:
- WhatsApp
- Viber
Добавили настройку возвращающий в лейблы процент скидки

3.06 (17 Jul 2019)
Обновление для версии 4.10.3
(/design/themes/thin_theme/templates/blocks/product_templates/default_template.tpl)
Обновлены макеты
Обновлены языковые переменные

3.05 (10 Jul 2019)
Обновлены макеты, исправлен баг при установке
Функционал "блок на всю ширину" перенес в хук
Изменен блок "SVG иконки платежных систем"
Незначительные исправления в стилях

3.04 (02 Jun 2019)
Обновление для 4.10.1

3.03 (20 Dec 2018)
исправление расширенного меню

3.02 (14 Dec 2018)
исправления цветовых схем
исправлена совместимость с модулем мега меню

3.01 (23 Nov 2018)
исправление приоритета модуля для корректной работы с баннерами

3.00 (19 Nov 2018)
5 новых цветовых схем
изменен блок SVG иконок платежных систем
обновлены макеты
добавлены языковые переменные
новые настройки цветов в редакторе тем
исправлена работа rtl меню для андройда
изменена работа поиска по категориям

2.21 (1 Oct 2018)
фиксы для расширенного меню
изменен приоритет модуля

2.20 (9 Sept 2018)
фиксы для расширенного меню
добавлен блок с категориями в макет

2.19 (9 Apr 2018)
обновление лицензии
фикс RTL
фикс лейаутов
фикс баннеров

2.18 (28 Feb 2018)
обновление лицензии

2.17 (9 Feb 2018)
актуалированны шаблоны до 4.7.2
обновлен новый блок списка вендоров

2.16 (9 Jan 2018)
обновлен продукт дата для корректной работы списка вариаций на карточке товара
обновлена карточка товара

2.15 (6 Dec 2017)
исправлен Lazy Load для IE

2.14 (29 Nov 2017)
добавлен русский лейаут
блок с категориями исправлен
добавлен бекап меню

2.13 (3 Nov 2017)
добавлен блок с категориями

2.12 (31 Octb 2017)
поддержка модуля мега меню
поддержка Emerald Theme

2.11 (21 Oct 2017)
Фикс Lazy Load
Сообщение о недоступности сервера лицензий

2.10 (21 Sept 2017)
Фикс для мега меню на десктопе

2.7 (7 March 2017)
поддержка мультивендора
добавлена возможность сделать блоки в секции новинки по 4 и 5 колонок
добавлен баннер на странице распродажи
добавлено изображение для страницы Gift certificates
в мега меню добавлен возможность скрыть цену и язык
в мега меню добавилась настройка количества элементов в отображении "количество категорий"
исправления
русская документация

2.6 (16 February 2017)
добавлено отображение кнопок “купить в один клик”
добавлен хук на детальной странице products:add_to_cart

2.5 (13 February 2017)
исправления: колонки в wysiwyg, добавлен фон для текста 
обновлены файлы иконок: добавлены вконтакте и одноклассники

2.9 (29 Jun 2017)
исправления верстки
поддержка новой функций для мультивендора
в тестовом режиме добавили lazyload для изображений (возможно отключить)
возможность ограничивать количество элементов для мега меню
много исправлений для RTL версии
добавили возможность указать размеры для изображений блога
улучшили настройки темы при установке						
5% Discount
No prize
Next time
Almost!
10% Discount
15% Discount
No Prize
No luck today
Almost!
50% Discount
No prize
Unlucky
Get your chance to win a price!
Enter your email address and spin the wheel. This is your chance to win amazing discounts!
Our in-house rules:
  • One game per user
  • Cheaters will be disqualified.