Интернет магазин на wordpress на базе wp shop
Отборные материалы о дизайне, seo, wordpress

Интернет магазин на wordpress на базе wp shop

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

Почему на базе wp shop — это пока единственный плагин в рунете который развивается. Второе — мне понравилась его логика работы организованная через стандартные записи и дополнительные поля. Третье — с версии 3 авторы реализовали возможность подключения к robokassa, webmoney.

UPD. Читайте о новых, более стабильных плагинах интернет-магазина на wordpress

Изначально я планировал создать огромное руководство о том как с нуля сделать на базе wp shop красивый, яркий инет магазин. Даже для этого отрисовал универсальный современный темплейт — но потом подумал, что сделаю ошибку. Ведь если создавать все с нуля, то большинству людей это сложно будет сделать, потому что нужно как минимум знать хорошо html+css, и разбираться хорошо в wordpress, чтобы это реализовать. Кто это все умеет, то он и сам сможет сделать, а кто не умеет, то вряд ли руководство будет полезным. Поэтому, я лучше напишу как сделать инет магазин уже на основе готового сайта с любой темой, что может сделать любой новичок.

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

Допустим у вас уже есть рабочий сайт и в нем уже есть статьи, рубрики, много материала и вы хотите сделать отдельный раздел с магазином. Реализуем мы это при помощи кастомных типов записей(post type). Есть еще одно преимущество установки магазина в отдельный раздел — это то, что вы сможете отдельно оформлять записи с товарными позициями от остальных записей на сайте. Для этого просто создайте в папке шаблона файлик single-yourpost.php, где yourpost — название созданного типа записей о котором ниже. Если ничего не создавать, то оформление самой товарной позиции будет в стандартном файле single.php

Чтобы не ковыряться в файлах движка для создания нового типа записей, можно воспользоваться готовыми плагинами. Мне нравится плагин , его я и опишу.

Активируем плагин и добавляем новый тип записей «Товары».

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

Advanced Label Options — здесь вы можете настроить руссификацию различных названий, вроде «добавить» и т.д. Advanced Options — здесь вы увидите функциональные опции, обязательно поставьте true напротив Has Archive — так будет доступен архив этого типа данных. Т.е. если вы перейдете по ссылке ваш_сайт/product — в нашем случае, то увидите список ваших товаров в виде ленты. В поле supports будут доступны разные системные поля которые будут выводится при добавлении записи, отключите здесь все ненужное вам. Сделать это также вы можете и уже в самой админке на странице добавления. Для этого нажмите на кнопку настройки экрана в правом углу.

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

Также нужно создать таксономию для нашего раздела — это правая колонка. А что такое таксономия и с чем её едят? Вот смотрите, есть записи, каждая запись принадлежит к определенной рубрике и может иметь метки. Вот рубрики и метки — это таксономия. Она может быть иерархичной как рубрики, т.е. можно создавать подрубрики. Или без иерархии как метки.

Заметьте, я отметил галочкой attach to post type свой созданный ранее кастомный тип записей, тем самым привязав таксономию к нему.

Теперь когда тип записей — товары и таксономия созданы, то нужно добавить пару категорий в нашу таксономию. Если вы создавали такие же имена как на скринах, то в админке вы увидите, что появилась новая вкладка «Товары» и имеет подвкладку Категории товаров — переходим на неё и создаем пару категорий, которые будут самыми частыми у вас. В название пишем название, в ярлык пишем урл на латинице. Я добавил для примера 2 категории — компьютеры и телефоны.

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

После установки плагина, когда перейдете на вкладку magic fields, то увидите список всех ваших типов записей и найдете там ранее созданный «Товары» — наведите мышкой и нажмите edit. Далее на странице нажимайте create a group и создавайте группу, после этого создаете поля в этой группе. Только не промахнитесь, чтобы создать поля именно в нужной группе, нужно нажимать на ссылочку рядом с группой.

Еще очень важный пункт, во всех плагинах, при создании любого нового типа будь чего, обязательно нужно указывать Name и Label. В первом нужно указывать имя латиницей, оно нужно будет для использования в шаблоне, а label — это название которое будет выводится в админке, тут пишите что угодно.

Теперь отвлечемся немного от произвольных полей и расскажу о работе плагина wp shop.

Он устроен так, что любую запись будет считать как товарную позицию если в ней вы укажите дополнительное поле с определенным именем. Если у вас все организовано по типу — один товар — одна цена, т.е. у каждого товара не будет различных модицикаций, то вам хватит всего одного созданного поля cost_1, в котором вы будете писать цену. Если каждый товар будет иметь несколько разновидностей с разными ценами, то вам нужно создать несколько доп полей. Для начала подумайте сколько максимально у вас будет разновидностей с ценой и создайте нужное количество полей. Имена у них должны быть строго name_1, name_2, name_3 — здесь будете писать наименование, cost_1, cost_2, cost_3 — здесь цену. Т.е. для name_1 будет установлена цена cost_1 и т.д.

Вернемся к созданию полей.

