4.88 out of 5
4.88
8 reviews on Udemy

Интернет-магазин на OpenCart

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

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

Кроме того, большим плюсом для вас будет тот факт, что в каждой из частей идет работа со своей версией движка. В первой части – это будет версия 2.3, во второй – версия 2.1. А это значит, что вы сможете работать с темами сразу под две версии движка – современную и предыдущую, которые, хоть и незначительно, но все же отличаются друг от друга. Фактически вы получаете сразу два курса в одном.

Часть 1. Создание темы Styletour на OpenCart

Мы создадим тему со всем необходимым функционалом для интернет-магазина на OpenCart:

  1. Категории

  2. Товары

  3. Корзина

  4. Переключение валют

  5. Переключение языка

  6. Авторизация

  7. Регистрация

  8. Красивый слайдер

  9. Рекомендуемые товары на главной странице

  10. Многофункциональная страница карточки товара

  11. Страница показа товаров выбранной категории

Тема разрабатывается на версии OpenCart 2.3.

Часть 2. Создание темы Resale на OpenCart

Мы создадим тему со всем необходимым функционалом для интернет-магазина на OpenCart:

  1. Нестандартное меню категорий (для каждой категории выводится своя картинка-иконка)

  2. Товары

  3. Корзина

  4. Переключение валют

  5. Переключение языка

  6. Авторизация

  7. Регистрация

  8. Рекомендуемые товары на главной странице

  9. Многофункциональная страница карточки товара

  10. Страница показа товаров выбранной категории

Тема разрабатывается на версии OpenCart 2.1.

OpenCart – это бесплатная CMS с открытым исходным кодом для создания интернет-магазинов любой сложности.

Огромную популярность OpenCart обрел благодаря своей простоте, функциональности и скорости работы.

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

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

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

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

OpenCart позволяет создать современный интернет-магазин со всеми необходимыми элементами: баннеры, стильный слайдер, многофункциональная навигация, модули оплаты и доставки, категорий и фильтра и многое другое…

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

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

Часть 1. Создание темы Styletour на OpenCart

1
Введение. Организационные вопросы

В первом уроке курса мы:

  • пройдемся по организационным моментам

  • рассмотрим структуру курса

  • узнаем основные источники документации

  • остановимся на преимуществах движка по сравнению с его прямыми конкурентами

  • узнаем об отличиях оригинальной версии OpenCart от его русскоязычной локализации ocStore

  • обозначим необходимое программное обеспечение

2
Установка OpenCart

В этом уроке мы пройдем несложную процедуру установки OpenCart. Весь процесс установки занимает всего несколько минут и справится с этим даже неискушенный пользователь, что является дополнительным плюсом в пользу этой замечательной CMS. 

3
Структура темы OpenCart

В этом уроке мы проанализируем структуру тем для OpenCart. Здесь вы узнаете, по какому принципу работают темы и, соответственно, как правильно создавать тему и как не рекомендуется этого делать. 

4
Перенос шаблона в структуру темы

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

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

5
Шаблон Header

В этом уроке мы выделим шаблон header.tpl, который отвечает за подключение необходимых для работы шаблона ресурсов, метатеги, а также вывод неизменной части шаблона – шапки, в которой будет находиться меню, корзина и ряд других функций. 

6
Подключение стилей и скриптов

В этом уроке мы вновь коснемся темы подключения дополнительных ресурсов – стилей и скриптов.

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

7
Переключение языков

OpenCart реализует паттерн MVC и расширяет его до MVCL. Последний компонент данной аббревиатуры – L (language) - отвечает за мультиязычность.

Русская локализация OpenCart – ocStore – предлагает нам по умолчанию два языка: русский и английский. В этом уроке мы реализуем возможность переключения между языками и подробнее узнаем о мультиязычности в OpenCart.

8
Переключение валют

Кроме мультиязычности, OpenCart может предложить нам работу с различными валютами. По умолчанию это 3 основных валюты: рубли, доллары и евро.

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

9
Авторизация и регистрация

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

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

10
Кнопка корзины

В этом уроке мы реализуем:

  • кнопку корзины, на которой будет выводиться краткая информация о содержимом корзины: количество товаров и итоговая сумма

  • наша корзина будет открываться в модальном окне, как это реализуется во многих современных интернет-магазинах

11
Меню категорий

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

12
Слайдшоу в шапке

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

13
Использование переменной $class

OpenCart предлагает нам к использованию в шаблонах переменную $class, которая позволяет отличать одну страницу от другой.

Благодаря этой переменной мы можем по-разному оформлять одни и те же элементы в зависимости от той или иной страницы. В данном уроке мы рассмотрим некоторые примеры использования этой переменной.

14
Модуль html

В этом уроке мы воспользуемся одним из модулей по умолчанию в OpenCart – это модуль html. Благодаря этому модулю, мы можем выводить произвольный html код в нужном месте шаблона. 

15
Шаблоны column_left и home

В данном уроке мы:

  • поработаем с шаблонами column_left, который отвечает за левый сайдбар

  • поработаем с шаблоном home, отвечающим за контентную часть главной страницы

16
Модуль категорий в сайдбаре

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

17
Модуль HTML в сайдбаре

