Переделываем шаблоны для интернет магазина VamShop или как переделать шаблон

Написано nikita на 17 января, 2013. Опубликовано в VamShop

ПЕРЕДЕЛЫВАЕМ ШАБЛОНЫ ДЛЯ ИНТЕРНЕТ МАГАЗИНА VAMSHOP ИЛИ КАК ПЕРЕДЕЛАТЬ ШАБЛОН

Многие, выбирая скрипт интернет магазина смотрят больше на то, как выглядит стандартный шаблон интернет магазина, и если он красивый и современный этот скрипт пользуется популярностью. И только после того как все установили и начали заносить товары и обкатывать магазин обращают внимание на его функционал. Да, так делают почти все начинающие создатели интернет магазина. И мне очень странно, что "создатель" VamShop представляет его в достаточно не современном, на мой взгляд дизайне. Что оттягивает часть будущих владельцев интернет магазинов в пользу других скриптов, например PrestaShop, полностью бесплатного скрипта, возможно более функционального в администраторской части и в некоторых моментах frontend'а.

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

Что ж, если вы не остановились на этом и все же решили остаться на этом скрипте интернет магазина - это введение в переделку шаблона специально для вас.

Итак - первое что нужно понять - это сам принцип построения "выходной" страницы - и он достаточно прост:
всего есть, я бы сказал два основных файла шаблона страниц:
index.html - шаблон основной страницы и страницы на которой выводится список товаров, когда вы заходите в категорию, а так же информационные страницы.
product_info.php.html - шаблон страницы с информацией о конкретном товаре

А так же два файла, которые задают "верх" и "низ" любой страницы магазина, в них, в основном прописано то что находится до тега и то, что выводится в самом низу (например (c) Ваш-Интернет-Магазин ) сразу перед
Эти файлы находятся в корне магазина /includes/header.php и includes/external/smarty/plugins_vam/outputfilter.note.php - здесь выводится копирайт ВамШопа , и как его убрать я написал здесь

Конечно, есть еще login.php.html, checkout_alternative.php.html, comparison.php.html, create_account.php.html, и другие, они все находятся в корневой папке вашего шаблона - но мы сейчас должны понять сам принцип формирования и переделки шаблона для VamShop, и как только он будет ясен вы легко переделаете все остальные файлы.

Давайте рассмотрим файл index.hml:
Открыв его мы видим основную разметку главной страницы, собственно вы сами можете ее сделать так, как вы бы этого хотели, и вам не надо переделывать шаблон от VamShop - часто его проще сделать с нуля. В основной разметке есть вывод боксов {$box_CATEGORIES}, {$box_CART} и вывод модуля {$main_content}
Таким образом, перемещая эти переменные по своему шаблону вы определяете где будет находится меню интернет магазина, где информация, где корзина и так далее.

Т.е. принцип построения шаблона: это боксы (пака boxes) и модули (папка module)

Например, для минимального магазина это
{$box_CATEGORIES} - выводит ваши категории
{$box_CART} - выводит корзину с товарами
{$box_LOGIN} - бокс для входа в магазин
{$box_ADMIN} - бокс только для админов, для доступа в админку.
А так же модуль
{$main_content} - выводит модуль с основным контентом (содержимым) страницы.

Когда вы расположили, допустим, ваше меню({$box_CATEGORIES}), там где задумали, вы заходите в папку boxes , находите там box_categories.html и исправляете этот шаблон так, как хотите чтобы он выглядел.
Точно так же вы поступаете с боксами корзины и входа в интернет магазин.
Модуль {$main_content} находится в папке modules и отвечает за вывод основного контента, т.е. на главной странице по умолчанию это будет несколько других модулей:
{$text} - отвечает за контент который вы создаете в разделе "информационные страницы"
{$MODULE_error} - ошибки если есть
{$MODULE_latest_news} - последние новости
{$MODULE_featured_products} - рекомендуемые продукты
{$MODULE_new_products} - новые товары
{$MODULE_upcoming_products} - поступающие товары
Таким образом вы можете менять эти модули местами или просто удалять, если они не нужны для дизайна шаблона главной страницы вашего интернет магазина.
Так же не забывайте что большинство боксов можно просто отключить в админке.