Для цен и наименований нужно выбрать тип поля -textbox, так как здесь будем вводить всего пару слов или цифр. В настройках отображения справа — уберите галочку с Evaluate Max Length — тогда не будет вводиться ограничение на длину символов в этом поле. Для первой цены — отметьте галочку required, ведь у каждого товара должна быть хоть одна цена, чтобы все нормально работало. Для второй и дальше — можете не ставить, ведь не у каждого товара будут модификации, там где не будет, то просто не будете заполнять эти поля.

Цену нужно указывать только цифрами. Если нужны не целые числа, то разделяйте точкой (не запятой)

К стати, у этого плагина есть хорошее

После создания нужного кол-ва дополнительных полей, добавим тестовый товар, перейдем на страницу добавления и если внизу вы не увидите дополнительных полей, которые вы создавали, то нажмите на «настройки экрана» — как я говорил ранее, там найдете вашу созданную группу полей и отметьте её галочкой.

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

Если все будет правильно, то на странице товара вы увидите в углу

Добавьте еще несколько товаров, если их у вас очень много, то в плагине есть возможность загружать позиции через excel, .

Расскажу о еще одной полезной мелочи с доп. полями — например, добавим чекбокс о том есть ли товар на складе в данное время. Для этого создадим при помощи плагина поле c типом chekbox. Назовем его sclad. Теперь в файле отвечающим за вывод товара (по умолчанию это single.php), в нужном месте (обычно это после тега the_content()) внесем такой код

    На складе:
<? $value = get('sclad');?>
<? if($value):?>
да
<? else:?>
отсутствует
<? endif?>

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

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

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

<!--wp-shop text_fied['Комментарий к заказываемому товару']-->

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

Сделаем сначала страницу с корзиной, для этого в любой странице вставьте в виз редактор код [сart] — все, теперь на сайте, вместо этого тега появится корзина.

Чтобы добавить мини-корзину, например, в сайдбар через виджет, то выберите текстовый виджет, а в содержании вставьте тег [minicart]. Более подробно о вставке корзины

Вот и вся основная работа, я в 10 раз дольше писал, чем это все делать.

Теперь можно перейти к дополнительным настройкам, для начала, если вы хотите установить разные способы оплаты, то в настройках плагина поставьте галочку «Показывать способ оплаты:», все способы можно настроить в вкладке WP Shop Payments. Все сообщения, формы заказа можно настроить в cforms — плагин автоматически создает все нужные формы, но вы их можете изменить по желанию. Описание всех настроек вы найдете . Дополнительные возможности плагина можно глянуть

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

300:5;500:30

где, 300 — это сумма выше которой устанавливается 5 % скидка, 500 — сумма выше которой скидка будет 30 % и т.д. Теперь скидка будет подсчитываться на странице корзины.

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

// отображение статей на главной
add_filter( 'pre_get_posts', 'my_get_posts' );
function my_get_posts( $query ) {
     if ( ( is_home() && false == $query->query_vars['suppress_filters'] ) || is_feed() )
     $query->set( 'post_type', array( 'post', 'product' ) ); // ВАЖНО! product меняешь на свой тип
     return $query;
}

Или же просто укажите ссылку на архив вашего раздела с товарами, в моем примере это мой_сайт/product.

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

<ul>
<?php wp_list_categories('title_li&taxonomy=product'); ?>
</ul>

Удачи в освоении инет-магазинов.

Мониторинг сети. Практика продвижения сайтов на авторском блоге tytto.ru — понятно даже для новичка.


 

Похожие статьи:



52 комментариев к “Интернет магазин на wordpress на базе wp shop”


9643e5d7

  1. ЯН:

    Нуждаюсь в помощи программиста в работе с этим плагином.. отпишитесь кто сможет, пожалуйста!

  2. :

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

  3. :

    А как обстоит дело с расширенным поиском по товарам? Например, поиск по определенным параметрам, фильтр по цене, популярности, к примеру?

    • ETNO:

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

    • :

      Я реализовала фильтр по определенным параметрам через выпадающий список с помощью Dropdown Taxonomy Widget (он ищет по меткам или рубрикам, мне было необходимо по меткам)
      А поиск по диапазону цены с помощью доп. полей и скрипта на php. Существует доп. поле cost_1, скрипт забирает параметры из адресной строки и с помощью query_posts выводит нужные в поиске. Правда, не в виде витрины.
      Сейчас разбираюсь, как страницу категории сделать витриной.

      • ETNO:

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

  4. Максим:

    Где находится шаблон мини-корзины?
    хотелось бы его немного изменить

  5. Владимир:

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

  6. Владимир:

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

  7. Андрей:

    «wp shop — это пока единственный плагин в рунете который развивается»
    не единственный. Плагин личного кабинета Wp-Recall позволяет установить расширение до интернет-магазина. Легкое подключение Робокассы и Интеркассы, настройка вывода товара, личный счет пользователя, личный кабинет, продвинутая административная часть.
    Если интересно, вот ссылка

    • ETNO:

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

  8. :

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