Как создать интернет-магазин на WordPress с импортом из 1С

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

Кроме того, что вы узнаете, как создать интернет-магазин на WordPress, мы еще разберем, как делать импорт товаров из 1C.

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

• Установка локального сервера
• Установка и настройка WordPress
• Установка и настройка Woocommerce
• Установка плагина WP ALL Import и настройка импорта товаров

Если вы в поиске надежного хостинга, возможно планируете перенести свой сайт или думаете над тем, где создать новый сайт, тогда читайте статью, о том, как разместить сайт в интернете:

• Как разместить сайт в интернете? (выбор хостинга)

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

А мы начнем с установки локального сервера на свой ПК.

Установка локального сервера

Первое что нам нужно сделать, это установить локальный сервер (он предназначен для того, чтобы вы смогли запустить ваш сайт на своём ПК). Заходим на сайт https://ospanel.io/download/ и скачиваем версию ultimate (в ней будет куча полезных программ для разработки сайтов, в отличии от версии Basic). После вас попросят пожертвовать любую сумму по желанию, но можно отказаться и нажать “Нет, спасибо, хочу просто скачать”.

Качаться будет долго, поэтому идём по своим делам и возвращаемся через пару часов.

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

Заходим в данную папку и видим следующее, где “Domains” — папка, где будет хранится интернет-магазин, а два файла: “Open Server x64” и “Open Server x84” предназначены для запуска локального сервера. В зависимости от разрядности вашей системы windows, нужно выбрать исполняющий файл Open Server. Чтобы узнать это нужно воспользоваться поиском и набрать на клавиатуре “Система” и далее выбрать “Система”.

В открывшемся окне узнаем разрядность системы

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

Через несколько минут подтверждаем перезагрузку ПК.

После перезагрузки запускаем open server и в нижнем углу экрана должен появится красный флажок, кликаем на него правой кнопкой мыши и выбираем “Запустить”. Протестировать работу сервера можно кликнув в том же самом меню “Мои сайты -> localhost”.

Установка и настройка WordPress

Отлично, переходим к следующей части, а именно — установка WordPress.

Качаем его тут https://ru.wordpress.org/download/ и распаковываем в “Domains”, папку “Wordpress”, переименовываем эту папку в “ourshop.loc” (ourshop можно заменить на любое другое название, “loc” мы же добавляем для того, чтобы у нас не срабатывала переадресация на ourshop.ru/ или любую другую существующую доменную зону).

Запускаем http://ourshop.loc/ в любом браузере.

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

Опять нажимаем правой кнопкой мыши на флажок в правой нижнем углу и выбираем “Дополнительно -> PhpMyAdmin”(PhpMyAdmin – это веб-приложение для администрирования баз данных). И так, запустили и набираем логин “root”,а поле пароля оставляем пустым (это стандартные логин и пароль для PhpMyAdmin).

После нажимаем в левом верхнем углу “Создать БД” , заполняем имя базы данных “ourshop” и нажимаем “создать”.

Теперь возвращаемся к установке WordPress и нажимаем “Отправить” и получаем следующее окно.

Нажимаем “Запустить установку” и заполняем название сайта, имя пользователя, пароль желательно использовать тот, что рекомендуется WordPress (никаких “123”), только предварительно сохраните логин и пароль в блокноте, чтобы потом не нужно было его восстанавливать. А на случай, если вы всё-таки забыли пароль заполняем поле “Ваш email” (также туда будут отправляться заявки c интернет-магазина).

Нажимаем “Установить WordPress”, после нажимаем “Войти“, заполняем логин и пароль.

Теперь давайте разберемся, что же такое WordPress. WordPress — это система управления сайта с огромным количеством готовых решений (плагины). Исходя из этого, мы можем сложить любой сайт, как конструктор. Но перед этим, нам нужно установить уже готовый шаблон для страниц (в WordPress это называется Тема) интернет-магазина. Заходим сюда и скачиваем. Теперь нужно перенести содержимое загруженного архива в “путь_к_OpenServer\domains\ourshop.loc\wp-content\themes\”.

Далее нужно активировать тему Storefront. Заходим в http://ourshop.loc/wp-admin/ и в левой панели выбираем “Внешний вид->Темы” и нажимаем “Активировать”. После активации мы заходим через меню в “Плагины” и нажимаем “Добавить новый”. В правом верхнем углу в поле “Поиск плагина” записываем “Woocommerce” и когда запрос поиска обработается, мы увидим плагин “Woocommerce”, далее нажимаем “Установить”. Когда загрузка закончится (иконка загрузки пропадет и вместо нее появится кнопка “Активировать”, которую мы и нажимаем.