В итоге, буквально изменив 4 файла - вы получаете свой шаблон для интернет магазина VamShop.
Конечно это не все, и работы еще необходимо сделать много, так как есть еще страница с описанием товара, на которой есть модули вывода цены, модули со спецификациями, параметрами и т.д. и т.п., но поняв сам принцип вы легко все переделаете так, как вам бы этого хотелось. Поверьте, это не так сложно как может показаться на первый взгляд. А переделав главную страницу интернет магазина и увидев результат вы поймете что вам это по силам и продолжите с воодушевлением :)

Всегда рад помочь начинающим - спрашивайте в комментариях - обязательно отвечу!

Еще на эту тему:

Кометариев (11)

Димитрий

6 июня, 2013 at 09:05 | #

Разве есть такой файл product_info.php.html - шаблон страницы с информацией о конкретном товаре ??
я только такой нашел
product_info_v1.html в шаблоне, и то непонятно как там менять шаблон вывода цен, например(( в стилях CSS есть указания, в самом же шаблоне нету ( файл что выше я привел)

Ответить
- nikita
  
  7 июня, 2013 at 11:51 | #
  
  product_info.php.html - лежит прямо в корне папки шаблона. - отвечает за общий вид страницы товара
  product_info_v1.html - лежит в папке module/product_info - отвечает за главную часть страницы о товаре - за описание, фото, цены и прочее
  
  чтобы поменять вывод цен надо поменять модуль отвечающий за это. а в этих файлах меняется общий вид.
  
  Ответить
Вера

18 января, 2014 at 04:26 | #

Доброй ночи.
Делаете ли Вы темы под ВамШоп на заказ?

Ответить
- nikita
  
  22 января, 2014 at 03:06 | #
  
  Добрый день, да, это возможно, у вас есть дизайн, который вы хотели бы видеть?
  
  Ответить
Виталий

7 января, 2016 at 08:43 | #

Добрый день! Подскажите, как можно вытащить вкладки из {$main_content} которая находится в product_info.php.html? Дело в том, что {$main_content} находится в блоке, у которого задана фиксированная ширина, а нужно чтобы вкладки-табы располагались по всей ширине страницы.

Ответить
- nikita
  
  7 января, 2016 at 16:03 | #
  
  Чтобы вкладки были по всей ширине вам надо просто немного переделать шаблон продукта.
  Если у вас слева или справа нет меню то тогда центральную часть можно сделать по всей ширине. А если у вас слева меню, то как же тогда вкладки будут по всей ширине?
  
  Ответить
олег

11 февраля, 2016 at 10:28 | #

а где код отвечающий за вывод main_content ?

Ответить
Никита добрый вечер

16 декабря, 2016 at 01:14 | #

А вы не занимаетесь изменением в магазине ? Мне очень нужно)

Ответить
- Никита
  
  16 декабря, 2016 at 01:27 | #
  
  Занимаюсь :) что именно вы хотите изменить?
  
  Ответить
Александр

25 июня, 2017 at 05:52 | #

Никита у вас есть готовые шаблоны? Может поделитесь?

Ответить
Антон

20 января, 2023 at 08:54 | #

Доброго времени суток!

Мы занимаемся созданием, разработкой, доработкой, поддержкой интернет-магазинов на нашем шаблоне Nexoos + движок VamShop.

Так же у нас есть готовые модули для Nexoos.

1) Универсальный импорт товаров с CSV XLSX ODS YML XML
2) Бонусная программа
3) Комплекты
4) Конфигуратор
5) Мультирегиональность
6) Расширенный поиск
7) Массовые операции
8) Турбо страницы Yandex
...

Список модулей пополняется, чтобы ваши магазины были всегда удобными и продающими!

Подробнее можно узнать на нашем сайте https://nexoos.ru/shablon.html

Ответить