Більше результатів...

Загальні селектори
Тільки точні збіги
Шукати у заголовках
Шукати у контенті
Вибір типів постів
Фільтрувати за категоріями
FAQ
Hostenko
Натхнення
Відео уроки
Новини
Плагіни
теми
Уроки
Хакі

Автор: Анастасія, wphelp.ru

Часто у власника блогу на WordPress з'являється бажання продавати якийсь свій продукт. Зазвичай таких продуктів небагато, і замовлення обробляються вручну. Для цього не треба організовувати складний магазин за допомогою спеціалізованих скриптів, відокремлювати його від блогу. Достатньо лише зробити нескладну інтеграцію магазину у блог WordPress за допомогою плагіну.

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!

Найлегшим плагіном для створення інтернет-магазину на WordPress можна вважати Швидкий магазин. Він не перевантажуватиме сайт і налаштувати його можна протягом 10 хвилин.

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

Тепер розглянемо всі етапи його налаштування.

1. Встановлюємо та активуємо плагін Quick Shop

Завантажити плагін Quick Shop можна на офіційному сайті WordPress. Якщо ви не знаєте, як встановити плагіни для WordPress, ви можете ознайомитися з докладним уроком тут.

2. Встановлюємо та активуємо плагін cformsII

Даного плагіна немає в сховищі WordPress, тому завантажуємо його з сайту автора.

3. Створюємо сторінку оформлення замовлення

Переходимо до розділу «Сторінки», натискаємо «Додати нову»(див. рисунок 1).

Дана сторінка буде порожньою, нам необхідно лише вказати заголовок сторінки (будь-який, наприклад «Оформлення замовлення») і натиснути «Опублікувати».

Важливо! Ми НЕ вставляємо на цій сторінці форму замовлень cforms. Інакше ми отримаємо дубль із двох форм, оскільки ця форма прикріплюється автоматично.

Аналогічно створюємо сторінку, куди буде переадресовано користувач після оформлення замовлення. Наприклад, назвемо її «Ваше замовлення прийнято». Тут ви можете подякувати клієнту за замовлення та надати йому певні інструкції.

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Малюнок 1. Додавання сторінки оформлення замовлення

4. Налаштовуємо плагін Quick Shop

Переходимо на сторінку налаштувань Швидкий магазин (Див. малюнок 2).

З обов'язкових пунктів Вам потрібно вказати валюту та символ валюти, вибрати сторінку оформлення замовлення, яку ми створили у попередньому кроці, а також включити опцію "Запит рахунку по E-mail". При цьому Вам надсилатиметься сповіщення про оформлення замовлення, після чого Ви зможете зв'язатися з клієнтом та уточнити деталі доставки та оплати.

Важливо! Щоб перед символом валюти збереглася пробіл, ми вказуємо його у вигляді html-символу  

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Рисунок 2. Сторінка налаштування плагіна Quick Shop

5. Налаштовуємо плагін cformsII

Переходимо до розділу налаштувань cformsII (Див. малюнок 3).

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Рисунок 3. Налаштування плагіна cformsII

У вас вже буде створено 1-у форму за замовчуванням. Ви можете залишити її як є.

Замість неї використовуватиметься форма самого Швидкий магазин.

Важливо! Щоб відбулося прикріплення форми Quick Shop, використовується саме перша форма, створена в cformsII (id форми = 1), тому ми її не використовуємо для інших цілей. Якщо Вам необхідно створити, наприклад, форму контактів за допомогою цього плагіна, Ви створюєте нову форму (див. малюнок 4).

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Рисунок 4. Додавання нової форми cformsII

На сторінці налаштування форми ви можете вказати у секції "Messages, Text and Button Label" російськомовні повідомлення, які ви хочете показувати клієнтам під час оформлення замовлення (див. рис. 5).

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Малюнок 5. Налаштування повідомлень для оформлення замовлення

нам важливішесекція Core Form Admin/Email Options. Тут ми налаштовуємо переадресацію на сторінку «Ваше замовлення прийнято» після оформлення замовлення (створену на 3-му кроці).

Обов'язково ставимо галочку «приховуватиФормапісляуспішнийуявлення» и «включитиальтернативауспіхсторінка» (під цим пунктом вказуємо посилання для переадресації) (див. рисунок 6).

