Vill du ta reda på hur du skapar en lutningstitel med Elementor?
När du skapar en webbsida eller en mall med Elementor, kan du göra ett litet experiment med titelelementet för att göra den sida du skapar sticker ut. Ett av experimenten du kan försöka är att lägga till en gradienteffekt till titelelementet.
Den här artikeln visar hur du kommer dit.
Du kan också läsa: Hur man skapar en tvåfärgad titel i Elementor
Elementors ursprungliga titelblock erbjuder inga alternativ för att ställa in en gradienteffekt. Du kan bara använda enfärgad färg för titeltext. Men du kan lägga till anpassad CSS för att lägga till gradienteffekt till titelelementet i Elementor med hjälp av anpassad CSS som endast är tillgänglig på Elementor pro.
För att göra detta kommer vi att erbjuda dig två metoder: Om du har proversionen och du är bekväm med CSS, använd den första metoden. Men om du gillar att använda Wordpress plugins den andra metoden kommer att vara perfekt.
Metod 1: Lägg till gradienteffekt på titelelement med anpassad CSS
Förutsatt att du har uppgraderat din Elementor till proversionen, skapa en ny sida / mall och redigera den med Elementor. Du kan också redigera en befintlig sida eller mall.
Lägg till widgeten Titel i dukområdet genom att dra och släppa titelelementet.
I blocket Titel under fliken Innehåll, välj en titelnivå i alternativet HTML-tagg. Du kan använda vilken nivå som helst av titeln. Du behöver detta som en CSS-väljare.
Gå till fliken advanced och öppna blocket Anpassad CSS och klistra in följande CSS-kod.
väljare h2 {bakgrundsbild: linjär gradient (till höger, # 463f64, # 463f64, # e2285c, # e2285c); -webkit-bakgrund-klipp: text; display: inline-block; stoppning: 14 pixlar; -webkit-text-fill-color: # 00000000; }
Se till att matcha väljaren med nivån på titeln du valde i föregående steg.
Du kan ändra färgerna genom att klistra in hexadecimalkoden för de färger du vill ha på fastigheten bakgrundsbild.
Eller så kan du också använda följande kod för att skapa en lutningstitel med fler färger på lutningen.
väljare .elementor-rubrik-titel {bakgrund: linjär gradient (90 grader, röd, blå, svart); -webkit-bakgrund-klipp: text; -webkit-text-fill-color: transparent; }
Metod 2: Skapa en gradienttitel i Elementor med ett plugin
Om du lägger till CSS låter skrämmande för dig finns det ett enklare sätt att skapa en lutningstitel i Elementor: genom att installera ett tilläggstillägg. Ett tillägg som låter dig skapa en lutningstitel är Glada tillägg.
Upptäck Hur man installerar (lägger till) ett plugin på WordPress
Happy Addons är ett freemium-plugin och elementet för att skapa en lutningstitel (kallad Gradient Heading) finns tillgänglig i gratisversionen. Du kan definiera typ av gradient (radiell eller linjär), gradientens position och plats.
Titelelementet erbjuder också samma lutningsjusteringsalternativ som Happy Addons.
Här är! Du skapade precis en lutningstitel på Elementor.
Upptäck också några premium WordPress-plugins
Du kan använda andra Wordpress plugins för att ge ett modernt utseende och för att optimera hanteringen av din blogg eller hemsida.
Vi erbjuder dig här några premium WordPress-plugins som hjälper dig att göra det.
1. 404 Error Page Omdirigera till hemsida eller anpassad sida
Här är ett av de bästa sätten att enkelt lägga till en 404-felsida som omdirigerar besökaren till hemsidan eller anpassad sida efter att ha aktiverat detta Wordpress plugin.
Alla 404-felsidor omdirigeras till startsidan eller en anpassad URL. Genom att använda detta Wordpress plugin, tillåter du Google att minska sidrankningen på din webbplats om den har många 404-felsidor.
Upptäck också Hur man fixar 413-fel på WordPress
Ce Wordpress plugin gör inte bara omdirigering utan det kan också vara en lämplig lösning för att förbättra rankningen av din webbplats i sökmotorernas resultat.
Ladda ner | demo | webbhotell
2. VOV
WOOF är ett kraftfullt premiumfilter för WooCommerce-filtrering, som utökar dess funktionalitet så att användarna på nätbutiken kan söka efter kategorier, anpassade produktattribut, efter nyckelord och med personliga priser.
Det erbjuder massor av professionella och premiumfunktioner och utan tvekan kommer det att vara den som slår dig mest om du försöker alla. Det kommer att förbättra produkt sökning i din webbutik med exceptionell användarvänlighet.
Ladda ner | demo | webbhotell
3. Kontaktformulär 7 Success Redirect
Kontaktformulär 7 Success Redirect är en förlängning av WordPress-kontaktformulärets 7-plugin som låter dig omdirigera en besökare eller en användare till en sida efter att hans kontakt har skickats in.
Det har utformats för att göra formuläret mer användarvänligt när formuläret för inlämning av formulär leder till att sidan omdirigeras till administratören. Det är extremt enkelt att konfigurera. Du kan göra detta genom att välja en sida från de befintliga sidorna på din instrumentpanel eller genom att tillhandahålla en Anpassad URL omdirigering.
Upptäck vårt 8 WordPress plugins för att förbättra SEO på din blogg
Varje formulär har sin egen konfiguration. Således kan varje framgångsrik omdirigering definieras på ett unikt sätt.
Ladda ner | demo | webbhotell
Rekommenderade resurser
Ta reda på om andra rekommenderade resurser som hjälper dig att bygga och hantera din webbplats.
- Vittnesmål: Hur kan du öka dina besökares förtroende
- Så här fixar du en webbplats som inte uppdateras direkt
- 7 WordPress-plugins för att bädda in Google Maps på din webbplats
- 10 WooCommerce plugins för att skapa en dynamisk prissättning
Slutsats
Så ! Det var allt för den här artikeln. Nu kommer du att veta hur du skapar en försämrad titel på WordPress med Elementor-plugin. Lämna oss din commentaires och kommentarer om du har några svårigheter att göra det.
Du kan dock också konsultera våra resurser, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blog skapelse.
Tveka inte att dela med dina vänner på dina favorit sociala nätverk.
.
