Трябва да добавите ефект на задържане в Elementor чрез персонализиран CSS?
Elementor има вградена функция за добавяне на ефект на задържане към елемент (Ние разгледахме това в една от нашите статии. Макар че функцията е достатъчно полезна, тя има и недостатък. Можете да добавите само ефект на задържане към нея. Раздел, колона, приспособление за изображение, приспособление за бутон и приспособление за публикации.
Прочетете още: Как да инсталирам Elementor на WordPress
Вградената функция на ефекта на курсора на Elementor не ви позволява да добавяте ефект на курсора към други приспособления, като приспособление за текстов редактор, приспособление за заглавие и др. Друг недостатък е, че можете да добавите само много елементарен ефект на задържане.
Има ли друга опция за добавяне на ефект на задържане в Elementor?
Да, има. Можете да добавите ефект на задържане в Elementor чрез персонализиран CSS. Но за да добавите персонализиран CSS, трябва да използвате Elementor Pro, тъй като персонализираният CSS е достъпен само в Elementor Pro.
Добавяне на ефект на задържане в Elementor чрез персонализиран CSS
Преди да започнем, нека да разгледаме примера на ефектите на мишката, създадени чрез персонализиран CSS.
За разлика от вградения ефект на курсора на Elementor, можете да използвате този метод, за да добавите точков ефект към всеки елемент в Elementor. Независимо дали става въпрос за раздел, колона или приспособление (всички приспособления).
В този пример ще ви покажем как да добавите точков ефект към колона.
Първо щракнете върху дръжката на колоната, за да превключите към панела за настройки на колоната. Веднъж там, отидете в раздела напреднал и отворете блока Custom CSS и поставете следния CSS код.
селектор: задръжте курсора {преход: всички .2 лекота на излизане; преобразуване: мащаб (1.1); курсор: точка; z-индекс: 1; }
Има.
В горния код използваме свойството CSS преобразуване () за да добавите ефекта на задържане. Типът трансформация, който използваме в този пример, е мащаб с продължителност 1,1 секунди.
Има 4 други вида трансформация, с които можете да използвате:transform
- матрица
- превеждам
- Завъртете
- кос
Ако искате да използвате различен стил на преобразуване, можете просто да замените стойността на трансформира на CSS кода по-горе.
Можете да прочетете Cette страница за да научите повече за трансформацията на CSS.
Можете да следвате същия маршрут, за да добавите ефект на задържане към други елементи.
За да добавите посочващ ефект към секция, можете да щракнете върху дръжката на секция и да отидете в раздела напреднал и отворете блока Персонализиран CSS.
За да добавите ефект на задържане към приспособление, можете да кликнете върху дръжката на приспособлението и да отидете отново в раздела. Разширено, след това отворете блока Персонализиран CSS.
Други допълнителни премиум приставки за WordPress
Открийте и други първокласни плъгини за WordPress, които помагат за оптимизиране на производителността на вашия блог или уебсайт в WordPress.
1. Продажби в реално време
Live Sales Popup е друг плъгин за известия за WordPress с няколко предимства, които можете да превърнете в предимство. На първо място, той има способността да покажете изскачащ прозорец когато някой изпълни поръчка.
Второ, изскачащият прозорец за продажби в реално време може също да показва известие, когато човек просто добави артикул в количката. И трето, можете да използвате инструмента, за да стимулирате рекламата на даден продукт, като покажете колко посетители са разгледали статията.
С най-новите уеб тенденции можете да очаквате изскачащи прозорци на живо да се показват красиво на всички устройства и браузъри. Що се отнася до изскачащото оформление, можете да го персонализирате до най-малкия детайл.
Да се чете: Как да се определи тревога за сигурността на вашия WordPress блог
Другите функции на Live Sales Popup са повече от тридесет анимации, звуци, обратно отброяване и персонализирано позициониране. Той работи и за фалшиви известия и ви позволява да го зададете само за определени страници, на които искате известието да изпълнява задачата си.
Изтегляне | демонстрация | уеб хостинг
2. Foodify
Foodify е най-бързият и лесен начин за клиентите да поръчат храна от магазин. Тя е изцяло отзивчив и включва допълнителни функции като изображение, опция за търсене, информация за продукта.
Освен това добавя бутони към кошницата, за да се подобри потребителското изживяване. Това разширение на WooCommerce е бързо, изчерпателно решение за поръчки, което може да бъде добавено към всеки уебсайт на WooCommerce.
Тук за вас 5 WordPress плъгини за оптимизиране на описанията и етикетите на категориите
Той има предимството, че е много гъвкав и съвместим с много съществуващи приставки в директорията на WordPress.
Изтегляне | демонстрация | уеб хостинг
3. Mega Zoom & Pan Image Viewer
Приставката Mega Zoom & Pan Image Viewer е страхотен преглед на изображения и браузър с напълно отзивчиво оформление за показване на големи изображения във вашия блог на WordPress.
Това е мощен инструмент, предназначен за представяне на продукти (изображения на продукти с висока разделителна способност. Пр .: облекло, автомобили, технически схеми и др.), Показване на карти и всички други изображения, благодарение на мащабирането и функцията си панорамен, неговите навигационни контроли, неговата лента за превъртанеи изключително персонализирани маркери / точки за достъп.
Това са 5 приложения за смартфони за защита на вашите изображения и видеоклипове
Този плъгин работи чудесно на iOS (iPad, iPhone), Android и Windows за мобилни устройства и др. Той също така работи на всички съвременни браузъри и по-стари браузъри като IE7 или IE8.
Други препоръчани ресурси
Също така ви каним да се консултирате с ресурсите по-долу, за да отидете по-далеч в управлението на вашия уебсайт и блог.
- Как да изтрия всички чакащи коментари в WordPress
- Кога и как да инсталирате WordPress в поддиректория
- 5 приставки за WordPress, за да добавите радостта от Коледа към вашия уебсайт
- 10 WordPress плъгини, за да подобрите визуалността на уебсайта си
Заключение
Ето го ! Това е всичко за това ръководство. Надяваме се, че тази статия ви е помогнала да добавите ефект на задържане в Elementor чрез персонализиран CSS. Можете също да прочетете нашата статия на Как да коригирате блокирането на визуализация на JavaScript и CSS в WordPress.
Ще можете обаче да се консултирате с нас грабене на ресурси, ако имате нужда от повече елементи, за да осъществите вашите проекти за създаване на интернет сайтове, като се консултирате с нашето ръководство за Създаване на блог на WordPress или тази, която е включена Divi: най-добрата тема на WordPress за всички времена.
Ако имате приятел или коментар, моля, оставете го в раздела коментар. Най-вече споделете тази статия във вашите различни социални мрежи.
...
