Интернет магазин создать с нуля. Студия веб разработки, советы, уроки.

Найти меня в:

Добрый день, дорогие читатели. Наконец-то я решился написать статью о VM3 и Joomla3. Не так давно вышла новая третья версия virtuemart, которую можно поставить на Joomla 3. Сейчас многие подумают - Joomla 3 сырая, на ней не будет ничего работать. Но в действительности шаблоны для нее более привлекательны, а возможности…
Я думаю - такая связка должна составить неплохую конкуренцию J3 + JomShopping и даже Opencart.
Понимаю, что многие уже привыкли Joomla 2.5 + vm2, а некоторые использует еще VM1.1., но старые версии уже не дают тех возможностей, а запросы и знания покупателей постоянно растут.
Основная проблема с которой можно столкнуться - модули старых версий не будут работать. Но так ли это ? данный вопрос тоже будет рассмотрен в данной статье.

Для начала нам нужен хостинг или виртуальная машина. Я решил создать тестовый поддомен и установить движок туда.

Скачиваем Джумлу 3 с официального сайта http://joomla.ru/downloads. На момент написания этой статьи это версия 3.3.3.

Распаковываем файлы в папку с сайтом и переходим на страницу сайта, где нам предлагают установить Joomla 3. Тут все стандартно - вводите доступы к базе данных и проверяете соответствуют ли параметры. После этого установка должна пройти успешно. Не забудьте после установки удалить папку instalation.

vm31

 

Сразу видно, что дизайн Joomla 3 более современный и похож на одностраничник. Перейдя в админку - видим, что joomla требует обновиться. Это скорей всего еще не стабильная версия, но терять нечего - обновился до 3.3.6.

Теперь можно и VM 3 поставить. Скачиваем с сайта http://virtuemart.net/downloads. В архиве будет еще два архива с компонентом и модулями. Установим через установку расширений.Сначала сам компонент, а потом модули. Так же советую скачать и поставить Языковой пакет, найти который можно на сайте http://virtuemart.net/downloads.

Интерфейс стал красивее, но по структуре все тот же VM2, таких сильных различий, как между версией 1 и 2 -пока нет. Это даже хорошо, ведь тогда может хоть модулю будут работать. Разработчики уверяют, что VM3 стал работать на 25% за счет оптимизации SQL запросов.

Для начала поставим популярный компонент одностраничного заказа One Page Checout from RuPostel. С ним проблем возникнуть не должно, ведь версии постоянно обновляются. Сам компонент платный, приобрести можно на сайте https://www.rupostel.com/, либо на нашем сайте (на порядок дешевле). Версия 2.0.276 спокойна установилась. Необходимо перейти в сам компонент и настроить его, как минимум - убрать галочку выключить одностраничный заказ. Компонент работает отлично, как будто и не меняли джумлу.

vm32

 

Когда мы все подготовили - можно выводить на страницу. При установке VM3 и джумлы я устанавливал демоданные. Так что все, что остается сделать - вывести пункты меню и модули на страницу. Добавим пункт магазин в главное меню, тип Virtuemart - Главная

Внешний вид магазина поменялся не сильно. Единственное, что можно сразу заметить - это купить в один клик (добавить в корзину прямо со списка всех товаров) теперь входит в комплект VM, а не устанавливается отдельным плагином. На странице товара сильных изменений не произошло - Кнопка добавить в корзину и доп. поля остались на старом месте.

 

vm33

 

Отображение стандартных модулей не вызовет трудностей, просто укажите место и страницы, на которых отображать. Новых модулей тут вы не найдете, все осталось как и было: поиск, категории, производители…

В заключении можно сделать вывод - VM3 не требует отдельного освоения и является лишь продолжением VM2. Полной миграции (как с 1.1 на 2 версию) не требуется, достаточно просто обновить.

Проблемы с большой вероятностью могут возникнуть с несовместимостью Joomla 2.5 и Joomla 3.

При установке плагина виртуальный товар (позволяет после оплаты скачивать электронный товар) для VM2 выдал ошибку

Предупреждение

JInstaller: :Install: Не найден установочный XML-файл Joomla

 

