В прошлом уроке мы установили WordPress на хостинг, и теперь у нас есть «чистый» сайт без оформления. Пришло время превратить его в полноценный интернет‑магазин. Интернет‑магазины на WordPress работают при помощи плагина WooCommerce — это специальный модуль, который добавляет в сайт корзину, товары, оформление заказов, оплату и всё, что нужно для продажи. В этом уроке мы не только установим и настроим магазин, но и разберёмся с шаблоном, а также установим необходимые плагины.
Сразу важно понять разницу: WordPress — это «движок» сайта, а шаблон — это его внешний вид и структура. Интернет‑магазины могут работать на любых шаблонах, но есть темы, которые специально заточены под магазины. В WordPress есть бесплатные шаблоны: их можно установить в разделе «Внешний вид» → «Темы» → «Добавить тему» и выбрать любую бесплатную тему из каталога.
Но сегодня мы пойдём дальше и установим премиальный шаблон Woodmart — это мощная тема для интернет‑магазинов, с красивым дизайном, гибкими настройками и готовыми демо‑страницами. У нас уже есть архив шаблона Woodmart и файлы русификации, поэтому будем работать с ними.
Итак, у нас есть: установленный WordPress, доступ в админку, архив шаблона Woodmart и файлы русификации. Дальше всё делаем пошагово, так, чтобы справился даже новичок.
Где скачать?
Просто прогуглите.
Сначала заходим в админку WordPress. Для этого в браузере открываем www.вашдомен.ru/wp-admin и вводим логин и пароль, которые вы указывали при установке WordPress. Попадаем в панель управления сайтом. Слева видим меню. Нас интересует раздел «Внешний вид» → «Темы». Открываем его. Здесь вы увидите уже установленные темы по умолчанию. Нажимаем кнопку «Добавить тему» вверху. Но так как у нас есть архив шаблона Woodmart, мы не будем искать его в каталоге — мы загрузим его вручную. Вверху нажимаем «Загрузить тему», выбираем архив Woodmart с компьютера и нажимаем «Установить». Ждём, пока тема загрузится, затем нажимаем «Активировать». Всё, шаблон Woodmart установлен и активирован.
Дальше нам нужно установить необходимые плагины. Обычно после активации премиальных тем WordPress показывает уведомление вверху: «Эта тема рекомендует установить следующие плагины». В случае Woodmart это могут быть: WooCommerce, WPBakery или другой конструктор, Woodmart Core и дополнительные плагины. Нажимаем «Начать установку плагинов» или «Install required plugins». Отмечаем все нужные плагины и выбираем «Установить», затем после установки — «Активировать». Если уведомление не появилось, можно зайти в раздел «Плагины» → «Добавить новый» и вручную установить WooCommerce, а также плагины, указанные в документации Woodmart. При установке Woodmart вам будут предложены установить рекомендованные плагины. Также в конце этой статьи я записал видео где с нуля устанавливаю шаблон, делайте все как на видео.
Теперь немного про WooCommerce. Это плагин, который превращает обычный сайт на WordPress в интернет‑магазин. После установки WooCommerce в меню слева появятся разделы «Товары», «Заказы», «Купоны» и т.д. При первой активации WooCommerce предложит пройти мастер настройки: указать страну, валюту, тип магазина, способы оплаты и доставки. Для новичков можно пройти этот мастер, просто выбирая самые простые варианты — всё это потом можно изменить.
После установки темы и плагинов переходим к демо‑контенту. Преимущество Woodmart в том, что он позволяет установить готовые демо‑сайты: с уже настроенными страницами, меню, товарами, главной страницей и т.д. Это сильно экономит время и помогает новичкам быстрее понять, как всё устроено. В админке ищем раздел Woodmart (обычно он появляется в меню слева) или пункт «Woodmart Dashboard» / «Демо‑контент». Открываем его. Там вы увидите список демо‑шаблонов: разные варианты магазинов с разным дизайном. Выбираем тот, который вам нравится, и нажимаем «Импортировать» или «Install demo». Обычно система спросит, что именно импортировать: страницы, меню, виджеты, настройки, товары, изображения. Для новичков проще всего выбрать полный импорт, чтобы получить готовый пример магазина.
Импорт демо‑контента может занять несколько минут. Важно дождаться окончания процесса и не закрывать страницу. После завершения можно открыть сайт в новой вкладке и посмотреть, как он выглядит. Вы увидите уже готовый магазин: главную страницу, каталог, карточки товаров, шапку, подвал и т.д. Всё это — демо‑данные, которые потом можно заменить на свои. Важно! При импорте демо данных обязательно читайте документацию от автора. Там в разделе Требования указаны требования к хостингу. Вам следует изменить в настройки в PHP На хостинге. Не пугайтесь, это делается очень легко. Смотрите видео в конце.
Теперь про русификацию. У нас есть файлы русификации для Woodmart. Обычно это файлы перевода .po и .mo, которые нужно поместить в папку с переводами темы или использовать через плагин Loco Translate. Для новичков самый простой способ — установить плагин Loco Translate через раздел «Плагины» → «Добавить новый», найти Loco Translate, установить и активировать. Затем зайти в «Loco Translate» → «Темы», выбрать Woodmart, нажать «Добавить новый перевод», выбрать язык «Russian» и либо импортировать готовый файл перевода, либо отредактировать строки вручную. После этого большинство надписей в теме станет на русском языке.
Но самый легкий способ показан на видео, просто скопируйте языковые файлы в указанную папку.
Когда шаблон установлен, плагины активированы, демо‑контент импортирован и русификация настроена, у вас уже есть полноценный интернет‑магазин, который выглядит как настоящий рабочий проект. Дальше вы сможете менять логотип, цвета, шрифты, удалять демо‑товары и добавлять свои, настраивать меню и страницы. Но это уже тема следующих уроков.
Видео полной установки шаблона до готового интернет-магазина:
Если в процессе установки у вас что‑то не получилось — не переживайте. Пишите в комментариях, описывайте проблему своими словами, прикладывайте скриншоты — я постараюсь помочь и подсказать, что делать дальше.
Подпишитесь на WebSkill Академию, чтобы не пропустить новые бесплатные уроки.
Все курсы открыты для всех — без оплаты, без регистрации.
Подписка даёт вам возможность получать уведомления о новых публикациях и задавать вопросы в комментариях, где я лично отвечаю и помогаю.
Если возникнут сложности — вы всегда сможете получить техническую поддержку прямо под уроком.