Я очень долго искал различные плагины для создания простого интернет-магазина на базе wordpress, даже не интернет-магазина, а простейшего каталога товаров для wordpress, где можно указать название, описание, добавить фото и цену.
Корзина мне не нужна, товар можно заказать просто запросом на e-mail, нажав импровизированную кнопку “купить”.
Саму идею я подсмотрел на сайте моего хорошего знакомого и поставщика Японских ништяков j-point.od.ua, но т.к. познаний в работе с wordpress у меня не много, я начал по чуть-чуть изучать и выявил схожесть простых записей и записей товаров.
Просто узнать какие шаблоны и плагины для wordpress установлены при помощи сервиса не удалось. Точнее не было установлено плагина интернет-магазина.
Далее изучение структуры и разговор с владельцем сайта окончательно подтвердил, что просто созданы новые типы данных.
Т.е. свои категории или рубрики для записей типа товар.
Начинаем изучать и лопатить кучу информации по созданию своих типов данных.
В случае “джи-поинт”, все было прописано руками в коде, но я хотел реализовать при помощи плагина, я очень ленивый.
Испробовал несколько плагинов мне приглянулся плагин Types для вордпресс:
Так же я наткнулся на русское описание настройки своих типов данных тут, в принципе все понятно, но по ссылке старый интерфейс и не все понятно, потому я чуть-чуть изменил описание и добавил свежих картинок, особенно там где их не оказалось.
В WordPress изначально существует два основных типа это записи и страницы:
Качаем и инсталлируем плагин, все как обычно, через плагины – добавить новый, указываем архив, активируем плагин Types после установки:
Для начала заходим в пункт Types -> Типы и таксономии и в нем нажимаем на кнопку Добавить индивидуальный тип публикации далее заполняем форму. Попробуем в WordPress сделать небольшую интернет витрину для публикации товаров на сайт.
Чуть ниже настраиваем:
- Параметры метабокса Просматриваемость оставляем как есть.
- Параметры метабокса Выбрать систематики. Я остановился на стандартных рубриках, но можно создать и свои индивидуальные для этих типов данных.
- В метабоксе Метки можно изменить написание стандартных команд на свой язык.
- Вывести Разделы на дисплей:
- Заголовок – всегда оставляем включенным, даже если у вас нет необходимости его выводить, это поле пригодится для нахождения нужного материала в панели администратора.
- Редактор – визуальный редактор, стандартное поле для типов данных в WordPress. В нашем случаи это поле не понадобится, отключаем его.
- Комментарии – для Интернет витрины, они будут полезны, особенно если описания к товарам будет мало. Комментарии помогают сделать страницы более уникальными.
- Редакции – редакции это копии документа, которые сохраняются автоматически или в момент публикации и обновления материала на сайте. Думаю, что материал у нас в витрине будет обновляться не часто, поэтому редакции мы можем оставить отключенными.
- Остальные пункты кроме Миниатюры находящиеся ниже нам не нужны. Ставим галочку напротив пункта Миниатюра.
- Индивидуальные поля – дополнительные поля для вывода дополнительной информации, о них поговорим позднее.
- Расширенный – расширенные настройки тоже можно оставить как есть.
После всех настроек нажимаем на кнопку Сохранить индивидуальный тип публикации в нижней части экрана.
После сохранения в меню администратора появится новый тип данных Товары:
Если мы сейчас зайдем в меню Товары -> Добавить новый, то увидим что у нас отображается только название товара. Я использовал стандартные рубрики, но можно сделать и свои, для этого:
- Снова заходим в меню Types -> Типы и таксономии.
- Добавить индивидуальную систематику.
- Заполняем поля формы и выбираем тип публикации Товар.
- Переименовываем метки.
- Расширенные настройки оставляем как есть.
- Сохраняем систематику.
После проделанных действий зайдя в Меню администратора -> Товары справа у нас появятся еще один метабокс Групы товаров, где можно задавать категории в виде ключевых фраз.
Этот метабокс похож на Метки. Все это добро тоже настраивается очень гибко.
Следующим шагом будет добавление нескольких дополнительных полей для типа. Давайте перечислим, какие это поля:
- Название товара
- Цена
- Описание товара
Заходим в пункт Types -> Индивидуальные поля. В появившемся окне вводим Заголовок группы полей и Описание группы.
Ниже в метабоксе необходимо указать Где выводить эту группу на дисплей. Под пунктом Типы публикаций нажимаем кнопку Редактировать и отмечаем тип Товары.
Здесь моно отмечать и несколько типов, если в выбранных типах будут нужны похожие поля.
Термины и Шаблоны не выбираем.
Справа есть группа под названием Имеющиеся в распоряжении поля необходимо выбрать для названия и цены товара Однострочные поля, а для Описания товара выбрать WYSIWYG.
Слева у вас появятся поля с настройками:
- Ввести название поля – вводим название поля, например Название товара.
- Ввести поле динамических данных в поле – тут необходимо ввести уникальное имя поля на английском, назовем product-name.
- Описать это поле – можно оставить пустым, так как из названия поля все и так ясно.
- Простое или повторяющееся поле? –в нашем случаи, все поля могут иметь только одно значение. Этот параметр очень удобный, если вам необходимо загрузить несколько картинок и потом выводить их на странице.
- Обязательно – ставим галочку напротив полей, которые считаем обязательными.
После настройки всех трех полей можно нажать на стрелку рядом с названием и свернуть параметры поля.
Есть еще два параметра для удаления поля крестик и для сортировки полей стрелка. Выставьте поля в нужном порядке и нажимаем Сохранить. После сохранения переходим в созданный тип публикации Товары -> Добавить новый. Если все было сделано правильно у вас появятся новые индивидуальные поля.
Заходим в меню Товары – > Группы товаров -> Создадим группы для товара.
Далее необходимо наши товары вывести на экран и для этого нам понадобится войти в меню Внешний вид – > Меню и добавить новое меню под названием Витрина.
После всех действий на сайте, появится наше меню.
Далее автор предлагал вставлять файл и править его под свои данные которые мы создали, но у меня так не получилось, я поступил иначе.
При добавлении товара есть кнопочка Types, жмем ее и вставляем в нужную часть описания товара.
Так же я использовал свой шаблон для вывода записей из конкретной рубрики.
Воспользовался выводом переменных из исходного кода автора статьи:
<?php
/**
* The main template file.
*
* This is the most generic template file in a WordPress theme
* and one of the two required files for a theme (the other being style.css).
* It is used to display a page when nothing more specific matches a query.
* For example, it puts together the home page when no home.php file exists.
*
* Learn more: http://codex.wordpress.org/Template_Hierarchy
*
* @package WordPress
* @subpackage Twenty_Twelve
* @since Twenty Twelve 1.0
*/get_header(); ?>
<h1 class=”archive-title”><?php printf( __( ‘Tag Archives: %s’, ‘twentytwelve’ ), ‘<span>’ . single_tag_title( ”, false ) . ‘</span>’ ); ?></h1><div id=”primary” class=”site-content”>
<div id=”content” role=”main”>
<?php $loop = new WP_Query(
array( ‘post_type’ => ‘product’,
‘posts_per_page’ => 0,
‘productgroup’ => $wp_query->query_vars[‘productgroup’]
// ‘tag’ => $wp_query->query_vars[‘tag’]
)
);
//echo $wp_query->query_vars[‘productgroup’];
?><!–pre><?php print_r( $wp_query->query_vars) ?></pre–><?php
?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div class=”entry-content”>
<?php the_content(); ?>
<?php
if(get_post_meta($post->ID, “wpcf-product-name”, $single = true) != “”) :
$wpcfProductName = get_post_meta($post->ID, “wpcf-product-name”, $single = true);
echo ‘<h2 class=”entry-title”><a href=”‘ . get_permalink() . ‘” title=”‘ . the_title_attribute( ‘echo=0’ ) . ‘” rel=”bookmark”>’.$wpcfProductName.'</a></h2>’;
endif;
the_post_thumbnail(‘thumbnail’);
f(get_post_meta($post->ID, “wpcf-product-description”, $single = true) != “”) :
echo get_post_meta($post->ID, “wpcf-product-description”, $single = true);
endif;
if(get_post_meta($post->ID, “wpcf-product-price”, $single = true) != “”) :
$wpcfProductPrice = get_post_meta($post->ID, “wpcf-product-price”, $single = true);
echo ‘<div><b>’.$wpcfProductPrice.'</b> РіСЂРЅ.</div>’;
endif;
?>
</div>
<?php endwhile; ?></div><!– #content –>
</div><!– #primary –><?php get_sidebar(); ?>
<?php get_footer(); ?>
Вставил и отформатировал в свой файл шаблона строки отвечающие за вывод моих данных.
Рассмотрим все функции которые использовались в шаблоне:
single_tag_title() – Выводит заголовок текущей метки, если просматривается архивная страница метки.
WP_Query() – задавая различные параметры, можно делать выборку и сортировку записей. Похоже на запрос к базе данных. Подробнее можно почитать на сайте разработчиков wordpress в кодексе, правда только на английском WP_Query(). Советую посмотреть на функцию, очень полезная.
$wp_query->query_vars – возвращает массив переменных запроса. Для понимания как работает данная конструкция, раскомментируйте ее в файле шаблона и посмотрите результат.
?><!—pre><?php print_r( $wp_query->query_vars) ?></pre—><?php
the_post() – счетчик для цикла.
the_content() – содержимое поста или записи, так как мы редактор не включали, то эта функция ничего не делает.
get_post_meta($post_id, $key, $single) – возвращает данные из произвольного поля. Каждое поле, которое мы создавали для типа имеет свое произвольное поле, которое можно вывести через эту функцию.
$post_id (число) (обязательный) – ID поста, произвольные поля которого нужно получить.
$key (строка) (обязательный) – название произвольного поля, значение которого нужно получить.
$single (логический) – если выставить параметр в true, то функция вернет единственное значение в виде строки. Если параметр будет равен false или не будет установлен, то функция вернет массив значений произвольных полей.
Однако, если в значении произвольного поля находится серриализованный массив, то занчение true вернет, нормальный массив, а если указать false, то вернется массив в элементе (например [0]) которого будет все тот же сериализованный массив. Т.е. в этом случае параметр работает “наоборот”.
По умолчанию: false
get_permalink() – ссылка на пост.
the_title_attribute( ‘echo=0′ ) – атрибуты ссылки.
the_post_thumbnail(‘thumbnail’) – миниатюра с размером thumbnail.
Поговорим подробнее о том откуда я брал метки для функции get_post_meta(). Возьмем к примеру:
get_post_meta($post->ID, “wpcf-product-name”, $single = true);
Посмотрев на картинку, все станет ясно, у вас могут быть другие названия, поэтому необходимо внимательно сравнить произвольные поля с метабокса с тем, что находится в файле шаблона. Если вы все поправите, то у вас должен поменяться вывод материалов типа товар.
Если у вас также вывелся товар, значит вы все сделали правильно и останется только стилизовать вывод при помощи стилей. Если вам не хочется делать шаблон в ручную, то можно автоматизировать вывод контента без вмешательства в код. Вывод можно сделать при помощи плагина views , плагин хоть и платный но для тех кто постоянно занимается разработкой на WordPress этот плагин может ускорить работу в 3-4 раза.
Ну вот как-то так, данное руководство является беглым и не будет более дополнятся.
Отправить ответ