Как вы уже наверно заметили, в установленом компоненте интернет-магазина первоначально включено слишком много функций, либо они настроены не оптимально. Это можно быстро исправить и придать магазину более эстетичный вид. Для этого перейдите в компонент VirtueMart из панели администаратора.

Компонент VirtueMart

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

Панель управления компонента интернет-магазина

Магазин – Магазин - Продавец
Заполните поля: Название магазина, Название компании, URL. (Например, Магазин плагинов дляинтернет магазинов, Магазин шаг за шагом, steptoshop.ru).

Минимальная сумма заказа – оформление заказа ниже этой суммы не проходит, и выдается соответствующее сообщение об ошибке. По умолчанию установлено значение “0”, такое можно и оставить, в этом случае параметр просто не учитывается.
Из выпадающего списка валют выберите Russianruble, в поле список валют добавьте Russianruble. Поле используется только, когда в вашем магазине используется несколько валют, для их переключения.

Магазин – Магазин – Дополнительная информация
В данной вкладке вам необходимо заполнить все обязательные поля (отмечены звездочкой).
После заполнения – нажмите сохранить и закрыть.

Далее необходимо перейди в меню Настройки – Настройки. Тут почти в каждой вкладке есть что поправить. Разберем каждую.
Вкладка Магазин. Настройки по умолчанию вполне приемлемы. Можете поменять оффлайн сообщение, которое выводится, когда магазин не работает, на любое другое.

Вкладка Внешний вид.
В основных параметрах советую убрать ссылку рекомендовать другу.

Основные параметры VM

В Действие при поступлении товара на склад можно ничего не менять. По умолчанию установлено свойство – Товары которых нет в наличии могут заказываться. Учет товаров – сложная вещь, на которой не стоит зацикливаться, если у вас мало товаров или товар информационный.

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

Оценка покупателя VM

Вкладка Шаблоны. Настройка внешнего вида – можно убрать производителя. Если магазин небольшой, то сортировка по производителю и его отображение будет лишним. В другом случае, если это магазин продуктов или одежды, то покупателю важно знать производителя товара. Подкатегории товара тоже можно выключить, они необходимы лишь для более подробной сортировки товара по категориям. Например, если магазин одежды достаточно крупны, то в нем будет категория Женская одежда, которая будет содержать подкатегории блузки, платья и т.д. Параметры количество товаров в строке и количество категорий в строке советую устанавливать от 3 до 6, эти параметры устанавливаются индивидуально, в зависимости от ширины шаблона.

Настройка внешнего вида VM

Последовательность разбиения страницы для списка и настройки ленты новостей категории оставляем по умолчанию. Настройка файлов будет подробнее разбираться в статье об отображении товаров, среди свойств можно выделить ширину и высоту миниатюры изображения, которые отвечают за размер изображения товара.
Настройки главной страницы VirtueMart. Уберите функции: Показать рекомендуемые товары, Показать 10 лучших товаров, Показать Недавно просмотренные товары, Показать Недавно просмотренные товары.

Настройки главной страницы VM

Параметры Настройки ленты новостей главной страницы магазина и Стили CSS и сценарии JavaScript оставим по умолчанию.
Вкладка Формирование цен. В настройках цены снимите галочку с параметра Показать налог в корзине.

Настройки цены VM

Показать следующие цены.  Если вы не хотите, чтобы отображались цены без скидки и цены за единицу товара – уберите все галочки на всех полях, кроме поля Окончательная цена.

Какие цены показать VM

Вкладка оформление заказа. Необходимо включить One Page Checkout enabled. Эта функция позволяет вывести оформление заказа на одну страницу (данные, оплата, доставка). Более подробно данная функция будет рассмотрена в статье об оформлении заказа.
Галочки Показать информацию о политике возврата в корзине/на странице подтверждения заказа и Регистрация во время оформления заказа стоит убрать. Статусы и остальные свойства можно оставить без изменения.

preeconfigVM6

Вкладка Настройки сортировки. Есть возможность устанавливать критерии для сортировки, например по названию и описанию. Полностью убрать сортировку и указатель выбранной страницы можно только в коде, данной настройки не предусмотрено. Метод будет подробно описан в статье об оформлении страницы товаров.

