July - адаптивный шаблон для ocStore/Opencart 1.5.4.x-1.5.6.x v2

Если Вы хотите иметь уникальный, привлекательный дизайн и пытаетесь сделать свой стиль среди многочи

  1. admin
    july_screen.jpg
    July тема
    - позитивный и чистый шаблон. Если Вы хотите иметь уникальный, привлекательный дизайн и пытаетесь сделать свой стиль среди многочисленных владельцев магазинов, July тема является прекрасной отправной точкой для Вас.

    may.jpg june.jpg july.jpg

    Установка шаблона

    » Шаг 1: Все файлы, необходимые для загрузки можно найти в папке ‘FILES TO UPLOAD’. 4 папки: 'admin', 'catalog' , 'image' and 'vqmod'. Вам нужно переместить эти папки(admin, catalog, image, vqmod) из папки FILES TO UPLOAD в корневую директорию Вашего сайта, не удаляя папки дистрибутива магазина с такими же именами.


    Скопируйте файлы в Вашу рабочую версию ocStore
    upload.png » Шаг 2 : Установите vQmod (если он ещё не установлен на Вашем сайте)

    - Папку 'vqmod' из архива 'vqmod-2.4.1-opencart.zip' поместите в корневую директорию Вашего сайта. Не удаляйте существующую уже папку vqmod!

    » Шаг 3 :Для завершения установки vqmod перейдите по ссылке
    http://your-domain.com/vqmod/install
    где your-domain.com - ваш домен.


    » Шаг 4: Перейдите в Каталог / Система / Пользователи / Группы пользователей / Главный администратор и выделите все галочки.

    » Шаг 5: Перейдите в Каталог / Управление стикерами и нажмите на кнопку ПРИМЕНИТЬ для создания полей для стикеров товаров в Вашей БД.

    stickers.png

    » Шаг 6: В административной панели (http://your-domain.com/admin) активируйте тему Julytheme.

    check_theme.png
    Размеры изображений
    Перейдите в Система / Настройки/ Изображения и убедитесь, что вы используете значения, указанные ниже:

    image.png
    » Шаг 7: Активируйте новые модули шаблона.

    install.png

    Модуль "July Тема"
    В модуле "July Тема" Вы можете управлять настройками темы
    [​IMG]
    ОСНОВНЫЕ НАСТРОЙКИ
    • Отображение
      • - Быстрый заказ
      • - Быстрый просмотр
      • - В закладки
      • - В сравнение
    • Цветовые схемы сайта
    • Пользовательский css
    • Пользовательский js
    • Фиксация меню и др.

    [​IMG]
    ШАПКА САЙТА
    • 5 вариантов отображения элементов в шапке сайта
    • Поле для пользовательской информации в верхней строке
    • Поле для контактов в шапке сайта
    • Кнопки социальных сетей
    [​IMG]
    ПОДВАЛ САЙТА
    • Пользовательский текст
    • Контакты
    • Иконки социальных сетей
    • Платёжные иконки
    • Виджеты
    • Схема проезда
    • Избранные товары
    • Поле для счётчиков

    [​IMG]
    ДРУГИЕ ЭЛЕМЕНТЫ
    • Карточка товара
      • - Количество видимых дополнительных изображений
      • - Поле для пользовательских соц. кнопок
      • - Пользовательский текст с иконкой
    • Карта проезда на странице контактов
    • Возможность загрузки демо данных
    • Бэкап
    [​IMG]
    ЦВЕТА ТЕМЫ
    • Изменение цветов у элементов
      • - Фон сайта
      • - Заголовки
      • - Кнопки
      • - Ссылки
      • - Фон и ссылки главного и боковых меню
      • - Фон и ссылки шапки сайта
      • - Фон и ссылки подвала сайта
      • - Цвета элеменов модулей

    [​IMG]
    ШРИФТЫ
    • Выбор шрифтов для всех элементов сайта
      • - Основной текст
      • - Заголовка
      • - Кнопки
      • - Ссылки
      • - Меню
      • - Цена
      • - Стикеры


    Выберите расположение элементов в шапке сайта
    july_theme1.png [​IMG]
    В подвале сайта расположите несколько блоков с текстовой информацией.
    july_theme3.png
    Автоподстановкой выберите товары для отображения в подвале сайта.
    july_theme4.png
    Заполните поля для отображения виджетов
    - Виджет группы Вконтакте https://vk.com/dev/sites
    - В одноклассниках https://apiok.ru/wiki/pages/viewpage.action?pageId=42476655.
    - Facebook https://developers.facebook.com/docs/plugins/page-plugin/
    - Twitter twitter.com/settings/widgetstarget Нажмите на шестерёнку и зайдите в настройки. Слева выберите пункт Виджеты. Создайте новый виджет.

    july_theme5.png
    Для размещения карты проезда в подвале сайта во вкладке "Схема проезда" включите статус "В подвале" и выберите ширину колонки для карты.

    july_theme5_5.png
    Страница товара
    В карточке товара выберите кол-во дополнительных изображений в области видимости.
    Количество видимых похожих товаров в карусели выбирается в поле "Кол-во видимых товаров — Колонок". Если Кол-во видимых товаров меньше заданного в товаре лимита, то товары будут отображаться каруселью.
    Для кнопок социальных сетей можно использовать пользовательский скрипт. Выключите статус кнопок соц. сетей шаблона.

    july_theme18.png
    Для загрузки демо данных используйте кнопки:
    - Импорт настроек темы. Импортируются только настройки модулей шаблона.
    - Импорт таблиц темы. Импортируются только таблицы шаблона (Новости, Стикеры, Быстрый заказ). Другие таблицы не затрагиваются.
    - Экспорт настроек темы и Экспорт таблиц темы экспортируют из БД соответственно только настройки шаблона или таблицы шаблона.

    july_theme6.png
    Модуль July меню
    Модуль меню является альтернативой стандартному меню магазина. Кроме ссылок на страницы категорий, Вы теперь можете разместить ссылки на набор статей, отдельную статью, кабинет, пользовательскую ссылку, страницу производителей, страницу акций, новостей и контактов.

    Если не скрыть стандартное меню, то меню сайта будет отображаться в 2 ряда.

    july_theme7.png
    Для создания главного меню в шапке сайта выберите Позицию модуля "Menu"
    - Кнопка "Добавить модуль" добавляет новое меню на сайт
    - Кнопка "Добавить раздел меню" добавляет новый раздел в текущее меню.

    Существует 2 вида отображения Всех категорий в главном меню.
    Категории, которые Вы хотите разместить в главном меню, должны быть отмечены галочкой "Главное меню: Показывать в главном меню" в разделе Категорий админ панели (вкладка Данные)

    july_theme8.png
    Отображение категорий "View theme"
    Количество колонок подкатегорий выбирается в конкретной категории. Каталог -> Категории -> Вкладка Данные, поле Колонки

    july_theme9.png
    Модуль July меню в левой/правой колонке
    Создайте новый модуль (кнопка Добавить модуль). В новой вкладке выберите позицию модуля "Левая колонка"

    july_theme10.png
    Модуль July меню в положении Full width или Верх страницы
    Создайте новый модуль (кнопка Добавить модуль). В новой вкладке выберите позицию модуля "Full width" (или Верх страницы)
    Вы можете использовать это меню как дополнительное для размещения ссылок на информационные страницы сайта или создавать пользовательские блоки.

    july_theme11.png
    Управление стикерами
    Добавьте стикеры к товарам Каталог / Управление стикерами
    - Создайте группу стикеров, кликнув на "Добавить"
    - Заполните обязательные поля. Название будет отображаться на стикере. Фон стикера выберите в папке image\data\stickers

    july_theme23.png
    Укажите срок "жизни" стикера.
    Если срок жизни не указан или равен нулю, то стикер будет включен постоянно. В противном случае он будет доступен на к-во дней от даты поступления товара (вкладка "Данные" карточки редактирования товара).

    Выберите тип стикера
    Основной - стикер будет выведен в любом случае и если он удовлетворяет условию "Срок жизни стикера, дней"
    Акция - стикер будет выведен только, если товар акционный и если он удовлетворяет условию "Срок жизни стикера, дней"
    Скидка - стикер будет выведен только, если товар имеет хотя бы одну скидку для текущей группы покупателей и если он удовлетворяет условию "Срок жизни стикера, дней"

    Выберите тип объектов, к которым будут применяться стикеры
    - Все товары. У Всех товаров магазина, имеющих скидку, будет стикер Скидка (если выбран тип стикера Скидка). У Всех товаров магазина, имеющих акцию, будет стикер Акция (если выбран тип стикера Акция)
    Если тип стикера "Основной", то стикер добавится ко всем товарам магазина.
    - Категории. Выберите категории из списка. У товаров выбранных категорий будут стикеры, если товары подходят под тип стикера.
    - Товары. Созданный стикер будет только у выбранных из списка товаров.
    - Производители. Выберите производителей из списка. У товаров выбранных производителей будут стикеры, если товары подходят под тип стикера.

    При добавлении новых товаров, которые подходят хотя бы под одно включенное правило "Групп стикеров", необходимо применить правила групп стикеров заново.
    ВНИМАНИЕ!!! все стикеры, созданные вручную на странице редактирования товара, НЕ имеющие отрицательного приоритета, будут удалены!

    При добавлении новых товаров на сайт кликайте на кнопку "ПРИМЕНИТЬ" в модуле Управления стикерами.

    Пример: тип стикера - Основной. Тип объектов - Производители.

    july_theme24.png
    Пример: тип стикера - Основной. Тип объектов - Товары.

    july_theme25.png
    Добавление стикера вручную на странице редактирования товара.
    ВНИМАНИЕ!!! все стикеры, созданные вручную на странице редактирования товара, НЕ имеющие отрицательного приоритета, будут удалены!

    Войдите на страницу управления товаром Категории / Товары / Вкладка стикеры.
    Если в модуле Управления стикерами уже созданы группы стикеров, то возможные стикеры данного товара будут отображены во вкладке Стикеры.
    Пример: У товара HP LP3065 при условии у него Акции или Скидки будут 2 стикера Акции и Скидки. Если у товара Акции и Скидки нет, то стикеры отображаться у товара на сайте не будут.
    Создайте товару стикер "Лучший выбор", кликнув на кнопку Добавить стикер.

    july_theme26.png
    Заказ в один клик
    При быстром заказе информация о товаре появляется в списке в модуле "Заказ в один клик" (Продажи -> Заказы в один клик) и приходит на почтовый адрес, указанный в Система/Настройки/Вкладка Общие
    Если во вкладке "Почта" в поле "Дополнительные адреса для оповещений" существуют дополнительные e-mail`ы, то копии оповещениий о заказе в 1 клик будут отправлены и на них.

    Настройки модуля находятся в

    july_theme19.png
    July вкладки
    - Кнопка "Добавить модуль" добавляет новую группу вкладок на сайт
    - Кнопка "Добавить вкладку" добавляет новую вкладку.

    Товары для вкладки Рекомендуемые выбираются в модуле Рекомендуемые.
    Для отображения только рекомендуемых товаров используйте модуль July вкладки с одной вкладкой Избранные. С помощью модуля можно отображать блоки товаров каруселью.

    july_theme15.png
    July категории
    - Кнопка "Добавить модуль" добавляет новую группу категорий на сайт
    - Кнопка "Добавить категорию" добавляет новую категорию.

    Фоновое изображение растягивается на всю ширину блока. Фоновое изображение загружать необязательно.

    july_theme16.png
    Ширину блока Full (на всю ширину экрана) используйте, если модуль располагается в положении Full width или Верх страницы/Низ страницы без левой/правой колонки.

    В модуле можно отображать последние товары категории. Товары категории в правом блоке отображаются при клике на стрелочку.
    Стрелочка отображается, если у выбранной категории есть подкатегории и, если лимит последних товаров > 0
    Очистите поле Лимит товаров в карусели и товары отображаться не будут.

    July Новости
    Новости на главной странице, а также анонс новостей в левой или правой колонке.

    1. Создайте новости. Кнопка Добавить/изменить новость.
    При создании новости обязательные поля - Заголовок новости и Текст новости. Заполните все языковые поля.

    news.png
    2. Заполните обязательные поля настроек модуля: Размер изображений в модуле и на странице новостей, кол-во символов на стр. новостей.

    3. Добавьте модуль на страницы магазина. Изображения можно отображать слева от текста или над текстом.
    Если количество новостей меньше максимального количества новостей, то блоки с новостями будут отображаться каруселью.
    Подберите количество символов в новости, чтобы блоки имели равную высоту.

    news2.png
    July Слайдер и Баннеры
    С помощью этого модуля на страницах магазина можно разместить слайдшоу, баннеры и текстовые блоки.
    Модуль позволяет расположить до 4-х колонок баннеров в ряд. В каждой колонке можно создать любое количество баннеров, кадров в слайдшоу или текстовых блоков. Это зависит от Вашего выбора и значения параметра 'max_input_vars' Вашего сервера.
    1. Включите отображение колонки: ПОКАЗАТЬ
    2. Выберите ширину колонки: 25%,33%, 50%, 66%, 75%, 100%. Сумма ширины всех включенных колонок должна быть равна 100%. Например, включены 3 колонки 25% + 50% + 25% = 100%
    3. Выберите вид отображения информации в колонке : Баннеры, текстовые блоки или слайдшоу.

    july_theme12.png
    Включены 3 колонки. Отображение: Баннеры, Слайдшоу, Баннеры.

    july_theme13.png
    Блок с баннерами можно растянуть на всю ширину браузера, если он находится в положении Full width или Верх страницы, Низ страницы, но без левой /правой колонки.

    july_theme14.png
    Изображения растягиваются на всю ширину колонки. Укажите размеры изображения, пропорциональные или равные размерам загружаемой картинки. Необходимую для высокого качества отображения ширину можно рассчитать в зависимости от ширины контента.
    Ширина сайта 1300px.
    25% от этой величины, учитывая расстояние между баннерами - 323px
    50% от этой величины, учитывая расстояние между баннерами - 649px

    matban3.png
    Рекомендуемая ширина баннеров, если блок растянут на всю ширину браузера

    matban4.png
    Рекомендуемая ширина баннеров, если рядом с контентной областью есть левая или правая колонки

    matban5.png
    Рассчёт высоты баннеров
    400px - наибольшая высота
    2px - расстояние между изображениями
    400px = 132px +2px + 132px + 2px + 132px

    matban6.png
    July товары по категориям
    Модуль отображает товары, разбитые по подкатегориям выбранной категории. Товары можно показывать без разбиения по подкатегориям. Выберите удобный Вам способ демонстрации товаров.

    july_theme20.png
    Задайте размеры изображений товаров и количество товаров в видимой области. Если количество видимых товаров < Лимита, то товары будут в карусели.
    На примере отображаются 8 товаров в 4-х колонках. Всего товаров - 8, поэтому карусели нет.

    july_theme21.png Рекомендуемая ширина баннера 200px. Высота зависит от высоты изображений товаров и количества рядов. Подберите высоту самостоятельно.
    Например, при высоте товара 100px, товары в 1 ряд, расположение модуля с левой колонкой, высота баннера 247px
    при высоте товара 100px, товары в 2 ряд, расположение модуля с левой колонкой, высота баннера 500px
    Вы можете не загружать баннер.


    july_theme22.png
    Расположение модулей
    Используйте модуль July вкладки вместо модулей темы default: Последние, Рекомендуемые, Хиты продаж и Акции.
    July вкладки, альтернатива этим модулям, имеет больший функционал.

    may.mattimeo.ru

    july_theme22.png
    june.mattimeo.ru

    screen3.jpg
    july.mattimeo.ru

    screen1.jpg
    CSS Files
    Для пользовательских стилей в модуле July тема во вкладке Основные есть поле "Пользовательские стили (css)"

    Основной файл стилей темы stylesheet.css находится в папке catalog/view/theme/julytheme/stylesheet

    style0.css, style1.css, style2.css — файлы цветовых схем

    nivo-slider.css, slideshow.css — Стили модуля Слайдшоу

    julymenu.css — Модуль july меню

    julycategory.css — Модуль july категории

    julyslider.css — Модуль july слайдер и баннеры

    carousel.css — Модуль карусель.

    news.css — Стили новостей

    catalog/view/javascript/jquery/colorbox/colorbox_bootstrap.css — Стили Colorbox, адаптированные под bootstrap

    JavaScript
    Для пользовательских скриптов в модуле July тема во вкладке Основные есть поле "Пользовательские js-скрипты". Пользовательские скрипты будут помещены в $(document).ready() и запущены после загрузки любой страницы сайта.

    catalog/view/javascript/custom2.js — Скрипты для кнопок Купить, сравнения товаров и закладок

    catalog/view/javascript/jquery/elevatezoom/elevatezoom-min.js — Zoom на странице товара

    catalog/view/javascript/july_singleclick/singleclick.js — js Быстрого заказа

    catalog/view/javascript/quickview/quickview.js — js Быстрого просмотра

    catalog/view/theme/julytheme/js/main.js — Дополнительные скрипты темы

    catalog/view/theme/julytheme/js/fixmenu.js — Фиксированное меню

    catalog/view/theme/julytheme/js/jquery.nivo.slider.pack.js — Адаптивный Nivo Slider

    catalog/view/theme/julytheme/js/jquery.tipsy.js — Подсказки

    catalog/view/theme/julytheme/js/responsive/enquire.min.js — Позволяет использовать медиа запросы в JavaScript, инструмент для создания адаптации сайта

    catalog/view/theme/julytheme/js/responsive/jquery.touchwipe.js — Плагин JQuery для использования на устройствах с сенсорным вводом

    catalog/view/theme/julytheme/js/scroll/scrolltopcontrol.js — Кнопка прокрутки вверх

    xml-files (vqmod/xml)
    july_theme.xml —Дополнительные скрипты для работы модулей шаблона

    july_success.xml —Дополнение контента к всплывающему окну при покупке товара

    vqmod_cache.xml —Модуль очистки кэша

    julynews_seo_pro.xml, for_julynews.xml —Дополнительные переменные для модуля новостей, seo_url новостей, автогенерация keyword заголовков новостей

    july_quickview.xml —Быстрый просмотр товара

    july_stock_button.xml —Замена кнопки Купить на Нет в наличии

    july_menu.xml —Модуль july меню

    Allpage layout.xml —Расположение модуля на всех страницах

    july_stickers.xml, july_group_stickers.xml —Стикеры

    july_additional_tabs.xml —Дополнительные вкладки на стр. товара

    july_image_subcategory.xml —Поле для размеров изображений подкатегорий

    july_singleclick.xml —Быстрый заказ

    Изображения

    1. screen2.jpg
    Slav4ike, konstantin.1986, agiotage и 89 другим нравится это.

Последние обнoвления

  1. July - адаптивный шаблон для ocStore/Opencart 1.5.4.x-2.2.x

Пoследние рецензии

  1. EXO_TEAM
    EXO_TEAM
    5/5,
    Версия: v2
    отличный шаблон, скачивал для магазина штор
  2. Ostap75
    Ostap75
    5/5,
    Версия: v2
    быстрый