Лесно, стъпка по стъпка ръководство „как се прави онлайн магазин“ за по-малко от 20 минути. Обновено на 18 Януари, 2019
В този урок ще ви покажа как да си направим онлайн магазин, в който да можете да качвате и продавате продукти.
В края на този урок, вашият електронен магазин за онлайн търговия трябва да изглежда подобно на снимката намираща се в дясно:
П.С. Ако планирате да продавате услуги (не продукти), ви препоръчвам да започнете бизнес уебсайт (не онлайн магазин). Тук ще намерите ръководство за създаване на уебсайт.
2 towers trophy 2013 – absolute bodybuilding boldenone undecylenate (equipoise) bodybuilding calculator body fat, bodybuilding calculator rdi – dhyan yoga kendra.
Ако планирате да продавате повече от 10 различни продукта, трябва само да продължите да четете. Как да си направим онлайн магазин е ръководство – създадено за тези от вас, които искат да се сдобият с качествен магазин за електронна търговия, без да заплащат хиляди левове за това.
Използвайте WordPress + WooCommerce за онлайн магазин (БЕЗПЛАТНО)
С едно изречение, WooCommerce е най-добрият начин да превърнете вашия WordPress уебсайт в напълно функционален магазин за електронна търговия. И по-точно:
- Технически погледнато, WooCommerce е WordPress приставка. Трябва да се инсталира и активира, както всяка друга приставка.
- Безплатен и достъпен източник – също с отворен код, като WordPress – не са ви необходими лицензи, няма краен срок, никой няма да ви търси пари.
- Това е най-популярната приставка за електронна търговия за WordPress, която съществува.
- Това е (може би) най-богатата на функции приставка.
- Можете да го настроите и конфигурирате сами.
- Настройката е бърза ще ви отнеме най-много един следобед.
- Работи с всякакъв дизайн/тема, който използвате във вашия WordPress сайт = няма нужда да изхвърляте сегашния дизайн на сайта.
Мога да продължа с този списък, но вместо това ще кажа просто, че WooCommerce ви дава всичко от което имате нужда за да изградите високо качествен онлайн магазин за електронна търговия с WordPress.
Какво може да продавате с WordPress + WooCommerce?
Хмм.. доста:
- Дигитални продукти (като софтуери, продукти за сваляне, електронни книги)
- Продукти
- Услуги
- Резервации (за срещи, или нещо друго което може да бъде запазено)
- Абонаменти
- Продуктите на други хора – като съдружник
- Персонализации (например допълнителна персонализация на списъка ви с продукти), и още
С други думи, можете да правите пари от вашия уебсайт.
Дори бих рискувал да ви кажа, че WooCommerce ви позволява да продавате всичко на което може да се сложи цена. На всичко отгоре всеки може да го използва (ако вече имате WordPress сайт, значи без проблем ще се справите и с WooCommerce).
Как се прави онлайн магазин с WordPress и WooCommerce
Бележка. Целта на тази част от урока е да ви покаже най-лесния метод за изграждане на функционален магазин за онлайн търговия в WordPress, така че да можете да пуснете магазина си онлайн възможно най-скоро. Затова ще се фокусираме на най-важните неща и ще пропуснем по-напредналите аспекти.
Стъпка 1. Набавете си домейн име и уеб хостинг
За да създадете онлайн магазин, или какъвто и да е друг уебсайт, ще са ви нужни две неща:
Името на домейна е специалният уеб адрес на вашия магазин онлайн. Нещо като ВАШИЯТМАГАЗИН.com
УЕБ ХОСТИНГ е един вид отдалечен компютър, който съхранява вашия уеб сайт и след това го предоставя на всеки, който иска да го посети.
Има стотици различни хостинг/домейн доставчици, но обикновено получавам и двете от Ipage.com. Те предлагат достъпен уеб хостинг, безплатно име на домейн и надеждност. Те също са един от малкото хостинг доставчици препоръчани (официално) от WordPress.org.
Крайната цена, която ще заплатите за изграждането на вашият онлайн магазин, няма да бъде повече от 43.06 $(72 лева) използвайки някой от промоционалните линкове намиращи се на сайта, които Ipage предоставиха специално и само за вас – читателите на www.kakdasinapravimsait.com.
За да започнете, просто трябва да посетите Ipage.com, и да натиснете бутона “Get Started NOW”.
Това ще ви отведе до страница, където можете да изберете домейн име за вашия онлайн магазин.
Това изисква малко развиване на идеи. Главното е името на домейна ви да бъде уникално, лесно и запомнящо се. Също така, ако вече имате бизнес дружество за вашият онлайн магазин, тогава по-добре го използвайте като име за вашият домейн.
След като установите избора си на домейн име, може да финализирате настройките и да платите всички такси, които включват и хостинг план за вашият онлайн магазин.
Страхотно! Вече имате име домейн име и хостинг план, който да върви с него.
В случай, че имате нужда от по-подробна информация за процеса на регистрация, избора на домейн и инсталирането на WordPress, може да посетите това по-подробно ръководство или да изгледате Видео урока.
*Ръководството както и Видео Урока покриват стъпка 1 и 2 – след преглеждането на текстовият или видео урок може да преминете директно към стъпка 3*
Стъпка 2. Инсталирайте WordPress (БЕЗПЛАТНО)
На първо място след направената регистрация трябва да потвърдите вашето домейн име. Ipage ще ви изпратят email, в който трябва да потвърдите вашето домейн име, като кликнете върху линка намиращ се вътре в съобщението, което сте получили от тях.
След потвърждението официално се маркира началото на вашето приключение с WordPress – ще инсталирате WordPress във вашия хостинг акаунт.
Това може да звучи трудно, но всъщност не е. Просто трябва да отидете в потребителският панел на Ipage (Ipage ще ви изпратят линк за него в потвърждаващия имейл след вашата регистрация, който ще получите на вашият email адрес) – може да го намерите в www1.ipage.com/secure/login.bml.
След като влезнете от посоченият по-горе адрес, трябва да намерите икона обозначена “WordPress”:
Цъкнете там и следвайте инструкциите на екрана. Ще минете стъпка по стъпка през целия процес, така че няма за какво да се притеснявате.
До този момент трябва да имате празен и инсталиран уебсайт в WordPress.
- Може да го видите като отидете на името на вашия домейн (Пример: ВАШИЯТМАГАЗИН.com)
- Можете да влезете в админ панела като отидете на ВАШИЯТМАГАЗИН.com/wp-admin
Дойде времето да превърнем вашия празен WordPress уебсайт в изцяло функциониращ електронен магазин, изграден с прекрасната приставка WooCommerce.
Бих ви препоръчал преди да започнете следващите стъпки и изграждането на вашият онлайн магазин да смените езика на вашата WordPress инсталация на български, От WordPress админ панела се навигирайте към Settings -> General, намерете полето Site Language и сменете езика на български. Когато сте готови намерете бутона “Save Changes” и го кликнете.
СТЪПКА 3. Инсталирайте приставката WooCommerce (БЕЗПЛАТНО)
Както при всички пристави на WordPress, забавлението започва във вашия WordPress админ панела / Разширения / Добавяне на още. След като сте вече там, напишете “woocommerce” в полето за търсене. Би трябвало да видите WooCommerce като първи резултат от търсенето, но е възможно да се наложи да скролнете малко по-надолу в резултатите за да го намерите:
Просто натиснете бутона “Инсталиране сега” до приставката.
След няколко секунди, текста на бутона ще се промени на “Включване.” Давайте, натиснете го.
На този етап, ще видите на екрана програмата за инсталиране/настройки на WooCommerce. Този процес прави нещата много лесни и ви помага през цялото време.
Настройка на магазина
Настройките на магазина са много важна част от процеса за създаване на вашият онлайн магазин за електронна търговия. Параметрите при тази настройка определят:
- Местоположението на вашия бизнес
- Валутата, която предпочитате за приемане на плащания
- Какви продукти ще предлагате:
- Физически продукти – тениски, шапки, часовници, др…
- Дигитални продукти – електронни книги, логота за уебсайтове, софтуери, др…
- Дигитални и физически продукти – В случай, че желаете да продавате и от двата вида продукти изберете опцията „I plan to sell both physical and digital products“
След като попълните нужната информация натиснете “Да започваме!”.
Изберете метод на плащане (PayPal се препоръчва)
Възможността да приемате онлайн плащания е в основата на всеки магазин за електронна търговия и WooCommerce наистина предлага много по отношение на наличните решения. Ето какво можете да избирате по време на настройките:
Най-популярната опция за плащане е в най-горната част. Препоръчвам ви да интегрирате в сайта Paypal – чрез него може да приемате дебитни/кредитни карти, както и PayPal баланс, като опции за плащане във вашият уеб сайт. За да го интегрирате трябва само да кликнете върху съответният бутон за включване отдясно на PayPal.
Бележка. За да можете да извършвате онлайн плащания, трябва да се регистрирате в PayPal. Настройките в WooCommerce са само за интегриране на съществуващият ви профил в PayPal в новия ви уебсайт.
Офлайн плащания
Можете също така да изберете други начини на плащане, които изглеждат смислени, плюс ще има още още опции, достъпни по-късно в панела с настройки за WooCommerce.
Съветвам ви да включите Банков трансфер (BACS) и наложен платеж – това са едни от най-използваните опции при пазаруване от онлайн магазин за електронна търговия в България.
Натиснете “Продължаване” като приключите.
Доставка
Ще се зарадвате да разберете, че WooCommerce ви помага и с тази част.
Най-важните параметри са зададени автоматично, като е нужно само да настроите фиксирана цена за зоните на доставка. Разбира се, ако все още не сте наясно с тези цените за доставка може да попълните примерни цени, а на по-късен етап, когато сте наясно с тези цени ще имате възможност да ги промените.
След като сте готови, натиснете отново бутона „Продължаване“.
Екстри
Тази стъпка ще ви посъветва да инсталирате някой добавки.
Официалната тема на WooCommerce и тази, която би трябвало да работи най-добре се нарича Storefront. Версията по подразбиране е безплатна, и ще ви свърши доста добра работа. Съветвам ви да се възползвате само от тази опция, която ще Ви спести време, като инсталира официалната тема вместо вас.
За целта трябва да оставите настройките по подразбиране и да кликнете върху „Продължаване“.
Активиране
Ще ви бъде предложено да свържете вашият сайт с Jetpack, което от своя страна ще ви предложи доста допълнителни функции. Въпреки това, смятам че активирането на Jetpack е ненужно, поради причината че натоварва излишно сайта.
Навигирайте се най-долу на страницата и кликнете върху „Пропускане“.
Готово – не беше трудно, нали?
Следната стъпка е само за потвърждение, че всичко е направено както трябва. На този етап основните настройки на сайта ви са направени както трябва, току що сте изградили готов за запълване онлайн магазин за електронна търговия с WooCommerce!
Следващата стъпка е да добавите продукти. Ето как:
СТЪПКА 4. Добавете първия си продукт
За да може да наречете магазина си действащ, ви трябват няколко продукта в базата данни (или услуги, или продукти за сваляне, или каквото сте решили да продавате).
За да работите с продукти, отидете на вашето табло и след това Продукти / Добавяне на нов:
Това което ще видите е класически екран за редактиране на съдържанието в WordPress. Ето как става това:
- Име на продукта.
- Главното описание на продукта. Това голямо поле ви позволява да въведете колкото е възможно повече информация за продукта. И тъй като това е WordPress, можете да слагате не просто текст, но и снимки, колони, заглавия, дори видеа и всякакви други файлове. С други думи всичко което смятате, че е подходящо.
- Централният раздел за данни относно продукта. Това е мястото, където можете да зададете вида на продукта, който добавяте, и дали е продукт, който може да се изтегли или е виртуален продукт (услугите също се считат за виртуални продукти). Като част от този централен раздел получавате и раздели за различни параметри на продукта:
- Основни. Тук можете да зададете ценообразуването и данъците за продукта.
- Инвентар. WooCommerce ви позволява да управлявате наличностите на продукта.
- Доставка. Задайте теглото, размерите и цената на доставката.
- Свързани. Страхотна настройка за увеличаване на продажбите и за кръстосани продажби. (Помислете, “Клиентите, които закупиха товасъщо закупиха това.”)
- Атрибути. Задайте потребителски определения на продукта тук. Например, ако продавате ризи, можете да зададете алтернативни цветове тук.
- Разширени. Допълнителни настройки. Не задължителни.
- Кратко описание. Това е текстът, който излиза в страницата на продукта под името. Работи добре като кратко резюме за продукта.
- Категориите на продукти. Групирайте сходните продукти заедно. Например “шапки.” Работи точно като стандартни категории за WordPress.
- Етикети на продуктите. Допълнителен начин да ви помогне да организирате базата данни с продукти. Работи точно като стандартните етикети за WordPress.
- Снимка на продукта. Главната снимка на продукта.
- Галерия на продукта. Допълнителни снимки на продукта, чрез които да покажете колко е страхотен.
Също така, първият път когато посещавате панела, WooCommerce ще покаже някои удобни инструкции, за да разберете каква е целта на всяко поле:
В момента, в който приключите с предишните етапи, просто натиснете големият бутон Публикуване, и вашият първи продукт ще бъде добавен!
След като добавите продуктите към вашата база данни, секцията за продукти в таблото за управление трябва да изглежда така:
СТЪПКА 5. Изберете тема за вашия онлайн магазин (БЕЗПЛАТНО)
Ето доста добра причина, поради която избрах първо да обясня за добавянето на продукти към магазина, преди да обсъдим визуалния облик на вашият онлайн магазин.
Честно казано, без продукти в базата данни, няма да можете да видите индивидуалните страници в магазина в подобаващ вид, а и няма как да сте сигурни дали всичко изглежда правилно.
Но сега, след като вече сте добавили повечето продукти, може да се осигурим, че нещата са в ред от чисто визуална гледна точка.
WooCommerce срещу вашата тема в момента
По подразбиране, WooCommerce работи със всяка WordPress тема. Това е страхотна новина, особено ако вече сте избрали дизайна към, който искате да се придържате.
Също така, може да изберете специално персонализирана WooCommerce тема. Тези теми са с вече настроен стил, който кара всички елементи в WooCommerce да изглеждат добре.
Това са моите препоръки:
Както вече споменах, може да инсталирате Storefront – безплатна тема, която ще ви свърши доста добра работа.
Като алтернативен вариант, може да посетите най-големият магазин – ThemeForest за премиум WordPress теми. Предлагат доста добре функциониращи и оптимизирани теми с уникална визия.
Независимо дали сте решили да се придържате към текущата си тема или ще изберете нещо ново и оптимизирано за WooCommerce, това което трябва да направите е да се уверите, че отделните страници на магазина изглеждат добре. Нека да направим това сега:
Правилата за дизайна на електронната търговия
Да обсъдим няколко важни точки преди да се захванем със същността.
Главно, какво прави дизайна на магазина за електронна търговия добър (разбирайте: доходоносен)? Ето най-критичните параметри:
- Дизайнът трябва да бъде ясен и да не предизвиква объркване по никакъв начин. Един объркан посетител няма да купи нищо.
- Централният блок за съдържание трябва да грабне вниманието на посетителя веднага след като влезе в сайта. Този централен блок е мястото, където ще се показват продуктите.
- Регулируеми странични ленти. Трябва да изберете колко странични ленти имате нужда и също така да деактивирате страничната лента за някои страници (повече за това по-късно).
- Отзивчив и оптимизиран за мобилни устройства. Изследванията показват, че около 80% от хората в интернет притежават смартфон. И според друго изследване, 61% от вашите мобилни посетители ще напуснат незабавно и ще отидат при конкурентите ви, ако имат разочароващо преживяване при сърфиране чрез мобилния си телефони. С други думи, трябва да се уверите, че уебсайтът ви е оптимизиран за мобилни устройства, защото това е от решаващо значение.
- Добра навигационна структура. Искате ясни менюта, които са лесни за разбиране – така, че вашите посетители могат да намерят страницата, която търсят.
Имайте предвид следното, ето какво можете да направите с отделните страници в магазина:
Страницата на вашия магазин
Това е мястото, където може да се намери основното изложение на вашите продукти. Ако сте преминали през наръчника за настройки на WooCommerce, тази страница може да бъде намерена на адрес ВАШИЯТДОМЕЙН.com/porachka
Това е стандартна WordPress страница – Може да я промените от WordPress таблото / Страници.
Нещата, които си струва да направите:
- Добавете привличащ окото текст, който ще насърчи посетителите ви да пазаруват с вас.
- Решете дали искате да имате странична лента на страницата. Това се прави чрез шаблонните страници на вашата темата. Например, Storefront ми позволява да използвам пълна ширина на страницата, което ще направя:
Основната черта на страницата „Магазин“ е точно под стандартното съдържание, където е персонализирана част, в която се показват вашите продукти. Ето как изглежда темата на Storefront:
Както може да видите, хубавите продуктови изображения са от ключово значение и това е първото нещо, което трябва да постигнете. С други думи, вероятно трябва да работите върху изображенията на продуктите си повече от всичко друго.
WooCommerce също ви позволява да показвате продуктите си по алтернативни начини на тази страница. Когато отидете в таблото за управление на WordPress / WooCommerce / Настройки / Продукти и след това в раздела Изглед:
… можете да изберете дали искате да показвате отделни продукти или продуктови категории на страницата Магазин. Изберете това, което прави най-голям смисъл за вас и запазете настройките..
Индивидуални продуктови страници
За да видите тези страници, просто кликнете върху някоя продуктова обява от страницата на магазина.
Ако използвате качествена тема, не би трябвало да изпитвате никакви затруднения на тази конкретна страница. По принцип, единственото нещо, което можете да направите, е да коригирате размера на текста, който използвате за отделните продуктови описания, само за да сте сигурни, че всичко се вписва визуално и че няма празни места, които да объркат купувача.
Ето моя пример с темата „Storefront“ (няма извършени допълнителни настройки):
Количка
Друга важна страница, която може да се коригира чрез Таблото за управление / Страници.
Единственото нещо, което бих препоръчал тук, е да използвате шаблона за пълна ширина(Full width). Не искате да давате на купувача твърде много опции на тази страница, освен да премине към плащане.
Завършване на поръчката
Страницата за завършване на поръчката е може би най-важната от всички посочени до момента. Това е мястото, където купувачите ви финализират поръчките си и извършват плащанията.
Всъщност не ви препоръчвам да правите промени на тази страница, освен една:
Страницата за завъшрване на поръчката е задължително да използва шаблона за пълна ширина(Full width). Единственият приемлив начин купувача да излезе от тази страница, е като финализира поръчката си и не се разсейва от нещата, които са на разположение в страничната лента.
Отново, може да направите това чрез Таблото за управление / Страници (просто повторете процеса, с който сте преминали през страницата на магазина).
Освен това, изгледът на страницата „Checkout“ по подразбиране е страхотен:
На този етап сте готови с основното настройване на дизайна на онлайн магазина, сега нека разгледаме възможностите за разширяване на неговата функционалност.
Стъпка 6. WooCommerce – как да го разширим
Още едно нещо, което прави WooCommerce толкова впечатляващо решение за електронна търговия е, че има десетки или дори стотици разширения и плъгини за него.
Да разгледаме някои от най-полезните тук::
WooCommerce разширения
Нека започнем с разширенията – официалните добавки, одобрени от екипа на WooCommerce..
За да видите какво предлагат, можете да отидете на тази страница.
Този каталог е наистина впечатляващ и огромен. Но не искам да се чувствате уплашени от това. Вие със сигурност не се нуждаете от всички тези разширения. Просто се отнасяйте към този списък като на шведска маса – изберете всичко, което изглежда страхотно и от което имате нужда..
Някой от нещата, които си струва да се споменат:
- Разплащателни прозорци. Тези разширения Ви позволяват да приемете повече начини на плащане освен само стандартния PayPal. По принцип, колкото повече начини на плащане можете да си позволите да приемете (тези разплащателни прозорци са често заплатени), толкова по-добре.
- Разширения за доставка. Разширена и гъвкава доставка. Определете множество тарифи за доставка въз основа на местоположението, цената, теглото, класа на доставка или броя на елементите..
- Счетоводни разширения. Интегрирайте магазина си за WooCommerce със счетоводен инструмент по ваш избор.
- Резервации за WooCommerce. Позволете на клиентите си да резервират срещи за услуги, без да напускат сайта Ви.
- Абонаменти за WooCommerce. Нека клиентите Ви имат възможността да се абонират за вашите продукти или услуги, към които да плащат седмична, месечна или годишна такса.
Като алтернатива, ако не искате да харчите пари за нови разширения, можете да потърсите и разгледате разширения в безплатната категория. Има повече от достатъчно неща там, които да ви държат заети.
Плъгини, които ще засилят присъствието на вашият онлайн магазин:
Като оставим разширенията настрана, можете да използвате и други приставки за WordPress, за да засилите присъствието на вашият магазин. Ето какво би било добре да инсталирате:
- Yoast SEO. Подобрете SEO(Оптимизация за търсещи машини) на целия си уебсайт.
- Yoast WooCommerce SEO plugin. Подобрете SEO на вашите продукти и други области на вашияt магазин за електронна търговия.
- WooCommerce Multilingual. Създайте многоезичен сайт на WooCommerce.
- Contact Form 7. Нека посетителите на сайта Ви да имат възможността да се свържат директно с вас.
- UpdraftPlus. Архивирайте цялото съдържание на сайта си, включително продуктите си и другите данни за магазина.
- Social Share Buttons by GetSocial. Нека вашите купувачи имат възможността да споделят вашите продукти с приятелите и семейството си чрез социалните медии.
- MonsterInsights. Интегрирайте сайта си с Google Analytics.
- Better WP Security. Настройки за сигурност за вашият уебсайт.
- W3 Total Cache. Ускорете уебсайта си чрез кеширане.
В обобщение
Както можете да видите, степента на трудност, когато става въпрос за създаване на собствен онлайн магазин за електронна търговия с WordPress, не е твърде висока. Все пак навярно ще ви отнеме известно време, за да преминете през всички стъпки по-горе … може би един следобед.
Но това все пак е невероятно, като се има предвид, че преди пет години щеше да трябва да наемете разработчик и да му платите около 5000 хиляди лева, за да получите нещо подобно. Сега можете да направите всичко това сам.
Във всеки случай, за да ви помогнем да преминете през всички стъпки успешно, сме направили списък с необходимите задачи, които трябва да изпълните:
Преди да започнете
- Набавете си домейн име и хостинг и инсталирайте WordPress инсталация.
- Уверете се, че вашият нов празен WordPress уебсайт работи правилно (без очевидни изскачащи грешки…)
Инсталиране на WooCommerce
- Инсталиране и активиране на главният WooCommerce плъгин.
- Преминаване през съветника за настройки на WooCommerce
Продукти
- Добавете всички продукти или продуктови категории към вашият онлайн магазин.
Дизайн
- Изберете правилната WordPress тема за вашият онлайн магазин. Използвайте съществуващата тема инсталирана по подразбиране или прегледайте другите възможности. Не забравяйте и да прочетете – правила за дизайн на онлайн магазин за електронна търговия.
- Настройте страницата на Магазина.
- Настройте индивидуалните продуктови страници.
- Настройте страницата на количката.
- Настройте страницата за завършване на поръчката.
Разширения..
- Инсталирайте платежните прозорци, които искате да използвате.
- Обмислете някои от разширенията за доставка на вашите продукти.
- Обмислете инсталирането на счетоводно разширение.
- Прегледайте други разширения, както и категорията с безплатни разширения.
Плъгини
- Обмислете инсталирането на всички тези плъгини, които ще засилят присъствието на вашият онлайн магазин:
- Yoast SEO
- Yoast WooCommerce SEO
- WooCommerce Multilingual
- Contact Form 7
- UpdraftPlus
- Social Share Buttons by GetSocial
- MonsterInsights
- iThemes Security
- W3 Total Cache.
… и всъщност сте готови.
Поздравления – това е всичко!
Ако сте следвали стъпките в ръководството „Как се прави онлайн магазин“, вече би трябвало да имате напълно функциониращ и добре изглеждащ онлайн магазин с WordPress + WooCommerce! Не беше толкова трудно, нали?
Постарал съм се да направя допълнително меню „Уроци“, в което ако имате нужда може да видите повече уроци, които ще Ви помогнат да изградите вашият онлайн магазин още по-добре.
Надявам се да сте намерили това ръководство за полезно, но ако нужда от каквато и да е помощ или имате въпроси свързани с някоя от стъпките, ще съм повече от радостен да ви помогна. За да се свържете с мен използвайте страницата за контакт.
Последно..
Ако сте намерили това ръководство за полезно, моля споделете страницата ми, като използвате бутоните по-долу. Това ме държи мотивиран да запазвам цялата тази информация на сайта актуална. Благодаря ви!
Поздрави,
Мартин Каркелев