Настройки сортировки VM

Поля доступные для поиска. Неизвестно как функция будет работать, потому что пользователь может использовать различные модули поиска (VirtueMart, поиск движка Joomla или другие). Советую в любом случае отметить поиск по названию, краткому описанию, описанию, категории.

Во вкладке SEO изменять ничего не требуется.

Настройки SEO VM

Перейдите в меню Товары – Налоги и правила расчета и проверьте, что никаких правил не установлено, а если они есть – удалите. В большинстве случаев все коммисии и налоги сразу включают в основную цену, это помогает не запутаться администратору магазина. Функция правил расчета может быть использована для установки скидок на товар для различных групп пользователей, это будет рассматриваться в отдельной статье.
После первоначальных настроек ваш магазин будет выглядеть намного лучше. Основные параметры установлены. Было убрано все лишнее. Представленные в статье настройки больше подходят для магазина с небольшим и средним количеством товаров. Иногда вам могут пригодиться функции, которые мы посоветовали отключить. Каждый магазин по-своему индивидуален. Многие из функции далее будут рассмотрены более подробно.

Предварительно настроенный магазин VM

Следующий урок >>Шаблон интернет магазина.

 

Если вы хотите более подробно разобраться с установкой и настройкой интернет-магазина, лучше перейти к уроку >>Установка компонента интернет-магазин.

Этот урок должен быть завершающим, но ведь приятней, когда ваш магазин уже запущен в интернет.  Разрабатывать его можно параллельно на локальном компьютере, добавляя рабочие функции в сеть.

Файлы вашего магазина будут храниться на виртуальном хостинге. Не важно, где он находится, главное, что он работает.