Інші налаштування можна залишити «як є».

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Рисунок 6. Налаштування переадресації на сторінку оповіщення про успішне оформлення замовлення

6. Додаємо список товарів

Натискаємо в адмінці на вкладку Швидкий магазин і потрапляємо на сторінку, де нам заздалегідь необхідно вказати список товарів та їх цін (див. рис. 7).

Список задається у форматі «Заголовок | Ціна», кожен товар з нового рядка. Зберігаємо зміни.

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Малюнок 7. Додаємо список товарів Quick Shop

7. Прикріплюємо товар до запису у блозі

Переходимо до розділу «Записи». Створюємо новий запис. Додаємо опис продукту. Далі натискаємо на іконку у вигляді кошика на панелі інструментів візуального редактора і вибираємо зі списку відповідний товар (див. малюнок 8). Натискаємо кнопку «Insert». Зберігаємо запис.

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Рисунок 8. Прикріплення товару до запису

Зрештою, на сторінці запису у нас з'являється форма для додавання товару до кошика (Див. малюнок 9). У наведеному прикладі на рівні плагіна видалено поле для введення кількості товару, за умовчанням у плагіні воно є.

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Малюнок 9. Товар на сайті

8. Додаємо віджет кошика

Тепер нам залишилося лише відобразити кошик із товарами користувача на сайті.

Для цього переходимо до розділу «Зовнішній вигляд» → «Віджети» в адмінці та перетягуємо віджет Quick Shop Cart у необхідну область віджетів (див. рисунок 10).

Важливо! За замовчуванням у плагіні передбачено горизонтальну орієнтацію для кошика, тому краще вибирати широке бічне меню для її розміщення.

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Малюнок 10. Додаємо віджет кошика

Отримуємо кошик на сайті (див. рисунок 11).

Щоб змінити вигляд кошика, ви можете відредагувати файл віджет.php у папці плагіна Швидкий магазин, або скористатися редактором WordPress («Плагіни» → «Редактор» → Вибираємо зі списку в правому верхньому кутку Quick Shop → Далі в бічному меню зліва вибираємо файл quick-shop/widget.php). Якщо у Вас немає початкових знань php/html робити це не рекомендується.

Покрокова інструкція щодо створення інтернет-магазину за допомогою плагіна Quick Shop

Малюнок 11. Кошик Quick Shop на сайті

На цьому наш урок закінчено!

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!
Олексій Шевченко
редактор wpcafe
Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/

Коментарі до запису: 74

Скарбничка Фрілансера:

Прикольно! :) Треба спробувати :)

Xerox:

У чому проблема?: Не відображає коректно кирилицю.

Нурік:

Встановив як все тут написано, при додаванні записів не змінюється кнопка візуально на HTML і навпаки? не підкажіть у чому проблема і як її вирішити? наперед дякую

Flamingoevent:

Встановила плагін, стала додавати Запис+картинку товару, з'явився невеликий білий прямокутник на всіх сторінках сайту.

Тетяна:

швидше за все Ваша тема не підтримує цей плагін.

Xaaaaa:

вийшло все чудово

Lenara96:

Хочу уточнити: у якій валюті можна вказувати ціни? Чи можна в українських гривнях?

Марина:

Все роблю, як на уроці, а в мене нічого не показує, в сенсі ціни, кошика і т.д. Що я втрачаю, може є якась хитрість?

Гість:

Все працює, тільки при замовленні адміну не надсилається лист про замовлення, як виправити?

Ігор:

Все зробив, як ви написали, тільки не красиво вийшло. Прописав товар, лише одне найменування товару на сайті видно. Чи для кожного товару потрібно робити окремий запис?

Ігор:

Так, я хотів ще спитати. Як картинку на кожний товар розмістити?

Олег Капустін:

Підкажіть пліз як змінити цю форму замовлення? якщо змінюю форму з айді 1 в самому cformsII — форма замовлення не змінюється, сенс у тому, що мені треба що б у формі було лише чотири поля — а решту прибрати — як це зробити?

Карина Кожевнікова:

Доброго дня!
виникла проблема, коли додаємо товар, а потім публікуємо у блозі, то підтягуються крякозябри, немає кирилиці, все робила крок за кроком за Вами, у чому проблема може бути?