Наш шаблон предполагает наличие в сайдбаре, кроме меню категорий, еще и краткой информации о магазине. Вывести эту информацию проще всего через модуль html, что мы и сделаем в данном уроке. 

18
Модуль рекомендуемых товаров

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

19
Добавление товара в корзину

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

20
Удаление товара из корзины

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

21
Шаблон Footer

В этом уроке мы поработаем с еще одним общим шаблоном OpenCart – это шаблон footer. В этом шаблоне, как правило, выводится информация о магазине: статьи, условия гарантии, о доставке и прочая информация для покупателей. 

22
Карточка товара. Часть 1

Мы завершили работу над главной страницей и переходим к работе с шаблоном, отвечающим за показ карточки товара.

В карточке товара достаточно много функционала, поэтому мы уделим этому шаблону 4 отдельных урока.

Здесь мы реализуем такие функции, как:

  • показ основного и дополнительных изображений товара

  • возможность просмотра изображений в модальном окне

  • вкладки с показом описания товара, его характеристик и отзывами к товару

  • возможность комментирования пользователями товара

  • вывод опций товара и информации о нем

  • возможность добавления в корзину выбранного количества товара

23
Карточка товара. Часть 2
24
Карточка товара. Часть 3
25
Карточка товара. Часть 4
26
Шаблон категории. Часть 1

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

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

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

27
Шаблон категории. Часть 2
28
Шаблон категории. Часть 3
29
Шаблон корзины

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

30
Создание модуля

В этом уроке мы рассмотрим вариант создания простейшего модуля. Эта тема немного выходит за рамки нашего курса, который посвящен созданию тем для OpenCart. Тем не менее, я решил коснуться и данного вопроса, знание которого позволит вам в дальнейшем создавать не только темы, но и модули для OpenCart. 

31
Модификаторы OCMOD

В этом уроке мы рассмотрим еще один вариант расширения OpenCart. Здесь мы познакомимся с понятием модификаторы OCMOD. OCMOD – это встроенная система, которая позволяет изменять поведение имеющегося функционала или же добавлять новый функционал. При этом работать с модификаторами очень удобно. 

Часть 2. Создание темы Resale на OpenCart

1
Установка OpenCart

Поскольку данную тему мы создаем на другой версии OpenCart, нам необходимо установить эту версию. В данном уроке мы установим нужную версию OpenCart. 

2
Перенос шаблона в структуру темы

Данную тему мы будем создавать по тому же принципу, что и предыдущую.

Начнем мы с переноса верстки в папку новой темы и добьемся той же картинки, что и в верстке: правильно подключенные стили, скрипты и картинки.

3
Шаблон header

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

4
Переключение языков

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

Процесс по сути будет идентичен аналогичному уроку из предыдущей темы.

5
Кнопка корзины

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

6
Создание модуля категорий. Часть 1

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

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

Также мы рассмотрим некоторые другие варианты создания такого меню.

7
Создание модуля категорий. Часть 2
8
Создание модуля категорий. Часть 3
9
Модуль рекомендуемых товаров. Часть 1

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

10
Модуль рекомендуемых товаров. Часть 2
11
Шаблон категорий. Часть 1

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

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

12
Шаблон категорий. Часть 2
13
Шаблон категорий. Часть 3
14
Товары категории. Часть 1

Здесь мы будем работать над выводом товаров выбранной категории. 

15
Товары категории. Часть 2
16
Товары категории. Часть 3
17
Карточка товара. Часть 1

Предпоследние два урока мы посвятим работе с карточкой товара.

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

18
Карточка товара. Часть 2
19
Корзина

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

Бонус 1. Перенос на хостинг. Домен

1
Перенос на хостинг. Домен

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

В данном бонусе показаны все тонкости переноса готового интернет-магазина на хостинг со сменой при этом доменного имени.

  • Научитесь переносить готовый сайт с локального сервера на хостинг либо с одного хостинга на другой хостинг

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

Бонус 2. Подключение онлайн чата к интернет-магазину

1
Подключение онлайн чата к интернет-магазину

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

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

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

Бонус 3. Виджет обратного звонка для магазина

1
Виджет обратного звонка для магазина. Часть 1

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

Данное дополнение создается для первой темы, которую мы создадим с нуля – Styletour.

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

  • Вы не только узнаете принципы написания модификаторов, но и создадите один полноценный модификатор, который можно установить на любой современный 
    интернет-магазин OpenCart

  • Мы напишем собственное дополнение для виджета обратного звонка, которое можно легко и просто установить на любой интернет-магазин OpenCart – как на ваш, так и любой другой под управлением OpenCart

2
Виджет обратного звонка для магазина. Часть 2
3
Виджет обратного звонка для магазина. Часть 3
4
Виджет обратного звонка для магазина. Часть 4
5
Виджет обратного звонка для магазина. Часть 5
You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.9
4.9 out of 5
8 Ratings

Detailed Rating

Stars 5
7
Stars 4
1
Stars 3
0
Stars 2
0
Stars 1
0
057d06365ce0c9972e5b086f4ca2a6fc
30-Day Money-Back Guarantee

Includes

14 hours on-demand video
Full lifetime access
Access on mobile and TV
Certificate of Completion