Kunne du tænke dig at lære, hvordan man opretter en gradienttitel med Elementor?
Når du opretter en webside eller skabelon med Elementor, kan du lave et lille eksperiment med titelelementet for at få den side, du opretter, til at skille sig ud. Et af de eksperimenter, du kan prøve, er at tilføje en gradienteffekt til titelelementet.
Denne artikel viser dig, hvordan du kommer dertil.
Du kan også læse: Sådan oprettes en tofarvetitel i Elementor
Elementors oprindelige titelblok tilbyder ikke nogen mulighed for at indstille en gradienteffekt. Du kan kun bruge ensfarvet til titelteksten. Men du kan tilføje brugerdefineret CSS for at tilføje gradienteffekt til titelelementet i Elementor ved hjælp af brugerdefineret CSS, som kun er tilgængelig på Elementor pro.
For at gøre dette vil vi tilbyde dig to metoder: Hvis du har pro-versionen, og du er fortrolig med CSS, skal du bruge den første metode. Men hvis du kan lide at bruge WordPress plugins den anden metode vil være perfekt.
Metode 1: Tilføj gradienteffekt på titelelement med tilpasset CSS
Forudsat at du har opgraderet din Elementor til pro-versionen, opret en ny side/skabelon og rediger den med Elementor. Du kan også redigere en eksisterende side eller skabelon.
Føj titelwidgetten til lærredsområdet ved at trække og slippe titelelementet.
I blokken titel under fanen Indhold, vælg et overskriftsniveau i indstillingen HTML-tag. Du kan bruge et hvilket som helst overskriftsniveau. Du skal bruge den som CSS-vælger.
Gå til fanen avanceret og åbn blokken Tilpasset CSS og indsæt følgende CSS-kode.
selector h2 { background-image: linear-gradient(til højre,#463f64,#463f64, #e2285c, #e2285c); -webkit-baggrund-klip:tekst; display: inline-blok; polstring: 14px; -webkit-tekst-fyld-farve: #00000000; }
Sørg for at tilpasse vælgeren til niveauet for den titel, du valgte i det foregående trin.
Du kan ændre farverne ved at indsætte hex-koden for de farver, du kan lide, på ejendommen baggrundsbillede.
Eller du kan også bruge følgende kode til at oprette en gradueringstitel med flere farver på gradienten.
selector .elementor-heading-title { baggrund: lineær-gradient(90deg,rød,blå,sort); -webkit-baggrund-klip:tekst; -webkit-text-fill-color:transparent; }
Metode 2: Opret gradienttitel i Elementor med plugin
Hvis tilføjelse af CSS lyder skræmmende for dig, er der en nemmere måde at oprette en gradienttitel i Elementor: ved at installere en tilføjelse. Et plugin, der giver dig mulighed for at oprette en gradienttitel er Glade tilføjelser.
Oplev Sådan installeres (tilføjes) et plugin på WordPress
Happy Addons er en freemium-udvidelse, og elementet til at skabe en gradienttitel (kaldet Gradient Heading) er tilgængelig i den gratis version. Du vil være i stand til at definere typen af gradient (radial eller lineær), positionen af gradienten og placeringen.
Titelelementet tilbyder også de samme gradientjusteringsmuligheder som Happy Addons.
Så! Du har lige oprettet en gradienttitel på Elementor.
Oplev også nogle premium WordPress-plugins
Du kan bruge andet WordPress plugins for at give et moderne udtryk og for at optimere håndteringen af din blog eller hjemmeside.
Vi tilbyder dig her nogle premium WordPress-plugins, der hjælper dig med det.
1. 404 Fejl Side Omdirigere til Hjemmeside eller Brugerdefineret Side
Her er en af de bedste måder at nemt tilføje en 404-fejlside, der vil omdirigere den besøgende til hjemmesiden eller brugerdefineret side, efter at have aktiveret denne WordPress plugin.
Alle 404-fejlsider vil blive omdirigeret til startsiden eller en tilpasset URL. Ved at bruge dette WordPress plugin, vil du tillade Google at reducere pageranken på dit websted, hvis det har mange 404-fejlsider.
Opdag også Sådan rettes 413-fejl på WordPress
Ce WordPress plugin laver ikke kun omdirigering, men det kan også være en passende løsning til at forbedre placeringen af dit websted i søgemaskinens resultater.
Downloade | demo | Web-hosting
2. WOOF
WOOF er et kraftfuldt WooCommerce premium produkt filter plugin, der udvider dets funktionalitet for at give dine online butiksbrugere mulighed for at søge efter kategorier, tilpassede produktattributter, Søgeord og med personlige priser.
Det tilbyder masser af professionelle og premium-funktioner, og uden tvivl vil dette være den, der rammer dig mest, hvis du prøver dem alle. Det vil forbedre produktsøgning i din onlinebutik med enestående brugervenlighed.
Downloade | demo | Web-hosting
3. Kontaktformular 7 Success Redirect
Kontaktformular 7 Succesomdirigering er en udvidelse af WordPress-kontaktformularen 7-plugin, der giver dig mulighed for at omdirigere en besøgende eller en bruger til en side efter indsendelsen af hans kontakt.
Det er designet til at gøre formularen mere brugervenlig, når formularindsendelsesprocessen resulterer i omdirigering til den side, som administratoren har valgt. Det er ekstremt let at konfigurere. Du kan gøre dette ved at vælge en side fra de eksisterende sider på dit dashboard eller ved at angive en Brugerdefineret URL omdirigering.
Opdag vores 8 WordPress plugins til at forbedre SEO af din blog
Hver formular har sin egen konfiguration. Således kan hver vellykket omdirigering defineres på en unik måde.
Downloade | demo | Web-hosting
Anbefalede ressourcer
Find ud af om andre anbefalede ressourcer, der hjælper dig med at opbygge og administrere dit websted.
- Udtalelser: Hvordan man øger tilliden hos dine besøgende
- Sådan løses et websted, der ikke opdateres med det samme
- 7 WordPress-plugins til at integrere et Google Maps på din hjemmeside
- 10 WooCommerce plugins til at oprette en dynamisk prissætning
Konklusion
Så! Det var det for denne artikel. Nu vil du vide, hvordan du opretter en forringet titel på WordPress med Elementor-plugin. Efterlad os din kommentarer og bemærkninger, hvis du har problemer med at komme dertil.
Du kan dog også konsultere vores ressourcer, hvis du har brug for flere elementer til at gennemføre dine projekter med oprettelse af internetsider ved at konsultere vores guide på WordPress blog oprettelse.
Tøv ikke med at del med dine venner på dine foretrukne sociale netværk.
...