Мой выбор МакХост (http://mchost.ru/) .

14

  1. Давно работаю с ним.
  2. Приемлемые цены (Сказать, что самые дешевые нельзя, хотя раньше были такими) .
  3. Отличная служба поддержки. Отвечают почти мгновенно в режиме онлайн.

Как зарегистрироваться ?
Ищите кнопку заказать. Вам нужен именно Виртуальный хостинг. На сайте предлагается три тарифа, которые различаются объемами дискового пространства и количеством сайтов. Тарифа старт вполне достаточно – 3 сайта и 1G места , для магазина редко требует много места.
После того как вы нажали кнопку заказать, вас перекинет на страницу “Регистрация аккаунта”. Введите действующий e-mail, которым вы пользуетесь, и нажмите Далее.

Регистрация аккаунта на Хостинге

На следующей странице выберите тариф, например, Старт, срок и домен (имя сайта вводимое в строку браузера).

Советы по выбору домена:

  • Название должно быть коротким и запоминающимся.
  • Не желательны буквы, которые в английском алфавите можно написать двояко c и k, j и g и др.
  • Не желательны длинные аббревиатуры (не длиннее трех букв).

Выбор тарифа хостинга

После проделанных операций, вам на e-mail вышлют логин и пароль. С помощью них зайдите в панель управления, ссылка на которую находится в левом верхнем углу сайта.
Далее необходимо оплатить выставленные счета и ожидать пока пройдет оплата (до 10 мин). Отследить все денежные операции и статус их выполнения можно в пункте Финансы.

Меню финансы

!!! Дождитесь, пока текущий статус станет – активен.

Статус активен

Далее на сайт необходимо установить движок Joomla, на который и будет ставится магазин. Ставится он буквально одним нажатием мыши. Для этого переедите в меню установка приложений. Выберете Joomla 2.5.3 / Система управления сайтом

Установка приложений

!!! Версия Joomla должна быть именно 2.5, потому что на версии 3.0  и более на текущий момент движок Virtuemart не работает.

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

Процесс установки Joomla на хостинг

!!! сайт не заработает сразу, после того, как вы установили на него движок.
Вам придется еще немного подождать (от одного до шести часов), пока купленное вами доменное имя привяжется к хостингу.

Утром, после долгого сна, перейдя по адресу сайта вы увидите, что все заработало и перед вами простой стандартный шаблон Joomla, на который уже и будет накатываться магазин.

Установленная Joomla

Следующий урок >>Установка компонента интернет-магазин.

 

Для управления магазином на ваш движок сайта Joomla необходимо установить компонет VirtueMart. Этот компонет обладает огромными возможностями и легок в освоении. Для него существует множество модулей и плагинов.

Введите в адресной строке введите “адрес сайта”/administrator и наберите указанный вами при установке логин и пароль. Вы перейдете в панель управления сайтом.

Для установки нужно перейди в меню Расширения – Менеджер расширений.

Установка расширений Joomla

Установить расширение можно с жесткого диска, выбрав Выберите файл – Загрузить и установить.

Загрузить и установить расширение

Установите следующие расширения, в том порядке, в котором указаны.
Компонент VirtueMart2 (ядро магазина). После успешной установки появится окно:

Успешная установка VirtueMart

Вам будет предложено установить тестовые товары и категории (InstallSampleData справа внизу). Это можно сделать, если вы хотите сразу посмотреть, как будет выглядеть страница с товарами, но тогда вам придется вручную удалять все тестовые товары, что займет некоторое время. Не советую устанавливать.
Далее уставите расширение с модулями для магазина. Содержит модули поиска, корзины, выбора валюты и другие.

Успешная установка модулей VM

Все расширения было бы хорошо русифицировать. Установите плагины 1 и 2 с русификацией.
Проверьте, успешно ли установился компонент, перейдя в Компоненты – VirtueMart.

Отображение компонента магазина

Следующий урок >>Предварительная настройка интернет-магазина.

 

Для тестирование магазина желательно установить его эмулятор на свой компьютер. Это позволит быстро разобраться с оформлением и настройками магазина, а так же будет легко изменять файлы (ведь они лежат в обычной папке, а не хранятся на сервере). Если же вы послностью уверены в своих силах или ваш магазин оттестирован - передите к уроку >>Установка Joomla 2.5 на хостинг.

Установку на компьютер можно логически разбить на два шага: установка Denwer - специальной программы эмулятора и установка движка Joomla.

Как установить DenwerСкачайте Denwer и запустите установочный файл. В появившемся окне с вопросом о желании установить базовый пакет – ответьте Да. После этого произойдет процесс распаковки, и если все удачно – программа запросит нажать ENTER.

Начало установки Denwer

 Далее вам будет предложено выбрать папку для установки, по умолчанию это C:\WebServers, но вы можете ввести путь к другой папке. Если хотите оставить по умолчанию – не изменяйте.

После вам предложат подтвердить свой выбор – введите символ “y”, означающий да и нажмите ENTER.

Букву для вашего виртуального диска можно оставить по умолчанию – Z, если только она у вас уже не содержится в системе. В противном случае введите любую другую из английского алфавита.
Когда файлы запишутся, будет предложено выбрать цифру 1 или 2. Выберите 2 и нажмите ввод.
Создать ярлыки на Рабочем столе – введите “y” и нажмите ввод.

Ярлыки на рабочем столе Denwer

Пакет установлен. Можете проверить, на рабочем столе должны появиться три новых значка. Кликните на Start Denwer.

Start Denwer

После запуска всех утилит введите в адресной строке своего браузера http://localhost/denwer/. И если установка прошла успешно – появится окно:

Denwer успешно запустился

Установка движка Joomla. Для работы компонета интернет-магазин VirtueMart необходима Joomla версии 2.5.x и ниже. На текущий момент Joomla версии 3.x  и выше - не поддерживается компонентом.

Создайте на своем компьютере папку с названием сайта в дирректории Z:\ (или другой виртуальный диск, который вы указали при установки Denwer) \home\localhost\www. Например, Mysite.
Сразу скопируйте в эту папку архив с Joomla (скачать) .

Далее необходимо перезагрузить локальный сервер. Для этого кликните по иконке Restart Denwer.
После перейдите в ваш браузер и введите в адресной строке “http://localhost/Mysite
Появится установочное окно:

Выбор языка Joomla

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

Выбор базы данных Joomla

В окне конфигурации баз данных  нам необходимо ввести базу и пользователя, которых нам еще предстоит создать. Для этого в откройте новую вкладку в браузере и наберите “http://localhost/tools/”. Должно появиться:

Phpmyadmin

Выбираем phpmyadmin, после чего откроется страница на которой мы будем использовать всего две вкладки.

Нажмем первую вкладку – базы данных.

Создание базы данных phpmyadmin

Далее пишем название базы (Например, Mysite) и нажимаем создать.
Должно появиться сообщение об успешном создании базы данных, после чего переходим во вкладку пользователи и добавляем нового.

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

Имя пользователя такое же, как и название базы – mysite, хост локальный, пароль любой, например “1234”, сложность пароля тут не имеет никакого значения, т.к. сайт пока будет храниться и редактироваться только на нашем компьютере.

Добавить пользователя phpmyadmin

После сообщения об успешном создании пользователя необходимо дать ему все привилегии.

Привилегии пользователя

Все привилегии phpmyadmin

Выберете отметить все и нажмите кнопку ОК, под привилегиями. Параметры пользователя должны измениться, теперь ему должны быть доступны все привилегии.

Проверка привилегий пользователя

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

Добавление пользователя и БД

Конфигурация FTP вам вряд ли пригодится, так что просто нажмите далее.
В следующем окне введите название сайта, e-mail (обязательное поле, но можно ввести любое значение), логин, например “admin”, и пароль.

Название сайта и пароль администратора Joomla

Демо данные можно установить, если вы хотите увидеть как будет выглядеть шаблон вашего сайта в наполненном виде. Советую устанавливать начинающим пользователям, чтобы лучше представлять для себя структуру шаблона.
После требуется удалить директорию installation. В большинстве случаев кнопкой сделать это не удается, и приходится удалять вручную. Переходим в проводнике в папку сайта “\home\localhost\www\Mysite” и удаляем папку “ installation”.
После всех проделанных действий введите в строке браузера “http://localhost/Mysite/”, и вы уведете ваш сайт с английскими демо данными и стандартным шаблоном.

Joomla установленная на локальный хостинг

Следующий урок >>Установка Joomla 2.5 на хостинг.

 
 

Отзывы

Юрий
Модуль работает отлично. Были небольшие проблемы с установкой, но Сергей быстро разобрался. Модуль будет развиваться и дальше, и уверен он станет лучшим для Joomla. Из всех аналогов которые я видел, этот модуль лучший.

Никита Бакуменко
Плагин шикарный, работает как часики, спасибо))

