WooCommerce является самой популярной и «наиболее настраиваемой платформой электронной коммерции для построения вашего онлайн-бизнеса». Вы можете скачать WooCommerce бесплатно, но вы действительно начнете понимать его возможности, когда начнете использовать плагины и темы WordPress WooCommerce .
Но вам действительно нужно использовать тему WooCommerce?
Хотя это не обязательно, я настоятельно рекомендую это.
Не только темы WooCommerce по дизайну ориентированы на электронную коммерцию, но и вся тема сосредоточена вокруг стилей WooCommerce. CSS, который WooCommerce использует для определения способа отображения продуктов, затем используется темой WordPress WooCommerce, чтобы действительно собрать все воедино — создав некоторые из наиболее красиво оформленных витрин электронной коммерции.
Не говоря уже о том, что установка и настройка новой темы WordPress WooCommerce не сложнее, чем настройка любой другой темы WordPress.
Позвольте мне показать вам, как это сделать.
Как установить и настроить новую тему WordPress WooCommerce
Если у вас уже установлен WooCommerce , это здорово! Если нет, я настоятельно рекомендую Руководство по использованию WooCommerce Рэйчел Макколлин. Это познакомит вас с WooCommerce и проведет вас через все шаги, необходимые для настройки вашего интернет-магазина.
Теперь давайте начнем с того, как установить и настроить новую тему WordPress WooCommerce.
Шаг 1: Установите фиктивные данные
Если вы уже добавили свои продукты в WooCommerce, я рекомендую пропустить этот шаг и начать с шага 2.
Установка фиктивных данных добавляет к вашему витрине вымышленные продукты, чтобы помочь вам визуализировать ваш магазин с продуктами. После того, как вы завершили установку и настроили новую тему WordPress WooCommerce, вам нужно будет удалить все фиктивные данные перед добавлением ваших продуктов. В противном случае вы рискуете случайно удалить свои данные о продукте.
Фиктивные данные включены в ваш плагин WooCommerce. Если вы установили WooCommerce в WordPress Admin, загрузите плагин из каталога плагинов WordPress на свой компьютер. Это будет проще, чем войти в свой FTP, зайти в каталог плагинов и загрузить оттуда фиктивные данные.
После завершения загрузки разархивируйте файл, чтобы вы могли импортировать файл dummy-data.xml.
Перейдите в раздел « Инструменты» и нажмите « Импорт» :
Не позволяйте «налоговым ставкам WooCommerce (CSV)» сбить вас с толку. Это можно сделать позже, если хотите. Для фиктивных данных WooCommerce вы захотите выбрать WordPress .
Скорее всего, у вас не будет установлен плагин WordPress Importer, так что продолжайте и установите сейчас .
После установки, активируйте плагин и запустите импортер .
Вы помните, где вы скачали и распаковали плагин WooCommerce? Большой! Теперь вам нужно нажать « Выбрать файл» и перейти к нему.
Ваши фиктивные данные должны быть в разархивированной папке: (woocommerce.version.number)> woocommerce> dummy-data.
Откройте папку dummy-data, выберите dummy-data.xml , и вы готовы загрузить файл и импортировать.
Это последнее, что вам нужно сделать перед импортом всех фиктивных данных.
Отчасти это личное предпочтение, но вот что я делаю (скриншот ниже):
Импортируйте автора по умолчанию «wooteam» вместо создания нового автора или использования ранее существовавшего автора. Таким образом, вы узнаете, какой контент был импортирован / создан в этом процессе, основываясь на имени автора (я рекомендую удалить автора, когда вы удалите фиктивные данные после того, как закончите установку и настройку новой темы WordPress WooCommerce).
Я также рекомендую вам загрузить и импортировать вложения, чтобы у вас были изображения, связанные с каждым продуктом (опять же, вы захотите убедиться, что носитель удален, когда вы закончите с фиктивными данными).
После того как вы сделали эти выборы, отправьте:
Посетите yourwebsite.com/shop/, и вы должны увидеть полностью импортированный тестовый магазин:
Да! Ты сделал это!
Это не очень хорошо продумано, не так ли? Хорошо, что мы собираемся установить великолепную тему WordPress WooCommerce, такую как Savoy .
(ПРИМЕЧАНИЕ. После завершения установки и настройки темы не забудьте удалить продукты и изображения из фиктивного импорта данных, прежде чем приступить к добавлению собственных продуктов.)
Шаг 2. Установите тему WordPress WooCommerce.
Теперь давайте посмотрим, как установить тему WooCommerce. Если вы еще не загрузили тему WordPress Commerce, загрузите ее на свой компьютер (убедитесь, что вы знаете, где вы ее скачиваете, чтобы иметь к ней доступ).
Вы можете установить свою тему двумя способами:
- Получите доступ к своему сайту через FTP
- От администратора WordPress
FTP ваша тема
Если вам удобно использовать FTP, подключитесь к своему серверу и перейдите в каталог wp-content> themes . Здесь вы хотите отправить свою тему. Однако перед отправкой разархивированной папки на сервер убедитесь, что вы отправляете свою тему. Давайте подробнее рассмотрим наш пример темы WordPress от ThemeForest .
Разархивировав загрузку, вы увидите несколько разных папок:
Не каждая тема, которую вы скачаете, будет упакована таким образом. Иногда загружаемая папка является актуальной папкой темы. Это всегда хорошая идея, чтобы перепроверить, так как это зависит от места.
The Savoy — минималистская AJAX WooCommerce Theme включает в себя некоторые дополнительные вещи, такие как документация, ресурсы и т. Д. Если вы загляните в папку Theme Files для Savoy, вы найдете свою тему (savoy.zip).
Если вы устанавливаете через FTP, загрузите разархивированную папку с темой (например, «savoy») в каталог тем. Если вы не уверены в использовании FTP или предпочитаете установить его из WordPress Admin, это нормально. Я тоже предпочитаю использовать WordPress Admin.
От администратора WordPress
Установка темы WordPress от администратора требует, чтобы папка темы была заархивирована (themefolder.zip). Как мы уже говорили ранее, вам нужно убедиться, что вы работаете с самой папкой темы, а не с папкой, в которую ваша тема может быть упакована.
От Администратора WordPress, под Оформлением , нажмите Темы :
Добавить новую тему:
Загрузить тему:
Вы помните, где находится ваш почтовый файл темы?
(Наш пример темы называется: savoy.zip)
Нажмите « Выбрать файл» и перейдите к нему:
После установки вы можете зайти в Appearance> Themes в вашем WordPress Admin, чтобы увидеть, установлен ли он, или щелкнуть, чтобы активировать его сразу.
Как вы можете видеть (ниже), тема Savoy успешно установлена, поэтому наведите курсор мыши и активируйте :
Теперь, когда ваша тема WordPress WooCommerce успешно установлена и активирована, давайте настроим ее.
Шаг 3. Настройка WordPress WooCommerce Theme
Не каждая тема настроена точно так же. То, как тема спроектирована и разработана, имеет большое значение, поэтому могут быть некоторые различия между этим учебным пособием и тем, с чем вы можете столкнуться. В целом, однако, это должно помочь вам настроить вашу тему WordPress WooCommerce — независимо от того, какую тему WooCommerce вы используете в ThemeForest или где-либо еще.
Рекомендуемые / обязательные плагины
После установки и активации темы Savoy вы будете уведомлены о рекомендуемых плагинах:
Иногда ваша тема уведомляет вас о рекомендуемых плагинах, в то время как другие включают рекомендации в свою документацию. Могут быть функции дизайна темы, такие как дополнительные ползунки, которые не закодированы в теме, но приспособлены для.
Нажмите Начать установку плагинов в теме Savoy, чтобы увидеть список рекомендуемых плагинов:
Опять же, это будет варьироваться от темы к теме, но в этом случае вы можете или не можете установить все из них.
Например, хотя Savoy рекомендует контактную форму 7 и включает в себя стилизацию для нее, вы можете не использовать этот плагин для своей контактной формы. Вы можете использовать что-то вроде гравитационных форм или форм ниндзя .
Плагин, такой как Regenerate Thumbnails, является отличным плагином для тех, кто настроил существующий магазин и настроил свои изображения для предыдущей темы. Этот плагин будет проходить через вашу медиатеку WordPress и изменять размер всех ваших изображений для работы с вашей новой темой. Вы можете или не хотите делать это с фиктивными данными, и вы можете вообще пропустить этот плагин (но я рекомендую делать это в любом случае, чтобы все носители были правильно настроены для тестирования).
Однако такой плагин, как Envato Toolkit, очень важен для тем, приобретенных через ThemeForest, и гарантирует, что вы будете получать уведомления об обновлениях тем.
Я бы порекомендовал установить все рекомендуемые плагины, когда вы начинаете. Вы всегда можете удалить плагин позже, если он вам не нужен, тогда как, если вы не установите плагин, который вам нужен, вы можете расстроиться, потому что тема не «работает» или делает то, что вам понравилось в демоверсии.
После того, как вы установили все, некоторые или ни один из рекомендуемых и / или необходимых плагинов, не забудьте активировать их:
Если вы используете тему, приобретенную в ThemeForest, такую как пример темы Savoy, не забудьте ввести свое имя пользователя Marketplace и секретный ключ API в Envato WordPress Toolkit, чтобы обеспечить правильное обновление темы.
Настроить
Это часть установки и настройки вашей темы WordPress WooCommerce, когда она становится действительно интересной, и вы начинаете видеть, как ваш сайт оживает.
Вы можете получить доступ к настройщику WordPress из меню в WordPress: Внешний вид> Настройка . Или перейдите на страницу «Темы» в разделе « Внешний вид»> «Темы» и нажмите кнопку « Настроить» :
Добро пожаловать в настройщик WordPress:
Здесь мы сделаем несколько настроек, прежде чем перейти к более глубокой конфигурации.
Первое, что вы увидите, это идентичность сайта . Здесь вы можете изменить название своего сайта и слоган.
Иногда здесь вы можете добавить собственное изображение заголовка и / или иконку сайта (это будет варьироваться от темы к теме).
Далее настройте ваши меню:
Если это новая настройка WooCommerce или вы еще не создали ни одной страницы, вам, возможно, не так уж много «настроить». Однако с установленным WooCommerce автоматически добавляются некоторые страницы, которые, я уверен, вы захотите добавить в свое меню сразу.
Вы можете легко добавить и создать новое меню:
После того, как вы добавили меню (или несколько), вы можете выбрать, где вы хотите, чтобы меню отображалось, а также различные элементы меню (такие как пользовательские ссылки, сообщения, страницы, продукты и т. Д.).
Это дает вам большую гибкость в том, как вы хотели бы, чтобы ваш сайт WooCommerce функционировал. Не бойтесь поиграть с этим или изменить его позже.
Прежде чем мы покинем WordPress Customizer, вам нужно сказать WordPress сделать первую страницу вашим магазином:
Пометьте Лицевую страницу как Статическую страницу и выберите Лицевую страницу как свою страницу Магазина . Страница магазина была автоматически создана при установке плагина WooCommerce.
Что касается страницы сообщений , это зависит от того, где вы хотите вести блог на своем сайте WooCommerce. Если это так, вам нужно создать страницу блога и выбрать ее на этой странице в настройщике WordPress или в настройках администратора WordPress> Чтение .
Результаты
С некоторой базовой конфигурацией вы можете увидеть, как великолепно выглядит ваш интернет-магазин, используя тему WordPress WooCommerce:
Страницы отдельных продуктов выглядят потрясающе:
Он даже включает в себя сопутствующие товары:
Савойская — минималистская AJAX WooCommerce Theme тема позволяет вам легко настраивать многие элементы на вашем сайте и может пойти далеко за тем, что я рассмотрел в этом руководстве (обязательно прочитайте документацию вашей темы, чтобы узнать больше о вашей теме). Я только показал вам изменения, которые могут быть внесены в WordPress Customizer и обычно могут быть внесены практически в любую тему, которую вы можете использовать.
Вывод
Вы можете ясно увидеть, насколько простыми могут быть эти первые первые шаги в настройке новой темы WordPress WooCommerce и насколько она хорошо выглядит — просто с помощью темы WordPress, разработанной специально для WooCommerce.
Есть много полезных плагинов WordPress WooCommerce, доступных на CodeCanyon, и некоторые красиво оформленные и эффективные темы WordPress WooCommerce на ThemeForest .
Глядя на некоторые из самых продаваемых тем ThemeForest WooCommerce, можно было бы начать с самого начала ( Savoy по-прежнему мой любимый). Я уверен, что вы найдете то, что идеально подходит для вашего интернет-магазина. Или просмотрите нашу популярную витрину, чтобы найти именно ту, которая подходит для вашего магазина:
-
WooCommerce19+ лучших тем WooCommerce: чтобы сделать лучший интернет-магазин
Что вы используете WooCommerce для продажи?