Установка и настройка Woocommerce

Далее настраиваем плагин “Woocommerce” и разберем каждое поле для настройки.

Настройки магазина:

• ‘Где базируется ваш магазин?’ — указываем страну, где находится ваш магазин(физический адрес);
• ‘Адрес’ — записываем точный адрес, а именно улица, адрес дома, номер кабинет или квартиры;
• ‘Дополнения по адресу’ — дополнительная информация по адресу;
• ‘Город’ — указываем город;
• ‘Почтовый индекс’ — индекс для вашего адреса;
• ‘В какой валюте вы принимаете платежи?’ — выбираем валюту, которая будет применяться для каждого товара;
• ‘Какого типа товары вы планируете продавать?’ — указывается тип товара, и в зависимости от того, какой тип вы продаете, будут появляться опции для наполнения.

Оплата:

• Это настройки для оплаты и здесь нужно указать приемлемый вид оплаты для вас. PayPal не так распространен в странах СНГ, поэтому лучше его отключить;
• Выбираем из перечисленных, интересующий способ оплаты. Я выберу оплату при доставке.

Доставка:

• Выбираем способ доставки для России. Для единой доставки нужно указать цену доставки и можно зафиксировать эту цену для товаров;
• Выбираем способ доставки для остальных стран. Тут также как и в предыдущем пункте;
• Параметры веса и размеров товара. Эти параметры будут распространяться на весь сайт.

Рекомендуемые плагины для WooCommerce:

• Здесь я сниму все галочки (при желании эти и остальные плагины можно будет установить позже).

Активация плагина Jetpack:

• Тут также пропускаем.

Теперь Woocommerce настроен и можно приступать к наполнению сайта. Нажимаем ‘Перейти в консоль’.

Установка плагина WP ALL Import и настройка импорта товаров.

Теперь нам нужно установить ещё один плагин “WP ALL Import”. Он нам нужен для наполнения сайта с помощью выгрузки из 1С.

И ещё скачаем “WP ALL Import Woocommerce Add-on”.

Скачиваем и активируем два плагина. После этого плагин “WP ALL Import” появится в левом меню с названием “All import”. Кликаем по нему и выбираем “New import”.

Теперь нужно загрузить файл в формате utf-8 по нажатию на кнопку “Upload a file”.

Пример выгрузки 1С

Внимание! UTF-8 — это обязательный формат для “WP ALL import”.

И выбираем Woocommerce Products.

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

• Если же у вас все ‘поехало’, то скорее всего у вас выбран другой разделитель полей. В стандартной выгрузке разделитель “;”.
• Если же вы видите иероглифы, то формат вашего файла не utf-8. В моей выгрузке формат файла уже изменен.

Далее, если ваша выгрузка выглядит как у меня, то нажимаем “Continue to Step 3”.

Далее нам нужно заполнить поля для товаров. Для этого перетаскиваем нужное поле из правого окна, в интересующее поле слева. Здесь можно помещать несколько полей из правого окна, в одно поле слева. Также можно вставлять свой разделитель(как у меня в title description).

В окошке “Woocommerce Add-on”, поле “SKU” обязательно для заполнения, это артикул каждого товара. Также обязательно поле это цена “Regular price”.

В “Images” мы помещаем поле, которое идентично названию файла-картинки, которые мы помещаем в “путь_к_OpenServer\domains\ourshop.loc\wp-content\uploads\wpallimport\files\”.

В “Taxonomies”, “Categories”, “Tags” мы можем разместить категории товаров, которые будут автоматически создаваться на сайте.

Сохраняем настройки нажатием на “Continue to Step 4”. В поле “Unique Identifier” нажимаем “Аuto-detect.

Потом нажимаем кнопку “Continue” и “Run import”. После этого плагин перемещает все данные из выгрузки и мы получаем окно об успешной импорте файла.

Переходим на http://ourshop.loc/shop и видим загруженные товары.

Вот и всё! Теперь мы имеем интернет-магазин на локальном ПК. Для размещения сайта онлайн можно использовать статью «Как разместить сайт в интернете?». Удачи!

С Уважением, Семенов Павел