УСТАНОВКА VIRTUEMART

VirtueMart - самый распрастраненный движок интернет-магазина для CMS Joomla. Мы предоставляем подробную инструкцию по его установке. Для тестирования желательно сначала установить магазин на локальный сервер. Если вы уже знакомы с этим движком, то ставьте его на хостинг и приступайте к разработке. После установки Joomla следует поставить сам компонент магазина. VirtueMart отличается от других движков большим количеством настроек. Чтобы быстро разобраться, что нужно для старта - читайте Предварительная настройка.
Все статьи раздела - Читать далее...

НАСТРОЙКА ФУНКЦИОНАЛА

Страница оформления заказа - одна из последних при покупке товара, но почти самая важная. Даже если пользователь уже решил купить товар, его может оттолкнуть заполнение множества полей. Подробная настройка страницы оформления заказа описана в этой статье. Так же вы можете изменить вид корзины под себя.
Второй важной частью является выбор шаблона для магазина. В пиратских шаблонах часто можно обнаружить вредоносные ссылки. Внешний вид сильно влияет на продажи, процесс покупки должен быть простым и удобным.
Все статьи раздела - Читать далее...

ХАКИ И ДОРАБОТКИ VIRTUEMART

Для VirtueMart существует множество готовых решений. Большинство их них необходимо дорабатывать индивидуально под каждый интернет магазин. Так же у движка есть некоторые ограничения, которые можно убрать, только изменив его код, например, нельзя добавить видео с youtube в описание категории VirtueMart, или описание товара ограничено - не хватает символов. Часто встречаемая проблема - Убрать второе поле имя Virtuemart 2.
В этом разделе вы найдете подробную информацию о многих хитростях движка virtuemart.
Все статьи раздела - Читать далее...