Искате ли да откриете и разберете как изглежда интерфейсът на Elementor? Това ръководство е за вас.
Проектирането на уебсайт с професионален вид не беше за всеки, особено всички ние имахме впечатлението, че абсолютно трябва да сме професионалисти в кодирането и уеб дизайна.
В днешно време виждаме нови инструменти, които се появяват за екосистемата на WordPress, за да осигурят все по-просто решение за проектиране на уебсайт в обсега дори на най-начинаещите.
По отношение на дизайна на оформления на WordPress, вече трябваше да изпратим приставката Visual Composer, което със сигурност е един от най-добрите инструменти, когато става въпрос за дизайн на оформление.
Трябва да се отбележи обаче, че това решение не е подходящо за всички. Ето защо в този урок ще ви запознаем с приставката Elementor WordPress, която е безплатна приставка за WordPress (безплатна, но с възможност за разширяване при абонамент).
Съдържание
Къде да вземем Elementor за WordPress
Ние сериозно обмисляме да ви накараме да видите потенциала на приставката и безплатното решение ще ви помогне да започнете, без да плащате и стотинка. Това безплатно решение е достъпно на WordPress.org. Тъй като е плъгин за WordPress, той се инсталира като всеки друг плъгин от таблото за управление.
Ако плъгинът успее да ви удовлетвори напълно, ще можете да получите пълния лиценз с всички функционалности на сайта официален елемент или.
Основни характеристики на Elementor
Elementor е един от най-популярните създатели на страници за WordPress и има защо. Със своите надеждни функции и интуитивен интерфейс, той предлага мощно решение за създаване на професионални уебсайтове без необходимост от умения за кодиране. Ето преглед на основните характеристики на Elementor, които го правят незаменим за всеки потребител на WordPress:
Визуален редактор с плъзгане и пускане : Elementor предлага интуитивен визуален редактор, който ви позволява да проектирате страници чрез плъзгане и пускане на елементи. Можете да видите промените в реално време, което прави много по-лесно персонализирането на вашия уебсайт.
Богати Widgets : С широк набор от налични джаджи, Elementor ви позволява да добавяте различни елементи към страниците си, като бутони, галерии, въртележки, формуляри и др. Pro версията разширява тази функционалност с усъвършенствани джаджи като формуляри за контакт, плъзгачи и портфолио.
Предварително зададени шаблони : Elementor предлага библиотека от готови шаблони, които могат да се използват като отправна точка за вашите страници. Тези шаблони покриват различни стилове и нужди, което улеснява създаването на естетически приятни и функционални страници.
Редактор на теми : С Elementor Pro можете да персонализирате не само съдържанието на страниците си, но и горните, долните колонтитули и други цялостни части на вашия сайт благодарение на вградения редактор на теми. Това ви позволява да създадете визуална последователност в целия си сайт.
Създаване на шаблони за публикации : Функцията за създаване на шаблони за публикации ви позволява да проектирате оформления за конкретни типове публикации, като публикации в блогове или продукти на WooCommerce. Тази опция е особено полезна за създаване на последователни дизайни за различни видове съдържание.
Създател на изскачащи прозорци : Elementor Pro включва създател на изскачащи прозорци, който ви позволява да създавате персонализирани изскачащи прозорци за реклами, формуляри за регистрация или други взаимодействия с посетители. Можете да определите условия на показване, за да насочите точно вашата аудитория.
Разширени контроли на оформлението : Elementor предлага разширени контроли за типография, полета, интервали и адаптивно оформление. Можете да коригирате оформлението на вашия сайт за различни типове устройства, осигурявайки оптимално потребителско изживяване на мобилно устройство, таблет и настолен компютър.
Поддръжка и документация : Elementor предоставя цялостна поддръжка с подробна документация, онлайн уроци и активна общност. Професионалните потребители се възползват от директна първокласна поддръжка, осигуряваща бърза и ефикасна помощ при разрешаването на всякакви проблеми.
Разширения и интеграции : Elementor е съвместим с различни добавки и интеграции, което прави възможно добавянето на допълнителна функционалност към вашия сайт. Независимо дали искате да интегрирате маркетингови инструменти, SEO добавки или решения за електронна търговия, Elementor улеснява разширяването на възможностите на вашия сайт.
Ето таблица, която обобщава функциите на Elementor.
| функции | Безплатно за Elementor | Elementor Pro |
| Плъзнете и пуснете редактор на страници | да | да |
| Предварително зададени шаблони | да | да |
| Основни джаджи | да | да |
| Pro джаджи | Non | да |
| Редактор на горен и долен колонтитул | Non | да |
| Създаване на шаблони за публикации | Non | да |
| Създаване на WooCommerce шаблони | Non | да |
| Създател на изскачащи прозорци | Non | да |
| Поддръжка на джаджи на трети страни | Non | да |
| Техническа поддръжка | Non | да |
| Маркетингови функции (формуляри | Non | да |
| Достъп до премиум библиотеката с шаблони | Non | да |
| Разширени ефекти и анимации | Non | да |
| Инструменти за преглед и архивиране | Non | да |
| Създаване на форми | Non | да |
| Разширено управление на типографията | Non | да |
| Адаптивен контрол на оформлението | Non | да |
| Достъп до редовни актуализации | да | да |
Имайте предвид, че това е малко изчерпателен списък на различните функции, предлагани от приставката. Повече подробности ще намерите в проучване на техния уебсайт.
Започнете с Elementor
Първите стъпки с Elementor са бързи и лесни, дори ако сте нови в създаването на WordPress сайтове. Следвайте тези стъпки, за да настроите Elementor и да започнете да проектирате страниците си като професионалист.
Тук няма да разглеждаме целия процес на инсталиране. Тъй като това е приставка за WordPress, процедурата за инсталиране вече е обяснена в предишен урок.
Инсталиране на Elementor
- Достъп до таблото за управление на WordPress: Влезте в административния панел на WordPress.
- Отидете до Разширения: Отидете на „Разширения“, след което щракнете върху „Добавяне“.
- Търсене на Elementor: Въведете „Elementor“ в лентата за търсене. Ще намерите Elementor (безплатна версия). За да започнете, инсталирайте и активирайте безплатната версия.
- Инсталирайте Elementor: Щракнете върху „Инсталиране сега“, след това върху „Активиране“, след като инсталацията приключи.
След инсталирането обаче ще бъдете отведени до началната страница на приставката.
Ако имате тази страница на екрана си, значи сте инсталирали успешно плъгина Elementor. В момента използваме пълната версия за този урок, но интерфейсът не трябва да се различава много от безплатната версия.
Преди да преминете към интерфейса за редактиране, ще ви поканя да регистрирате своя лиценз. Това е валидно само за тези, които са избрали Pro версията.
Ако имате безплатната версия, можете да получите достъп до следващия раздел. За да регистрирате своя лиценз, ще забележите известие в WordPress, което ще ви подкани да регистрирате своя лиценз.
Така че просто щракнете върху Надстройване сега за достъп до страницата за регистрация и щракнете върху Активирате.
Обикновено ще видите вашата страница за потвърждение, ако вашият лиценз е такъв Активен.
Ако не стигнете до тази страница, каня ви да се свържете с разработчиците на приставката за повече информация помощ при проблема.
Интерфейс на Elementor
Интерфейсът на Elementor е проектиран да осигурява гладко и интуитивно потребителско изживяване, което улеснява създаването и персонализирането на вашите WordPress страници. Ето подробен преглед на основните раздели на интерфейса на Elementor, заедно с визуални примери, които да ви помогнат да разберете по-добре всеки елемент.
Работната зона (зона със съдържание)
La Работна зонаИли област със съдържание, е централното пространство, където създавате и разглеждате страницата си. Това е мястото, където добавяте и редактирате уиджети и секции. Оформлението се показва в реално време, което ви позволява да видите промените, когато се случват.
Панелът Widgets
Le панел с джаджи се намира отляво на интерфейса. Той съдържа различни елементи, които можете да плъзгате и пускате върху работната зона. Уиджетите са организирани в категории, като „Общи“, „Основни“, „Оформление“ и т.н., за да улесните намирането и добавянето на елементи към вашата страница.
Elementor Widget Groups
Elementor Widget Groups са групи от функционални блокове, които Elementor предлага. Броят на разделите зависи от това дали използвате пълната версия и дали използвате WooCommerce, Yoast SEO или други съвместими добавки.
В зависимост от тези условия ще имате повече или по-малко секции на вашия интерфейс. Тъй като използваме пълната версия с активиран плъгин WooCommerce, ето как изглежда нашият интерфейс.
Горна лента с инструменти
La горната лента с инструменти включва основни опции като:
- Лого: Показва в меню функции като: създател на теми, хронология, предпочитания за акаунти, клавишни комбинации и др.
- Бутон за добавяне на елементи: Позволява ви да покажете панела с изпълними модули, които да бъдат вмъкнати в страниците
- Бутон за настройки на сайта: Показва много глобални настройки на опциите на сайта
- Бутон за структура: Позволява ви да видите цялостната структура на вашата страница и да навигирате в нея без притеснения. Ако вашата страница има няколко вложени секции, тази функционалност ще ви бъде от голяма полза.
- Заглавие на страницата/статия: Показва заглавието на страницата или статията, както и нейното състояние (чернова, публикувана и т.н.)
- Меню за мобилна навигация : Позволява ви да превключвате между изгледи за настолен компютър, таблет и мобилно устройство. Това е от съществено значение, за да се гарантира, че вашият дизайн е отзивчив и добре настроен за всички типове устройства.
- Настройки на страницата : Достъп до настройките на страницата, включително опции за оформление и настройки за стил.
- Публикуване/Актуализиране : Запазва и публикува промените, направени на страницата.
- Визуализация : Символизира се с око и ви позволява да видите как се държи вашата страница в реална ситуация.
Така че отляво имате различните джаджи, които плъгинът предлага, а отдясно имате предварителен преглед в реално време на вашите модификации. В този урок използваме безплатната тема Hello от Elementor.
Как да използвате Elementor
Създаване на вашата първа страница
Elementor работи на WordPress страници и публикации. Независимо дали използвате класическия интерфейс или новия интерфейс на Gutenberg, ще видите бутон, който ще ви покани да използвате конструктора Elementor.
- Създайте нова страница: Отидете на „Страници“ и щракнете върху „Добавяне“.
- Наименувайте страницата си: Дайте заглавие на страницата си и я публикувайте.
- Редактирайте с Elementor: Щракнете върху бутона „Редактиране с Elementor“, за да стартирате визуалния редактор на Elementor.
На практика не винаги ще трябва да редактирате публикациите си с помощта на Elementor. Затова ви каня да използвате приставката само на страници.
Щраквайки върху бутона, ще получите достъп до дизайнерския интерфейс на Elementor, който създава усещане за дежа вю (за тези, които използват WordPress Customizer).
Как да добавите Widgets към Elementor Editor
Плъзнете уиджети като заглавия, изображения, бутони и други от левия панел към областта със съдържание. Можете да коригирате настройките на всяка джаджа, като щракнете върху нея.
Персонализиране на джаджи: Кликнете върху изпълнимия модул, за да отворите опциите за персонализиране. Можете да коригирате текст, изображения, цветове, размери и др.
Използвайте шаблони: За да ускорите процеса, използвайте предварително зададените шаблони. Щракнете върху иконата на папка за достъп до библиотеката с шаблони, където можете да изберете шаблон и да го импортирате с едно щракване.
Практически случаи
Как да поставите блок Elementor
След като разгънете раздел, ще намерите елементи на Elementor. Различните уиджети на Elementor се поставят чрез „плъзгане и пускане“ в маркираната област с прекъснати линии.
Как да изберем оформлението на раздел в Elementor
Преди да добавите джаджи на Elementor, трябва да помислите за избор на оформление, като щракнете върху бутона „+“ в маркираната секция.
В зависимост от вашите нужди ще изберете оформлението, което е най-подходящо.
След като изберете оформление, имате представяне на този раздел в същата маркирана област. Този раздел ще покаже същия брой колони, съответстващи на вашия избор. В моя случай избрах колона с 2 колони.
Различните колони със знак „+“ вътре са областите, които могат да приемат джаджи на Elementor.
Ако добавите блок Elementor, без първо да изберете оформление, оформлението с една колона ще бъде избрано по подразбиране.
Секциите на Elementor могат да бъдат пренаредени помежду си, следвайки същия принцип на „ Плъзнете и пуснете".
Можете също така да изтриете раздел, ако вече не искате да го използвате.
Ето пример за раздел, който съдържа 2 блока, а именно заглавния блок и текстовия блок.
Как да използвате други инструменти за проектиране
След като завършите дизайна си, едно от нещата, които ще искате да направите, е да запазите работата си. Ще намерите тази опция в най-долната част на раздела, показващ различните секции на Elementor.
Можете да изберете да запазвате директно (Публикуване) и да запазвате като чернова или като шаблон. Ще разгледаме тези различни точки по-късно.
Докато проектирате, може също да искате да прегледате промените без допълнителния интерфейс на Elementor. Всичко, което трябва да направите, е да щракнете върху иконата на око в горната лента на редактора на Elementor.
Случва се по време на проектирането да възникне грешка (неволно действие).
В този случай Elementor ви предлага история, която ви позволява да навигирате през всичките си действия.
Изтрийте от списъка действията, които искате да отмените
Това ще ви позволи лесно да се върнете назад.
„ настройки » ви позволява да променяте определени опции, специфични за страницата, като например заглавие, представено изображение или статус и др.
Често задавани
Какво е Elementor?
Elementor е конструктор на страници с плъзгане и пускане за WordPress, позволяващ на потребителите да проектират уебсайтове визуално без кодиране. Той предлага интуитивен интерфейс с инструменти за плъзгане и пускане за добавяне и персонализиране на елементи на вашите страници.
Безплатен ли е Elementor?
Elementor предлага безплатна версия с достатъчна основна функционалност за създаване на прости уеб страници. Pro версията, достъпна чрез абонамент, предлага разширени функции като допълнителни джаджи, премиум шаблони и обширни опции за персонализиране.
Какви са предимствата на Pro версията на Elementor?
Pro версията на Elementor предлага усъвършенствани джаджи, професионални шаблони, по-задълбочени опции за дизайн и възможност за създаване на персонализирани горни, долни колонтитули и архиви. Той също така позволява подобрена интеграция с инструменти на трети страни и маркетингови функции.
Как да инсталирам Elementor на моя WordPress сайт?
За да инсталирате Elementor, отидете на таблото за управление на WordPress, щракнете върху „Добавки“, след това върху „Добавяне“. Потърсете „Elementor“ в полето за търсене, след това щракнете върху „Инсталиране сега“ и накрая върху „Активиране“. Можете също да инсталирате Elementor Pro, като изтеглите ZIP файла от уебсайта на Elementor и го импортирате чрез „Разширения“ > „Добавяне“ > „Качване на разширение“.
Как да използвате Elementor за създаване на страница?
След като инсталирате Elementor, отидете на страница или публикация в таблото за управление на WordPress и щракнете върху „Редактиране с Elementor“. Ще бъдете отведени до редактора на Elementor, където можете да плъзгате и пускате уиджети и секции, за да проектирате вашата страница. Използвайте левите панели, за да добавите и персонализирате елементи към вашата страница.
Elementor съвместим ли е с всички теми на WordPress?
Да, Elementor е проектиран да бъде съвместим с повечето Теми на WordPress. За оптимална интеграция обаче се препоръчва използването на теми, създадени специално за Elementor, които предлагат повишена съвместимост и гъвкавост.
Мога ли да използвам Elementor за създаване на сайт за електронна търговия?
Да, Elementor е съвместим с WooCommerce, което ви позволява да създавате и персонализирате продуктови страници, страници за магазини и шаблони за страници за плащане. Pro версията предлага специфични за WooCommerce джаджи за подобряване на външния вид на вашия онлайн магазин.
Как мога да прегледам промените, направени с Elementor?
Можете да визуализирате промените си, като щракнете върху бутона „Преглед“ в редактора на Elementor. Това ви позволява да видите как ще изглежда вашата страница, преди да публикувате промените на живо.
Elementor предлага ли техническа поддръжка?
Да, Elementor предлага техническа поддръжка чрез форуми, база от знания и система за билети за потребители на Pro. Можете също така да получите достъп до подробни уроци и ръководства на официалния уебсайт на Elementor.
Мога ли да използвам разширения на трети страни с Elementor?
Да, Elementor е съвместим с много разширения на трети страни, които добавят допълнителни функции и джаджи. Можете да ги инсталирате като WordPress плъгини нормални за разширяване на възможностите на Elementor.
Ресурси, подобни на тази статия
- Как да създадете формуляр с Elementor безплатноВземете Elementor Pro сега!!!
- Как да създадете изскачащи прозорци с Elementor
- Elementor Безплатно срещу. Elementor Професионалист: Подробно сравнение на характеристиките
- Elementor : Как да промените изображението с едно натискане на бутон
- Как да създадете оформление с Elementor
Заключение
Elementor е мощно и гъвкаво решение за създаване на изключителни WordPress страници без необходимост от кодиране. Със своя интуитивен интерфейс и надеждни функции, той позволява както на начинаещи, така и на професионалисти да проектират атрактивни и функционални уебсайтове за нула време.
Като разберете основните раздели на интерфейса на Elementor, вие ще можете да навигирате ефективно в редактора, да използвате оптимално приспособленията и да персонализирате всеки аспект на вашите страници, за да отговарят на вашите специфични нужди.
Les работни зони, панели с джаджи, и други инструменти са проектирани да осигурят максимална гъвкавост, като същевременно поддържат лекота на използване. Като интегрирате безпроблемно секции и колони и се възползвате от опциите за стил и оформление, можете да превърнете визията си в реалност.
Не забравяйте да се възползвате от функциите за предварителен преглед в реално време, за да сте сигурни, че вашите дизайни изглеждат страхотно на всички устройства. С Elementor всеки проект се превръща във възможност за създайте уебсайт впечатляващо, което наистина се откроява.
За повече съвети и уроци относно използването на Elementor се абонирайте за нашия блог и следете за най-новите актуализации и съвети. Споделете тази статия с други ентусиасти на WordPress и уеб дизайна, за да им помогнете да реализират пълния потенциал на Elementor.
Започнете да изследвате безкрайните възможности, които Elementor ви предлага сега и превърнете идеите си в завладяващ уеб дизайн!