Как сделать статью в opencart
Как сделать статью в opencart
В этой главе мы поговорим об опенкарт и научимся изменять шаблон, а также сверстаем главную страницу.
Несмотря на то, что OpenCart является довольно распространенной CMS, полного, подробного и актуального мануала по верстке для новичков для OpenCart в сети нет. Даже у меня на блоге пока только отдельные уловки по работе с данной системой. Давайте попробуем восполнить этот пробел и на конкретном примере научимся верстать под OpenCart 1.5.
Стоит отметить, что верстка под любую КМС остается версткой – мы просто располагаем элементы соответственно макету от дизайнера. Просто в каждом случае необходимо узнать, какие именно файлы менять и не забывать об их взаимосвязи. В этом плане опенкарт имеет некоторые отличия от интеграции верстки в вордпресс, к примеру.
Итак, начнем с создания шаблона. В опенкарт шаблон – это набор файлов с расширением tpl. По сути дела это обычный php файл – в нем можно писать php код, заключенный в соответствующие теги, а также html разметку. Мы не будем делать новый шаблон, а начнем править уже имеющийся. В моем случае это обуславливалось тем, что интернет магазин уже имел на страницах практически все необходимые элементы (точнее, блоки элементов), мне надо было только изменить их внешний вид. Справедливости ради, весьма кардинально.
Посмотрим на главную страницу:
Она весьма отличается от остальных, поэтому можно смело удалить все из файла home.tpl и начать верстать с нуля. Здесь нет ни футера, ни хедера, только логотип, меню и еще картинка. То есть начало у нас такое:
Далее стили. Убираем отступы у боди и задаем размер шрифта по умолчанию для документа:
Теперь подключаем парочку стилей, которые нам понадобятся
Сама верстка чрезвычайно проста: обертка (wrapper) – в ней картинка, затем див, в котором сверху вниз див с парочкой спанов и меню под ними. А также еще сбоку картинка.
Если вы не знаете ваш код меню, то ищите его в той же папке (common) в файле header.tpl. А мы наше меню немного облагородим. Заставим выезжать и сделаем подложку при наведении:
Вроде бы теперь главная страница у нас соответствует макету. Однако, мы делаем сразу же адаптированный сайт, хорошо отображающийся и на различных мобильных устройствах. Поэтому смотрим макет адаптивки:
Что мы видим? Как только ширина экрана будет меньше 750px, мы все центрируем, добавляем отступы, а меню делаем столбиком. Насчет меню – не самое стандартное решение в данном случае, на других страницах будет обычное адаптивное. Но, что делать – такой дизайн – я всего лишь верстальщик. Итак, стили:
Также необходимо изменить логику выезда подменю: не по наведению, а по клику и убрать ссылку с первого пункта.
Теперь проверяем, мобайл френдли ли наш сайт по мнению основных поисковых систем?
Все отлично! У вас может возникнуть вопрос: а чем тогда отличается данная верстка от обычной, без натяжки на кмс опенкарт? В данном случае – только кодом меню. Но я и предупреждал, что ничего сложного нет.
В следующих главах мы научимся натягивать верстку опенкарт и для других страниц.
заметки, верстка, opencart, opencart
Как создать категории Opencart магазина
Вступление
Магазин OpenCart имеет структуру товаров в виде категория-товары, с возможностью создавать дочерние категории родительских категорий, родитель-дочка.
Создать категории Opencart
Товар, добавляемый в каталог товаров магазина должен принадлежать какой-либо категории товаров. Как следствие перед добавлением товаров нужно создать категорию или категории товаров.
Совет! При создании категории заполняйте все предусмотренные поля. Даже если они не нужны вам сейчас или вы думаете, что это не важно, всё равно заполняйте. Пригодится, торопиться некуда.
Чтобы создать категорию товара нужно:
На новой странице видим меню с 4 вкладками для категории:
Основное
Для примера создам категорию «Обувь».
Вкладка с названием «Основное», заполняется с целью показать покупателю максимальную информацию о товарах в этом разделе магазина. Здесь заполняем описание категории opencart в поле «Описание». Используем в описании для заголовков теги h2. Теги для подзаголовков h3 необязательны. НЕ используем теги h1.
По умолчанию, обязательны к заполнению только поля со звездочкой. Лучше заполнить всё поля, например, так:
Данные
Здесь нужно выбрать родительскую категорию, если она есть и выбрать из списка (авто заполнение) фильтры, которые вы должны создать заранее.
Далее важно! В пункте «Главное меню» нужно поставить галочку, если вы хотите, чтобы эта категория попала в основное (горизонтальное на верху) меню магазина. Если не хотите, галочку не ставите.
Пункты «Столбцы» и «Порядок» относятся к варианту показать в меню. В столбцах указываете количество столбцов для выезжающего аккордеона для подкатегорий этой категории. В пункте «Порядок» укажите цифру, которая будет порядковым номером этой категории в меню.
Каждый раз сохраняться при переходе по вкладкам не нужно!
Если вы указали название категории, настройка SEO будет уже заполнена. Если нужно поменять ярлык категории, самое время это сделать в «SEO URL». Это будет в URL страницы категории и страниц товаров.
Дизайн
Здесь нужно выбрать макет данной категории, то есть вид страницы этой категории для показа на сайте магазина.
Здесь два варианта. Можно выбрать макет из существующих макетов в списке, например, Default. Или предварительно создать свой макет на вкладке «Макеты» и потом применить его.
Примечание: При создании макета вы сами опередите, как будет выглядеть opencart страница категорий на сайте магазина. Определите колонки страницы (справа, слева, сверху) и навешаете на них ваши модули Opencart.
После заполнения всех полей настроек категории, не забываем сохраниться кнопкой, вверху страницы и посмотреть созданную категорию на вкладке Каталог >>> Категории. Обратите внимание, там же есть кнопка редактора этой категории. Вы всегда можете отредактировать добавленную категорию магазина.
Немного про оптимизацию категорий
Категория товара является элементом группировки товаров. Это значит, что по теории оптимизации, категория относится к таксономии сайта.
Любой элемент таксономии сайта, в том числе магазина, должен быть продуман заранее. Категории товаров OpenCart не исключение. Список категорий должен быть составлен заранее с учётом последних тенденций SEO. Рекомендую воспользоваться следующими советами для создания списка категорий товаров Opencart.
Прежде всего решите, будете ли вы показывать категории товаров поисковым системам с целью их индексации. Имеются в виду страницы категорий товаров, которые выводятся на сайте магазина при нажатии на любую категорию, например, в основном меню.
Если вы не хотите показывать страницы категорий поисковикам, вам нужно их закрыть директивами Disallow в файле robots.txt магазина.
Если вы хотите показывать страницы категорий поисковикам вам нужно:
Вывод
В этой статье я показал, как создать категории Opencart магазина. Если вы посмотрите оформление категорий в крупных магазинах, то не всегда увидите описание категории на странице. Это не значит, что вы должны делать так же. Сначала станьте крупным магазином, а потом ….
Допустимый размер статьи
Рекомендуемые сообщения
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Похожий контент
Позволяет создать бесконечное множество статей и категорий для них. Например вы можете создавать категории «Новости», «Статьи», «Акции», а также создать полноценный блог для своего магазина с разбитием материалов по категориям.
Концепция и основная идея
Категории присваивается тип — Товар/Статья.
Функционал Статьи расширяется аналогично функционалу Товара.
Отзывы аналогично категориям разделены на 2 типа — Товар/Статья.
А также добавлена возможность вывода «Ответа магазина» на «Отзыв» с использованием HTML.
Данный модуль блога не заменяет родных файлов Opencart 3.
Сохранена концепция Опенкарт в названиях и определениях, а также сохранён привычный для администратора магазина внешний вид интерфейса.
Нет конфликтов по SEO URL, так как используется штатный функционал Opencart. Который вы можете расширить приложенными модификаторами.
Модуль на 90% состоит из файлов модификаторов, которые можно удалить или отключить в любое время.
Товары:
Заголовок H1
Краткое описание
Можно вывести в категории и в модулях выводящих товары с помощью:
<< short_description >>.
Главная категория
Используется для определения хлебных крошек в «URL от базового домена» находящихся в индексе Поисковых Систем.
Для правильной настройки свойства canonical на разных URL товара.
Рекомендуемые товары
Нет добавления товара самого на себя.
Рекомендовать можно в трёх направлениях: на товар, от товара, в обе стороны.
Рекомендуемые статьи
Рекомендовать можно в трёх направлениях: на статью, от статьи, в обе стороны.
Статьи:
Заголовок H1
Краткое описание
Можно вывести в категории и в модулях выводящих товары с помощью:
<< short_description >>.
Основное изображение
Дополнительные изображения
Главная категория
Используется для определения хлебных крошек в «URL от базового домена» находящихся в индексе Поисковых Систем.
Для правильной настройки свойства canonical на разных URL статьи.
Рекомендуемые статьи
Нет добавления статьи саму на себя.
Рекомендовать можно в трёх направлениях: на статью, от статьи, в обе стороны.
Рекомендуемые товары
Рекомендовать можно в трёх направлениях: на товар, от товара, в обе стороны.
Теги
Дата добавления статьи
Дата начала и конца публикации статьи
Автор
Атрибуты
Возможности для разработчиков:
Заложены на будущее некоторые функции и возможности, которые разработчики могут использовать для создания своих модулей. Например: «дополнительные изображения» в настройках категории, можно выводить с помощью слайдера. А «Производителя» использовать для соответствующих привязок и сортировок.
Модули разработчиков связанные с выводом товаров, можно легко переопределить для Статей. Так как php-код контролеров и моделей практически зеркальный.
Использовалась верстка с классами Bootstrap 3. Что можно легко использовать для своих шаблонов без лишних заморочек и потерей времени.
Состав модулей и модификаторов OptimBlog
OptimBlog — главный модуль.
Модификатор «Admin Filter»
Модуль «Новые статьи»
Модуль «Лучшие статьи».
Модуль «Рекомендуемые статьи»
Модуль «Категории статей»
Модуль «Поиск статей»
Адаптация под шаблон Frame
Информация:
Демо: http://demo.optimcart.com
Админка: http://demo.optimcart.com/admin
Лицензия: GNU General Public License version 3 (GPLv3)
Концепция и основная идея
Категории присваивается тип — Товар/Статья.
Функционал Статьи расширяется аналогично функционалу Товара.
Отзывы аналогично категориям разделены на 2 типа — Товар/Статья.
А также добавлена возможность вывода «Ответа магазина» на «Отзыв» с использованием HTML.
Данный модуль блога не заменяет родных файлов Opencart 3.
Сохранена концепция Опенкарт в названиях и определениях, а также сохранён привычный для администратора магазина внешний вид интерфейса.
Нет конфликтов по SEO URL, так как используется штатный функционал Opencart. Который вы можете расширить приложенными модификаторами.
Модуль на 90% состоит из файлов модификаторов, которые можно удалить или отключить в любое время.
Товары:
Заголовок H1
Краткое описание
Можно вывести в категории и в модулях выводящих товары с помощью:
<< short_description >>.
Главная категория
Используется для определения хлебных крошек в «URL от базового домена» находящихся в индексе Поисковых Систем.
Для правильной настройки свойства canonical на разных URL товара.
Рекомендуемые товары
Нет добавления товара самого на себя.
Рекомендовать можно в трёх направлениях: на товар, от товара, в обе стороны.
Рекомендуемые статьи
Рекомендовать можно в трёх направлениях: на статью, от статьи, в обе стороны.
Статьи:
Заголовок H1
Краткое описание
Можно вывести в категории и в модулях выводящих товары с помощью:
<< short_description >>.
Основное изображение
Дополнительные изображения
Главная категория
Используется для определения хлебных крошек в «URL от базового домена» находящихся в индексе Поисковых Систем.
Для правильной настройки свойства canonical на разных URL статьи.
Рекомендуемые статьи
Нет добавления статьи саму на себя.
Рекомендовать можно в трёх направлениях: на статью, от статьи, в обе стороны.
Рекомендуемые товары
Рекомендовать можно в трёх направлениях: на товар, от товара, в обе стороны.
Теги
Дата добавления статьи
Дата начала и конца публикации статьи
Автор
Атрибуты
Возможности для разработчиков:
Заложены на будущее некоторые функции и возможности, которые разработчики могут использовать для создания своих модулей. Например: «дополнительные изображения» в настройках категории, можно выводить с помощью слайдера. А «Производителя» использовать для соответствующих привязок и сортировок.
Модули разработчиков связанные с выводом товаров, можно легко переопределить для Статей. Так как php-код контролеров и моделей практически зеркальный.
Использовалась верстка с классами Bootstrap 3. Что можно легко использовать для своих шаблонов без лишних заморочек и потерей времени.
Состав модулей и модификаторов OptimBlog
OptimBlog — главный модуль.
Модификатор «Admin Filter»
Модуль «Новые статьи»
Модуль «Лучшие статьи».
Модуль «Рекомендуемые статьи»
Модуль «Категории статей»
Модуль «Поиск статей»
Адаптация под шаблон Frame
Информация:
Демо: http://demo.optimcart.com
Админка: http://demo.optimcart.com/admin
Лицензия: GNU General Public License version 3 (GPLv3)
Добавил optimlab Добавлено 14.06.2018 Категория Блоги, новости, статьи Системные требования Метод активации Без активации Ioncube Loader Нет OpenCart 3.0 ocStore Несовместим OpenCart.Pro, ocShop Не проверялось Обращение к серверу разработчика Нет Старая цена 0
700.00 руб
Скачать/Купить дополнение
Информация:
Демо: http://demo.optimcart.com/frame
Админка: http://demo.optimcart.com/admin
Добавил optimlab Добавлено 06.08.2019 Категория Блоги, новости, статьи Системные требования OptimBlog Метод активации Автоматическая активация Ioncube Loader Нет OpenCart 3.0 ocStore Несовместим OpenCart.Pro, ocShop Несовместим Обращение к серверу разработчика Нет Старая цена
Информация:
Демо: http://demo.optimcart.com/frame
Админка: http://demo.optimcart.com/admin
Возможности:
Мультиязычный заголовок. Использование HTML в Заголовке модуля. Выборка статей из определенной Категории. Сортировка по Рейтингу или Просмотрам. Отображение или скрытие Даты статьи. Отображение или скрытие Автора статьи. Отображение или скрытие кол-ва Отзывов статьи. Отображение или скрытие Рейтинга статьи.
Информация:
Демо: http://demo.optimcart.com
Админка: http://demo.optimcart.com/admin
GitHub: https://github.com/optimlab/optimblog
Лицензия: GNU General Public License version 3 (GPLv3)
Добавил optimlab Добавлено 19.05.2019 Категория Блоги, новости, статьи Системные требования Метод активации Без активации Ioncube Loader Нет OpenCart 3.0 ocStore Несовместим OpenCart.Pro, ocShop Не проверялось Обращение к серверу разработчика Нет Старая цена
Последние посетители 0 пользователей онлайн
Ни одного зарегистрированного пользователя не просматривает данную страницу
Как вывести свои ссылки в верхнем меню opencart?
Как вывести свои ссылки в верхнем меню opencart?
Сегодня хочу написать небольшую статью о добавлении своих произвольных ссылок в главное меню. По умолчанию в шаблоне выводятся только отмеченные категории в меню, но иногда нам требуется вместо категорий или вместе с ними выводить свои ссылки к примеру О компании,контакты,Доставка,оплата,документы и.т.д.
Ну что же приступим:
(PS: Данный метод может отличатся на не стандартных шаблонах)
Весь код главного меню лежит в файле header.tpl который лежит здесь:
Открываем данный файл в нашем любимом notepad+ и находим в нем код который и отвечает за меню:
И изменяем его на свой код к примеру так:
Таким образом мы убрали полностью весь вывод категорий и добавили свои ссылки.
Если же Вам требуется выводить ссылки совместно то просто добавляете их после закрывающего тега li
ПОЛЕЗНАЯ РЕКЛАМА НА САЙТЕ
Вас также может заинтересовать
Дата поступления в карточке товара opencart
Выводим информацию для определенной группы пользователей
Определение города посетителя по IP адресу
Нужна платная помощь?
Обращайтесь, сделаем все быстро и качественно!
13 комментариев
Тут нужно смотреть пациента, но обычно все сводится к добавлению нескольких строчек ли и css кода…
Ну во первых попрошу не выражаться и вести себя культурно.
Во вторых если вам не нравится самое простое решение то можете посмотреть более правильное и сложнее по ссылке ниже:
https://web-stydia.com/vyvod-informacionnyx-ssylok-v-shapku-sajta-opencart/
И в третьих если вы такой умный то что вы здесь делаете?
а к Ocstore 2.3 применим данный способ?
Да, данный метод применим к любой версии opencart, так как по сути вы просто вписываете в код шаблона hhml код.
Сорри, не глянул что это комментарий не к статье а к предыдущему комменту, но в любом случае, данный метод так же применим для вашей версии, но это уже не простой html и нужно немного больше файлов править!
Мало того, если у кого-то хватит ума последовать этому «туториалу», то получит на сайт еще и кучу крякозябров. Тут ведь даже не упоминается, как эта проблема решается
К сожалению я не могу знать чего вы ожидали, но я уже многократно писал в комментариях напишу и Вам, если не нравится самый простой метод используйте более сложный по инструкции здесь https://web-stydia.com/vyvod-informacionnyx-ssylok-v-shapku-sajta-opencart/
Можно где то пример увидеть?