Создание интернет-магазина на WooCommerce с нуля

2:30 Часов
Зачислено 0 учеников

0 Оценок

Описание курса

В предлагаемом цикле уроков мы будем создавать интернет-магазин на CMS WordPress с использованием плагина WooCommerce. При этом мы не будем использовать готовые темы, а будем создавать собственную тему для WooCommerce с нуля.

Комментарии (0)

В первом уроке мы установим WordPress и WooCommerce, а также импортируем товары из файла CSV, который предлагается плагином WooCommerce.

-

В данном видео мы создадим папку собственной темы и задекларируем поддержку темой WooCommerce. Для чего необходимо декларирование поддержки WooCommerce в теме? Для переопределения шаблонов. Одним из вариантов создания темы WooCommerce является как раз переопределение шаблонов. Другой вариант - использование хуков. Мы будем использовать оба варианта при создании темы и разработки интернет-магазина на WooCommerce.

-

Из данного урока вы узнаете о двух ключевых вариантах создания темы WooCommerce, которые и позволяют нам создавать тему с нужным оформлением. Первый способ, попроще, заключается в переопределении шаблонов. Все, что необходимо сделать, это найти нужный шаблон в папке плагина, скопировать его в нужную папку создаваемой темы и внести правки. Второй способ связан с хуками. Шаблоны WooCommerce активно используют хуки для различного функционала (цикл вывода товаров, вывод карточки товара, вывод элементов карточки товара и т.д.). И изменить этот функционал можно, взаимодействуя с хуками, например, переопределяя функции, прикрепленные к хукам.

-

В данном уроке по WooCommerce мы продолжим создание собственной темы интернет-магазина и перенесем верстку главной страницы в шаблон главной страницы WordPress. Также мы правильно подключим стили и скрипты темы, используя файл functions.php. Кроме этого, мы используем фильтр для отключения стандартных стилей WooCommerce - для нас они лишние, поскольку у нас есть собственное оформление.

-

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

-

В этом уроке мы создадим настройки темы, в которые вынесем телефон и ссылки соцсетей. Для работы с опциями темы будем использовать Customizer API в WordPress. Кастомайзер очень удобен с точки зрения юзабилити и позволяет при изменении значения опции сразу увидеть результат изменений на странице сайта.

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-

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

-
Андрей Кудлай

Андрей Кудлай

Веб-разработчик
5.00
Верный пользователь
Эксперт
Серебряные курсы
Популярный
Фантастическая поддержка

Отзывы учеников

0
0 Отзывы
Качество контента (0)
Навыки преподавателя (0)
Стоимость товара (0)
Качество поддержки (0)

Отзывы (0)

Качество контента
Навыки преподавателя
Стоимость товара
Качество поддержки
Бесплатно
Гарантия возврата денег - 14 дней
В Курс включено:
Вместимость:
Неограниченно
Продолжительность:
2:30 Часов
Учеников:
0
Файлы:
20
Дата создания:
25.02.2024

Пожаловаться на курс

Пожалуйста, кратко опишите содержание жалобы.

Поделиться

Поделись курсом со своими друзьями

Купить за баллы

Центр настроек конфиденциальности

Настройки файлов cookie

Мы используем файлы cookie для сохранения или получения информации о вашем браузере. Эта информация может относиться к вам, вашим предпочтениям, вашему устройству или в основном будет использоваться для работы веб-сайта в соответствии с вашими ожиданиями. Мы уважаем ваше право на конфиденциальность данных, поэтому вы можете отказаться от использования некоторых типов файлов cookie. Нажимайте на заголовки категорий для получения более подробной информации и изменения настроек. При этом следует помнить, что блокировка некоторых типов файлов cookie может повлиять на использование вами веб-сайта и ограничить предлагаемые нами услуги.