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