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

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

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

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

Изначально я планировал создать огромное руководство о том как с нуля сделать на базе 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 — понятно даже для новичка.


 

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



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


9643e5d7

  1. :

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

    • ETNO:

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

  2. :

    Оказывается WordPress очень гибкая система. Я и не думал что на этом движке можно сделать магазин.

  3. тесто:

    зачетная статья

  4. шапошник:

    а сложные магазины на нем можно делать?

    • ETNO:

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

  5. Elena Rubric:

    Здравствуйте! Не могли бы вы подсказать, возможно ли организовать автоматическую отправку электронных товаров (е-book, например) после оплаты? Нигде не могу найти в описаниях этого плагина. Неужели только вручную?

    • ETNO:

      вопрос хороший и логичный. Конкретно как сделать я не смотрел, но думаю это возможно. Можно попробовать несколькими путями. Для начала, там вроде есть форма, в которой настраивается сообщение показываемое после оплаты — вот в неё и вставить ссылку. Второй способ — насколько знаю при любом методе оплаты, вы указываете страницу, на которую попадает пользователь, который совершил успешную проплату — вот на неё тоже можно вставить ссылку на скачку материала. Или же просто восспользоваться сервисом типа digiseller, я о нем уже писал как-то http://trend-bag.ru/monetizaciya-digiseller/, но с точки зрения партнера, а не продавца, но там все довольно просто сделано и как раз заточено под продажи цифровых товаров.

  6. Elena Rubric:

    Надо с чего-то начинать, пожалуй, попробую, спасибо большое за статью, перечитала много, но ваша — вдохновила!

  7. :

    Спасибо за очень полезный пост!
    Многое сделала как написано и бОльшая часть получилась. Но — увы!- пришлось всё вернуть к исходной точке, т.к. добавить вывод в основную ленту своих товаров оказалось для меня из области высшей математики. Внесла небольшой хак в functions.php темы как пишите, но из-за малого опыта получилось вот что:
    Теперь приходят мысли в голову, что заметки+сообщения+магазин — это в моём случае невозможно…
    Если подскажете, как быть, буду благодарна!

    • ETNO:

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

    • ETNO:

      и вы неверную ссылку дали, там что-то не то

  8. :

    А вы сами делали ИМ используя плагин? Там почему то много чего не работает… если у вас все работает отпишитесь мне на мыло, я вам вопросики позадаю… спс

    • ETNO:

      а что не работает? Все должно работать. Я делал, как на тестовом сервере, так и на хостинге помогал реализовывать

  9. Begemot:

    Добрый день. Как вы думаете, реально ли реализовать через этот магазин вот такую примерно конструкцию: Сайт, на сайте музыка, сортировка по исполнителям и альбомам, купить можно любую композицию из любого альбома. А дальше, видимо, так, как вы рекомендовали ранее «Для начала, там вроде есть форма, в которой настраивается сообщение показываемое после оплаты — вот в неё и вставить ссылку. Второй способ — насколько знаю при любом методе оплаты, вы указываете страницу, на которую попадает пользователь, который совершил успешную проплату — вот на неё тоже можно вставить ссылку на скачку материала.»?

  10. Begemot:

    я, видимо, криво вопрос построила:) С сортировкой всё понятно. Вопрос в том, как реализовать продажу рассортированных файлов — если подключить плагин и использовать его, то не слишком ли громоздкая конструкция получается?
    Спасибо за оперативность — здОрово, когда обращаешься за помощью к продвинутым специалистам и тебе отвечают:)

    • ETNO:

      понятно теперь, нужен магазин цифровых товаров с генерацией ссылки на скачку — в плагине wp-shop такого нет. Вроде есть в uvcart, но я его еще не тестировал. Если товар 1-2, то проще продавать его через digiseller

  11. Begemot:

    тогда пойду посмотрю в сторону ювикарт, поскольку товаров планируется овер 500… В любом случае, спасибо :)

  12. :

    Привет! Установила e-commerce!
    Выпала Fatal error оперативки не хватает! Что делать? на хостинге нет вообще тарифа где хватило бы оперативки… Хэлп) Я в этом деле совсем чайник)

    • ETNO:

      вы вроде сами ответили на ваш вопрос — не хватает оперативки, значит надо сменить хостера или перейти на более дорогой тариф

  13. :

    Подскажите, с помощью этого плагина можно сдлать просто каталог товаров, без цен, корзина так же не нужна
    это возможно?

  14. :

    Скажите, а можно ли создать ИМ, но не заполнять его товаром. Например, мне нужно просто указывать ссылки на существующие магазины, чтобы посетители сами находили нужный товар. (я живу в США) и просто прописать условия доставки.

  15. :

    Я имею ввиду оформить таким образом дизайн

  16. Александр:

    Спасибо за статью! Интересует такой момент. Как сделать ссылки вида товара

    Буду ооооочень благодарен.

  17. JAZzmiX:

    Здравствуйте спасибо за статью!
    Есть такой вопрос:
    как сделать например «витрину 2″ по умолчанию.
    Или где найти код витрины по умолчанию которая выводится в рубрики, т.к. я переделал дизайн «витрины 2″ нашел таблицу в ‘vitrina.php’ но не нашел где таблица по умолчанию.
    Подскажите пожалуйста.

    Еще, мне нужен разный дизайн витрины
    в Кратком описании поста
    сделать:
    картинка
    Текст
    Цена, «купить».
    , и в полном (single.php)

    В каком файле можно все это отредактировать?

    • ETNO:

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

  18. :

    Блин, чёткий у тебя блог, в закладочки) Много полезного можно узнать)

  19. mill:

    Подскажите пожалуйста что нужно сделать, чтоб магазин был доступен по адресу:
    адрес_сайта/shop
    Делал всё по инструкции, изменял product на shop. При попытке зайти по адрес_сайта/shop ошибка 404.