Czy chcesz dowiedzieć się, jak utworzyć tytuł gradientowy za pomocą Elementora?
Tworząc stronę internetową lub szablon z Elementor, możesz poeksperymentować z elementem tytułu, aby wyróżnić tworzoną stronę. Jednym z eksperymentów, które możesz wypróbować, jest dodanie efektu gradientu do elementu tytułowego.
Z tego artykułu dowiesz się, jak się tam dostać.
Możesz również przeczytać: Jak stworzyć dwukolorowy tytuł w Elementorze
Natywny blok tytułowy Elementora nie oferuje żadnych opcji ustawienia efektu gradientu. W tekście tytułu można używać tylko jednolitego koloru. Ale możesz dodać niestandardowy CSS, aby dodać efekt gradientu do elementu tytułu w Elementorze, używając niestandardowego CSS, który jest dostępny tylko w Elementorze pro.
Aby to zrobić, zaproponujemy Ci dwie metody: Jeśli masz wersję pro i dobrze znasz CSS, użyj pierwszej metody. Ale jeśli lubisz używać WordPress wtyczki druga metoda będzie idealna.
Metoda 1: Dodaj efekt gradientu do elementu tytułu za pomocą niestandardowego CSS
Zakładając, że zaktualizowałeś swój Elementor do wersji pro, utwórz nową stronę / szablon i edytuj ją za pomocą Elementora. Możesz także edytować istniejącą stronę lub szablon.
Dodaj widżet Tytuł do obszaru kanwy, przeciągając i upuszczając element Tytuł.
W bloku Tytuł pod zakładką Zawartość, wybierz poziom tytułu w opcji Znacznik HTML. Możesz użyć dowolnego poziomu tytułu. Będziesz potrzebować tego jako selektora CSS.
Przejdź do zakładki zaawansowany i otwórz blok Niestandardowy CSS i wklej następujący kod CSS.
selektor h2 {obraz w tle: gradient liniowy (po prawej, # 463f64, # 463f64, # e2285c, # e2285c); -webkit-background-clip: tekst; wyświetlacz: inline-block; wypełnienie: 14px; -webkit-tekst-wypełnienie-kolor: # 00000000; }
Upewnij się, że selektor jest dopasowany do poziomu tytułu wybranego w poprzednim kroku.
Możesz zmienić kolory, wklejając kod szesnastkowy kolorów, które lubisz na właściwości zdjęcie w tle.
Możesz też użyć poniższego kodu, aby utworzyć tytuł gradientu z większą liczbą kolorów na gradiencie.
selector .elementor-heading-title {tło: gradient liniowy (90deg, czerwony, niebieski, czarny); -webkit-background-clip: tekst; -webkit-text-fill-color: przezroczysty; }
Metoda 2: Utwórz tytuł gradientu w Elementorze za pomocą wtyczki
Jeśli dodanie CSS brzmi dla Ciebie przerażająco, istnieje prostszy sposób na utworzenie gradientowego tytułu w Elementorze: instalując rozszerzenie. Jednym z rozszerzeń, które umożliwia tworzenie tytułów z gradientem, jest Szczęśliwe dodatki.
Odkrywaj Jak zainstalować (dodać) wtyczkę na WordPress
Happy Addons to wtyczka freemium, a element do tworzenia gradientowego tytułu (nazywany Gradient Heading) jest dostępny w darmowej wersji. Możesz zdefiniować rodzaj gradientu (promieniowy lub liniowy), położenie gradientu i lokalizację.
Element Tytuł oferuje również te same opcje dostosowania gradientu, co Wesołe dodatki.
Tutaj jest! Właśnie utworzyłeś tytuł gradientu na Elementorze.
Odkryj także niektóre wtyczki premium WordPress
Możesz użyć innych WordPress wtyczki aby nadać nowoczesny wygląd i zoptymalizować obsługę Twojego bloga lub strony internetowej.
Oferujemy tutaj kilka premium wtyczek WordPress, które pomogą Ci to zrobić.
1. Strona błędu 404 Przekieruj na stronę główną lub niestandardową
Oto jeden z najlepszych sposobów łatwego dodania strony błędu 404, która po włączeniu tej opcji przekieruje użytkownika na stronę główną lub stronę niestandardową WordPress Plugin.
Wszystkie strony błędu 404 zostaną przekierowane na stronę główną lub niestandardowy adres URL. Używając tego WordPress Plugin, pozwolisz Google obniżyć PageRank Twojej witryny, jeśli zawiera ona wiele stron z błędami 404.
Odkryj też Jak naprawić błąd 413 na WordPress
Ce WordPress Plugin nie tylko przekierowuje, ale może być również odpowiednim rozwiązaniem poprawiającym ranking Twojej witryny w wynikach wyszukiwania.
2. WOOF
WOOF to potężna wtyczka do filtrowania produktów premium WooCommerce, która rozszerza swoją funkcjonalność, aby umożliwić użytkownikom sklepu internetowego wyszukiwanie według kategorii, niestandardowych atrybutów produktów, według Hasło oraz według spersonalizowanych cen.
Oferuje mnóstwo profesjonalnych i premium funkcji i bez wątpienia będzie to ta, która uderzy Cię najbardziej, jeśli wypróbujesz je wszystkie. Poprawi to wyszukiwanie produktów w Twoim sklepie internetowym, z wyjątkową łatwością użytkowania.
3. Formularz kontaktowy 7 Sukces przekierowania
Formularz kontaktowy 7 Success Redirect jest rozszerzeniem wtyczki 7 do formularza kontaktowego WordPress, która pozwala przekierować użytkownika lub użytkownika na stronę po przesłaniu jego kontaktu.
Został zaprojektowany, aby uczynić formularz bardziej przyjaznym dla użytkownika, gdy proces przesyłania formularza kończy się przekierowaniem na stronę wybraną przez administratora. Jest niezwykle łatwy w konfiguracji. Możesz to zrobić, wybierając stronę z istniejących stron pulpitu nawigacyjnego lub podając plik Niestandardowy adres URL przekierowanie.
Odkryj nasze Wtyczki 8 WordPress, aby poprawić SEO swojego bloga
Każdy formularz będzie miał własną konfigurację. Dlatego każde udane przekierowanie można zdefiniować w unikalny sposób.
Polecane zasoby
Dowiedz się o innych zalecanych zasobach, które pomogą Ci zbudować witrynę i zarządzać nią.
- Referencje: jak zwiększyć zaufanie odwiedzających
- Jak naprawić witrynę, która nie aktualizuje się natychmiast
- Wtyczki 7 WordPress do osadzania Map Google w Twojej witrynie
- 10 WooCommerce wtyczek do tworzenia dynamicznych cen
Wnioski
Więc ! To tyle w tym artykule. Teraz dowiesz się, jak utworzyć zdegradowany tytuł na WordPress za pomocą Wtyczka Elementor. Zostaw nam swoje commentaires i uwagi, jeśli masz z tym jakiekolwiek trudności.
Możesz jednak również skonsultować się nasze zasoby, jeśli potrzebujesz więcej elementów do realizacji projektów tworzenia stron internetowych, zapoznaj się z naszym przewodnikiem na temat Tworzenie bloga WordPress.
Nie wahaj się udostępnij znajomym w swoich ulubionych sieciach społecznościowych.
...