WordPresso:

Спробуйте змінити кодування на UTF-8 у браузері.

Михалєв Євген:

Змінив кодування. Все по-старому. І товару на сторінці зовсім нема. Що робити?

Михалєв Євген:

Ось така річ відбувається! Як виправити?

Тимур:

Доброго дня! Скажіть, будь ласка, а чи не можна зробити меню замовлення з вертикального розташування в горизонтальне? А то дуже багато місця з'їдає… товарів багато:)
І як забрати рядок доставки?

Олексій:

ПРИЄДНАЮСЯ — ВЖЕ ДРУГИЙ ДЕНЬ КОДИ ЛАПАЧУ!!!!

Андрій:

Добридень! Все робив як на відео дійшов до моменту «7. Прикріплюємо товар до запису в блозі», але у мене не з'явився кошик. Допоможіть будь ласка, що треба зробити?

Ігор:

У віджетах потрібно встановити QUICK SHOP CART

Анна:

Добридень! Підкажіть, а можна налаштувати замість кнопки "додати в кошик" - зв'язатися з автором, який додав товар. Хочу встановити плагін як каталог товарів, а про покупку домовлятися вже безпосередньо у повідомленні.

WordPresso:

Будь ласка, зверніться до офіційної підтримки даного плагіна. Ми не консультуємо щодо детальних кастомних налаштувань роботи плагіна, а робимо огляд його основних можливостей.

Вадим:

Доброго дня!
Гарний плагін. Почав його використовувати і виникли три питання.
Перший: як змінити форму, яку заповнюють клієнти при оформленні покупки — не всі поля потрібні.
Другий: як відкоригувати лист, який надходить клієнту — написати тему листа російською
Третій: що робити, якщо потрібно ув'язати дві опції одночасно. Наприклад, вибираємо для футболки та колір (червоний, синій або білий) та розмір. Тут працює лише одна опція.
Дякуємо!

WordPresso:

Будь ласка, зверніться до офіційної підтримки даного плагіна. Ми не консультуємо щодо детальних кастомних налаштувань роботи плагіна, а робимо огляд його основних можливостей.

інформація:

Російські теми для вашого магазину на WordPress

Іван:

Добрий час доби… Прошу Вашої допомоги оскільки сам не можу розібратися з цією проблемою… Зараз роблю сайт у себе на комп'ютері, тобто ще не викидав в інтернет. Потрібно зробити магазин, який потрапив на ваш відео-урок. При додаванні товару пише таке: [quickshop product=»РџРѕРґСЃРЅРµР¶РЅРёРе 18 СРј»] і до якого кошика товар не прикріплюється. Якщо прописую товар англійськими - кирилицею ... тобто Fytbolka то норм все ... хоча я скачав всі плагіни з вашого сайту має начебто все працювати а не хоче підкажіть у чому може бути проблема.

WordPresso:

Як варіант, спробуйте розмістити сайт на реальному хостингу, наприклад https://hostenko.com/ 14 днів тріал. p align="justify"> Плагіни для електронної комерції часто конфліктують, коли сайт розгортається локально на комп'ютері.

Димка:

Дякую! Справді дуже просто. Пробував інші все не те, а цей найпростіший і найкращий.

Є маленьке запитання:

Як мені записи з товарами не виводити у загальній стрічці блогу?

Наприклад, я зроблю рубрику — товар. І віджет з посиланням на цю рубрику, якщо людина зацікавиться клікне і отримає список записів (товарів) з рубрики товар

А ось як приховати ці записи зі стрічки

WordPresso:

Стандартними засобами WordPress це не передбачено, але можна зробити маленьку хитрість і додати кілька рядків коду до functions.php для цього. Тут описано на прикладі:

Дмитро:

нагуглив як зробити:

function exclude_category($query) {
if ( $query->is_feed or $query->is_home ) {
$query->set('category__not_in', array(1, 2, 3));
}
return $ query;
}
add_filter('pre_get_posts', 'exclude_category');

але в код не хотілося б лізти, якщо є рішення через плагін, буду радий підказці

Alex Plakhotnij:

Добрий день. Допоможіть. Робив все по відео, але чомусь після натискання "Оформити замовлення", движок пише: "Parse error: syntax error, unexpected line 496194437».
У чому моя помилка?

WordPresso:

Подивіться що у вас у файлі checkout.php у першому рядку в коді, може дізнаєтеся в чому проблема.

Анастасія:

Дякую Вам величезний за такий докладний опис легкого способу створення інтернет магазину! У мене є один проект, але на нього я б не витрачала багато грошей на покупку платформи ІМ, а так я зможу втілити мрію в реальність прямо зараз!
Але хотіла Вам поставити одне питання, як у плані оптимізації та просування товару позначається цей плагін у пошуковій видачі? Або ж потрібно оптимізувати записи як звичайні записи Word Press під К.З. за допомогою All in one наприклад?

WordPresso:

Цей плагін не впливає на SEO. Іншими словами, для інтернет-магазину WordPress з цим плагіном застосовуються ті ж інструменти SEO для підвищення релевантності пошукової видачі що і для звичайного WordPress сайту.

Pancher100:

Все начебто працює, замовлення оформляється, але не приходить на вказаний в cforms е-мейл. Може, я не там його ввів? Скажіть, де саме в налаштуваннях потрібно вводити е-мейл, на який приходитимуть замовлення?

WordPresso:

Будь ласка, зверніться до офіційної підтримки даного плагіна. Ми не консультуємо щодо детальних кастомних налаштувань роботи плагіна, а робимо огляд його основних можливостей.

Сергій:

виставляєш все один в один як в уроці, перейменуєш в адмінці форму відправлення замовлення всі російські слова замість англійських. В результаті все одно форма замовлення виходить англійською!
дурниця повна…

сергей:

на 5-му малюнку налаштовується форма повідомлень для надсилання замовлення. Ось тільки ні слова, як зберегти ці налаштування. Де кнопка для їх збереження? у плагіні немає її ...

Андрій:

На e-mail надходить порожнє повідомлення допоможіть вирішити проблему, будь ласка

Андрій:

При замовленні на e-mail надходить порожній лист, у чому проблема?

WordPresso:

Будь ласка, зверніться до офіційної підтримки даного плагіна. Ми не консультуємо щодо детальних кастомних налаштувань роботи плагіна, а робимо огляд його основних можливостей.

den4ik_86:

Як редагувати статус кошика? це не плагін а убожество, плагін не вміє цього робити)))

андрей:

Підкажіть, будь ласка, чи можна вказати 2 властивості? (щось типу Заголовок | Ціна| property1: value 1,2,3 | property2: value11,12,13)

WordPresso:

Будь ласка, зверніться до офіційної підтримки даного плагіна. Ми не консультуємо щодо детальних кастомних налаштувань роботи плагіна, а робимо огляд його основних можливостей.

Єгор Смирнов:

Підкажіть будь ласка як зберегти введені дані у плагіні
cformsII

WordPresso:

Вибачте, ми не консультуємо щодо кастомного налаштування плагінів.

Петро:

допоможіть вирішити проблему. У CForms я випадково вилучив початкову форму. Тепер маю лише одну форму — ту, яку створив я сам. Виходить, що вона йде під номером 1. QuickShop звідкись бере якісь свої поля форми, а не ті, що є у створеній формі, а мені вони не підходять. Пробував видаляти QuickShop і CForm, а потім заново встановлювати заново їх, але нічого не допомогло - якимось чином вони зберігають свої налаштування і після переустановки все залишається по-старому. Що можна зробити?

Олександр:

Аналогічна ситуація. Налаштування зберігаються десь у логах. Може хтось підкаже як їх почистити?

Богдан:

Петре, підкажіть ви якось розібралися з цією проблемою?

Анатолій:

Встановив. На одному сайті все працює. На іншому тема iTheme2 немає, показує у сайтбарі «ваш кошик порожній» а в записах тільки заголовок і нижче заголовка тільки останні. Ні назви, ні ціни, ні ціни за доставку, тільки розмір.

Андрій:

Вітаю, Андрій!
Підкажіть, будь ласка, як перекласти англійські слова read more російською мовою. Мається на увазі у шаблоні Larisa Mag. Попередньо величезне спасибі.

Роман:

Дякую за урок!!!
Все було чітко без жодної зачіпки!
Успіху Вам та процвітання. ДЯКУЮ!!!

Женя:

Братку, висловлюю подяку за виконану роботу і донесення її до людей. Пасиба.

Оксана:

Доброго дня! Встановила плагін Quick Shop російською Версія 2.3 WordPress 3.5.1. Зроби налаштувати як на відео за керівництвом налаштування плагіна Quick Shop із сайту wordpress.org. Все працює окрім форми замовлення. З'являється кошик, замовити і все!! Коли встановлювала англ версію Quick Shop, форма замовлення працювала і замовлення приходило на пошту.

Допоможіть, будь ласка, з'ясувати причину!Заздалегідь дякую

WordPresso:

Важко зрозуміти чому так відбувається саме з російською версією. Спробуйте написати технічну підтримку з цього приводу! Як варіант, можна спробувати перекласти front-end частину англійської версії QuickShop самостійно.

Тетяна:

Ви забрали поле введення кількості товару. Підкажіть, будь ласка, як забрати поле доставки?

Nastya Chula:

Добридень! Як змінити форму замовлення, яка підтягується автоматично? Там купа обов'язкових полів, які неможливо змінити, ні видалити! Допоможіть, дуже треба.

WPcafe.org:

Будь ласка, зверніться до офіційної підтримки даного плагіна. Ми не консультуємо щодо детальних кастомних налаштувань роботи плагіна, а робимо огляд його основних можливостей.

фургон:

Це форма не cforms, у quick shop. Її треба редагувати у файлі checkout квікшопу. Сам півдня не міг зрозуміти у чому справа)))

Юрій Суржик:

Дякую і мені допомогло!!!!!!!! А чи можна до Вас звернутися ще з одного питання quick shoр?

Андрій:

Підкажіть, будь ласка! У мене Mac і я не можу знайти такий файл, як в інструкції (zip), який потім завантажується в wordpress? Як він у мене повинен виглядати?

Андрій:

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

WPcafe.org:

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

Манич:

Та й гамнищі навіть за даром нах не потрібні.

Павло:

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

Тагір:

Доброго дня ! дуже задоволений вашим уроком, але в мене такий кряк. Чомусь на сторінці з'явилося два кошики і працюю вони одночасно.

хуй:

Це все тому, що ти хочеш.

Юлія:

добрий день, підкажіть будь ласка що не так. Намагаюся в записі додати товар, натискаю на кошик відкривається віконце Quick Shop з товаром, вибираю та натискаю Insert а товар не додається. Що робити?

Михайло:

Аналогічна проблема. Підкажіть, будь ласка, хто знає.

Андрій:

Допоможіть пліс….

Андрій:

Може кому треба))). Зрозумів візуальний редактор Офф, на сторінці продукту ставимо [quickshop product="Ремонт_кавоварок"] а в налаштуваннях Продукти Quick Shop типу так Ремонт_кавоварок | 25.00
Cap2 | 25.00
Cap3 | 25.00
Cap5 | 25.00
Bag | 120.00 | | Color : Red, Blue, Purple
T-shirt | 10.00 | 5.00 | Розмір: S, M, L, XL, XXL

kramnyca:

Жаль людей які не розуміються на кодах. намагаються щось зробити або повністю покладаються на двигуни типу ворд прес або джумла ... Вчіть коди товариші і буде вам щастя. Завжди запитують скільки треба часу вивчати коди? Все життя товариші, скільки займатиметеся цією справою, стільки й навчайте. Все змінюється… і коди також. Я не морочуся на движках, а просто роблю сайт на html і css. Цього достатньо, щоб зробити нормальний сайт - http://kramnyca.com/

Swarmi:

Ну, якщо це по-твоєму нормальний сайт… Мені тебе шкода

Анна:

Т.к. у російськомовній версії виникають проблеми, я розпочала ручну «русифікацію» англ. версії. В адмінці досі відображається все на англ. мові (що мені особисто не заважає), а ось на сайті вдалося успішно відобразити параметри товару російською. Потім напишу в дод. коментарі - як і що правила, щоб налаштувати відображення і кошик.

Дякую wpcafe! Без ваших уроків, як без рук!

Додати коментар або відгук