Kunne du tænke dig at finde ud af, hvordan du tilpasser et WordPress-tema med Elementor-plugin ?
Tilpasning af dit WordPress-tema er en af de vigtigste opgaver, når du bygger WordPress-websteder. Da hun kontrollerer designet af et websted, er det her mange fagfolk tilbringer det meste af deres tid.
Oprettelse af et tilpasset WordPress-tema involverer normalt arbejde med temafilerne og en kodeditor. Layoutændringer sker i skabelonfiler, designændringer gennem CSS. Du bliver også nødt til konstant at opdatere browservinduet for at vise dine tilpasninger, som kan være en smule besværligt.
Heldigvis med Elementor, denne proces bliver ekstremt let, så du kan tjekke den ud.
Men før, lad os opdage sammen Sådan installeres en WordPress blog 7 trin et Hvordan at finde, installere og aktivere et WordPress tema på din blog.
Så tilbage til, hvorfor vi er her.
Hvad er et WordPress-tema
Et WordPress-tema er i det væsentlige en samling skabeloner, der definerer det visuelle udseende på et WordPress-websted.
WordPress-temaet omfatter alt, der påvirker design af et websted, fra overskrifter og sidefødder til farveskema, layout og mere.
Der er masser af temaer tilgængelige, både gratis og premium, som passer til næsten enhver branche fotograferingswebsteder, gymnastikselskabs websteder, frisørsider websteder, lov webstederOg mere.
Hvorfor tilpasse et WordPress-tema?
En af hovedårsagerne til at oprette en hjemmeside er at promovere din virksomhed. Hvilken bedre måde at gøre det på end at oprette et websted unikke, der fremmer virksomhedens stil og design.
Kan du forestille dig, at Amazon, eBay eller Google er, hvad de er uden deres unikke design?
Selvfølgelig ikke, og det er en af grundene til, at vi ønsker at tilpasse et WordPress-tema. Vi ønsker at gøre det unikt og tilpasse sig vores virksomheds budskab.
Undertiden, eller rettere, ofte, kører du gennem et WordPress-tema, der er plaget af dårligt design, farver, der ikke går godt sammen, eller et tema, der er for tungt og kun påvirker ydeevnen på webstedet. web. WordPress-tema kan være magtfuldt undtagen for den ting, der generer dig. Tilpas det og ændre denne ting kan løse alle dine problemer og skabe bedre brugeroplevelse.
Sådan tilpasses et WordPress-tema
Der er flere metoder til at tilpasse et WordPress-tema.
- Manuelt via WordPress customizer
- Med koden
- Med Elementor
Sådan tilpasses manuelt et WordPress-tema
Du kan tilpasse WordPress-temaet efter eget valg via den indbyggede WordPress Customizer. Hvis du gør det uden kode, er du ofte begrænset i, hvad du kan ændre. Nogle WordPress-temaer premium giver dig flere tilpasningsmuligheder, men i bund og grund er der ikke mange designmuligheder for dig.
Før vi dykker dybere ned i dette område, vil vi gerne påpege, at når du tilpasser et eksisterende WordPress-tema, er det bedst, at du bruger et barnstema og ikke overordnede tema.
WordPress børnetema
Et børnetema er et WordPress-tema, der har nøjagtigt de samme funktioner og egenskaber som et andet WordPress-tema, overordnet tema. Børnetemaet bruges til sikkert at tilpasse og ændre tematikken uden at påvirke overordnede tema og uden at miste evnen til at opdatere det.
WordPress-tematilpasning
Så nu, hvor vi ved, at det er bedst at arbejde med et tema for børn, så lad os lære at tilpasse et tema med WordPress Customizer. Gå til dit betjeningspanel for at få adgang til det. Klik på apparence på venstre side og vælg Tilpas.
De vigtigste funktioner, du kan ændre med denne Customizer, er som følger:
Tilføjelse af et webstitstitel, logo og ikon
For at tilføje eller ændre din titel, logo eller ikon kan du bare gå til panelet Identitet på webstedet. og vælg hvert af disse elementer for at ændre dem.
Ændring af farverne på WordPress-temaet
nogle WordPress-temaer giver dig mulighed for at ændre deres farveskemaer, men ikke dem alle, og det er de normalt WordPress-temaer præmie. Hvis dit WordPress-tema giver dig mulighed for at ændre farveskemaet, vil du se denne mulighed, når du åbner Customizer.
Tilføjet navigationsmenuer
Customizer giver dig også mulighed for nemt at tilføje og ændre dine websteds navigationsmenuer.
Sådan tilpasses et WordPress-tema med kode
Du vil bemærke, at du under fanen Udseende har mulighed for at vælge temaeditoren. Hvis du klikker på den, byder du velkommen med et vindue med temakoden. Denne mulighed kræver en god forståelse af CSS-kodning og anbefales ikke til begyndere.
Her har du adgang til filer som style.css, features.php, og dette er nøjagtigt det scenarie, som du har brug for et tema for børn, så du ikke bryder dit websted.
Den anden måde at tilpasse dit tema ved at kode er at uploade filer ved hjælp af en FTP-løsning. Processen involverer oprettelse af FTP-legitimationsoplysninger gennem din hostingudbyder, downloading og installation af en FTP-løsning (som FileZilla), logning på din konto og redigering af dine filer, som du derefter uploader gennem det samme. FTP-løsning.
Oplev vores guide om Sådan installeres WordPress med FileZilla
Medmindre du er fortrolig med kodning, anbefaler vi ikke denne mulighed.
Tilpas et WordPress-tema let med Elementor
Du kan gøre dette direkte fra brugergrænsefladen. Der er ingen grund til at ændre en enkelt kodelinje eller genindlæse et browservindue, heller ikke en gang.
Elementor giver dig mulighed for at ændre hvert element på webstedet hurtigt og nemt med blot et par museklik, og du kan endda optimere disse funktioner til den mobile platform.
Elementor gør denne proces meget lettere ved at bruge dynamisk indhold og giver dig mulighed for at forhåndsvise dine sider. På denne måde kan du med det samme se, hvordan designændringerne vil påvirke dit aktuelle websted og indhold.
Tilpas overskrift og sidefod
Elementor giver dig fuld fleksibilitet, når det kommer til at designe dine overskrifter og sidefødder. Vi ved alle, hvor kedeligt det kan være, at du har et WordPress-tema, og du kan ikke ændre et enkelt aspekt af header- eller sidefodsdesign. Du har brug for specialiserede temaer, plugins osv.
Med Elementor er det let.
1. Opret en overskriftsskabelon
Konfigurer først en ny header-skabelon. For at gøre dette skal du gå til Elementor> Mine skabeloner.
Her er en måde at starte at trykke på knappen Tilføj nyt øverst. I det næste skærmbillede skal du bruge rullemenuen til at vælge Header som den type skabelon, der skal designes.
Du kan også nå denne skærm ved at klikke på fanen Header fra den forrige skærm og derefter trykke på den store grønne knap, der vises.
Det forud vælger overskriften som skabelontype. Uanset hvad, skal du tilføje et passende navn til skabelonen (så du ved, hvad det er senere) og fortsæt derefter ved at klikke på Opret skabelon.
Det kommer dig her.
Med Elementor Pro kan du vælge mellem foruddesignede header-blokke. Dette er designskabeloner, som du kan bruge som udgangspunkt for dit eget design, hvilket er, hvad vi vil gøre i dette tilfælde.
Når du holder musepekeren over en overskriftsblok ved at klikke på indsatte giver dig mulighed for at begynde at designe det med det samme. Ellers skal du først klikke på billedet for at se en større version. Derefter kan du altid trykke på indsatte øverst.
Ellers, hvis du vil starte fra bunden, skal du bare lukke vinduet ved at klikke på X i øverste højre hjørne.
2. Skift det grundlæggende overskriftdesign
Efter at have indtastet den nye header, er den første ting, du vil bemærke, at logoet og menuen, vi konfigurerede tidligere, allerede er der.
Det er netop derfor, vi sætter dem på plads, og vi skal tale om, hvordan vi tilpasser dem. Lad os dog først se, hvordan man tilpasser selve header-sektionen.
For at gøre dette skal du bare holde markøren over den og klikke på redigeringsknappen øverst. Dette åbner en liste over redigeringsmuligheder til venstre.
Her er, hvad du kan kontrollere i de forskellige menuer:
- Layout - Kontroller sektionens bredde, størrelsen på mellemrummet mellem kolonner, højde, lodret søjle og indholdsplacering, tildelt HTML-tag og generel struktur.
- stil - Her kan du ændre baggrundsfarve inklusive svæveeffekter, også selvom tilføj billede eller video Hvis du vil, skal du tilføje overlay-, kant- og divideringseffekter samt ændre indstillinger for typografi.
- avanced - Denne del giver dig mulighed for at tilføje CSS-attributter som margin og z-indeks, animationer, ID'er og klasser. Det giver dig også mulighed for at gøre sektionen klistret og kontrollere indstillingerne responsive samt tilføje nogle Tilpasset CSS.
Alt det ovenstående er ret selvforklarende, og du får hurtigt det, du ønsker.
3. Tilpas overskriftelementerne
Du kan dog ikke kun redigere overskriftssektionen som helhed, men også de elementer, der er inkluderet i det. For at tilpasse webstedets logo skal du bare klikke på det. Også dette giver dig redigeringsmuligheder på venstre side.
I tilfælde af logoet giver dette dig følgende muligheder:
- Indhold - Skift billedstørrelse, justering og det sted, det er knyttet til.
- stil - Kontroller bredde og højde, tilføj CSS-effekter og svæveeffekter, inkluder kant og skygge, hvis du vil.
- avanced - Her finder du stort set de samme muligheder som for overskriftsoverskriften.
Brug indstillingerne til at tilpasse logoet, som du ønsker, at det skal vises godt i overskriften. Bemærk også, at hvert element har sin egen type muligheder, så sørg for at tjekke hver enkelt ud.
4. Tilføj genstande
Med Elementor er du selvfølgelig også i stand til at tilføje elementer til overskriften. Klik bare på symbolet øverst til højre for at se, hvad der er tilgængeligt.
Når du redigerer en oversigtsskabelon, viser Elementor automatisk de relevante blokke øverst på listen, hvilket er mest fornuftigt under omstændighederne. I dette tilfælde er dette ting som webstedets logo, nav-menuen og webstitens titel.
Så hvis du f.eks. Vil tilføje webstittitlen ved siden af logoet, skal du bare trække og slip den på det. Den oversigtsskabelon, vi i øjeblikket har valgt, giver os imidlertid mulighed for at tilføje den over eller under logoet. Men det er et problem, der let bliver løst.
I et tilfælde som dette skal du holde markøren over overskriften og bruge plussymbolet –+-for at tilføje et afsnit ovenfor.
Klik her på den lilla knap for at vælge et tre-søjles design.
Træk derefter elementerne fra det eksisterende overskriftsafsnit ind i det nye afsnit, og tilføj webstittelen i midten.
Men vent, stilen er helt anderledes! intet problem. Bare højreklik på den eksisterende overskrift og vælg Kopi. Højreklik derefter på det nye afsnit og klik her Indsæt stil. Elementor anvender derefter stilen på det eksisterende afsnit, som du kan lukke senere.
Du kan udføre den samme proces med et hvilket som helst af de andre headerelementer og selvfølgelig med alle de andre elementer, der er inkluderet i Elementor.
Tilpas en unik postskabelon
I Elementor kan du også tilpasse en enkelt postskabelon. Sådan gør du:
1. Opret en ny model
Oprettelse af en skabelon fungerer på den sædvanlige måde. Dog vælg denne gang Single som model type. Vælg derefter den unikke skabelon, du vil redigere nedenfor. I dette eksempel Indlæg.
Hvis du vil oprette et nyt sidedesign, skal du redigere din 404-side (mere om det senere) eller redigere en brugerdefineret posttype specielt ville du vælge noget andet. I begge tilfælde skal du indtaste et navn og fortsætte.
I det næste skærmbillede kan du vælge mellem de foruddefinerede skabeloner som sædvanligt. Men i dette tilfælde ønsker vi at oprette en ny model fra bunden. Så klik på X øverst til højre for at lukke dette vindue.
2. Konfigurer forhåndsvisningen
Sæt derefter forhåndsvisningsvinduet til et eksisterende indlæg. Du kan gøre dette ved at klikke på øjeikonet i bunden af redigeringsindstillingerne Indstillinger.
I den menu, der åbnes, under Eksempel dynamisk indhold, vælg Offentliggøre. Derefter kan du på den næste linje søge og vælge et eksisterende indlæg med navn.
Når du har gjort det, skal du trykke på Indløs & Eksempel. Selvom du ikke kan se noget på dette tidspunkt (da der ikke er noget på siden), vil det fortælle Elementor at bruge dataene i dette indlæg fra nu af. Du vil snart se, hvad det betyder.
3. Lad os oprette afsnittet ovenfor
Først opretter vi afsnittet ovenfor. Her finder du normalt ting som posttitel og metadata som forfatter, dato og kategori.
Det første trin er at klikke på skiltet + og oprette et enkelt kolonnesnit.
Når du gør det i layoutafsnittet, har du muligheden for at kontrollere dens bredde, højde, placering og stil. I dette tilfælde er der ikke meget at gøre her. Bare rolig, du kan altid gå tilbage og foretage ændringer senere.
Træk derefter posttitelwidgeten til det nye afsnit.
Når du gør det, skal du sørge for at bruge alle de tilgængelige indstillinger til at justere design og layout til din smag. Her er f.eks. Mine indstillinger for at gøre det:
Der er også en sej funktion, som du bør lære. Når du klikker på nøglesymbolet for postens titel, kan du tilføje statisk indhold før og efter dine dynamiske data.
Hvis du f.eks. Opretter en skabelon til en bestemt postkategori, f.eks. Nyheder eller opskrifter, kan du tilføje den til postens titel som denne:
På den måde vises disse data for hvert indlæg i den kategori. Jeg vil ikke bruge dette på dette tidspunkt, men troede, at det var en vigtig side note for dig.
Under titlen på indlægget indsætter vi Indlæg INFO widget for at se postens metadata.
Her er de indstillinger, jeg bruger:
Derudover brugte jeg stylingsindstillingerne for at få designet til at passe til resten af siden. Sørg for, at du gør det samme.
4. Indstil stolpen
Efter overskriften er det tid til at oprette brødteksten på siden. Hvis du vil have, at denne del skal have et andet design end overskriften, skal du oprette et nyt afsnit. Dog holder jeg det simpelt, så jeg behøver ikke.
Den første ting, vi vil indsætte, er det fremhævede billede. Til dette kan du placere widget'en med det samme navn under det, der allerede findes på siden.
Jeg ændrede stort set ikke nogen af indstillingerne, jeg lod bare alt være som det var.
Så er det tid for indholdet at sende. Også her har du en tilsvarende blok.
Du vil bemærke, at Elementor automatisk trækker det, der allerede findes på webstedet, for det fremhævede billede og postindhold. Foretag eventuelle justeringer af designet til den nye blok, du har brug for, for eksempel når du spiller med de typografiske indstillinger.
Bortset fra det er det alt sammen. Ikke for meget arbejde at gøre her, så vi kan gå videre til den sidste del.
5. Konfigurer sidefoden
I dette tilfælde ønsker vi, at sidefoden skal vise forfatterens profil, delingsindstillinger og læserkommentarer. For at gøre dette skal vi først oprette et nyt afsnit med to kolonner. For at skabe mere plads til forfatterprofilen kan du indstille den til et 66.33-layout.
Efter dette sted widget'en Forfatterboks i det venstre afsnit.
Sørg for at tilpasse stilen, så den passer til dine behov. Jeg tilføjede lidt baggrundsfarve og justerede indstillingerne for typografi lidt.
Derefter er det tid til at tilføje blokering af deleknapper på højre side.
Du kan se mine indstillinger på skærmbilledet ovenfor.
Derefter er det eneste, der er tilbage, at oprette en sektion endnu en kolonne ned og trække og slippe widgetten Post Kommentarer ind i den.
(Forresten, hvis du nogensinde har problemer med at finde nogen af disse widgets, skal du bare bruge søgefunktionen).
Foretag eventuelle justeringer af det kommentarafsnit, du føler dig nødvendigt (jeg lod det være som det er), og du er klar til at sende. Her er det færdige design:
Tilpas arkivskabelonen
1. Konfigurer din WordPress arkivskabelon
På nuværende tidspunkt kender du allerede løsningen på at oprette nye modeller. Den eneste forskel er, at du i dette tilfælde vælger Arkiv som model type.
Derefter får du som normalt et antal blokke at vælge imellem, eller du kan også oprette din egen model fra bunden. For arkiver har du imidlertid kun to widgets Elementor, som alligevel er vigtige.
2. Definer titlen på arkivet
Den første blok, jeg vil tale om, er arkivtitlen Arkiv titel.
Ud over de sædvanlige indstillinger under Stil og avanceret, kan du finde en vigtig mulighed, når du klikker på nøglesymbolet under Titel.
Her kan du aktivere og deaktivere, om Elementor viser arkivtypen på siden som den del, hvor der står Forfatter: nedenfor. Dette sker via knappen under Inkluder kontekst.
Forresten kan du som sædvanlig forhåndsvise forskellige arkiver ved hjælp af preview-indstillingerne (Eye Symbol> Settings). På denne måde kan du se designet til unikke kategorier, tags, forfattere og mere. Husk det.
3. Brug arkivpublikationer
Den anden vigtige widget til arkiver er Arkivindlæg. Dette bringer alle de poster, der hører til ethvert arkiv på en side. Når du vælger en skabelon, er de allerede der, men du kan også nemt tilføje dem selv med denne blok.
Lad os se på de muligheder, det giver dig at tilpasse dine arkivsider:
- hud - Vælg at vise dine indlæg i et klassisk eller kort stil design.
- Kolonner - Bestemmer antallet af kolonner, hvor dine indlæg vises.
- Vis billede - Aktivér fremhævede billeder på arkivsider
- Murværk – Viser emner i murværk eller ej.
- Billedstørrelse - Størrelsen på billedet Elementor skal bruges på arkivsider.
- Titel - Vil du vise posttitler eller ej?
- Titel HTML-tag - I bekræftende fald, hvilket HTML-tag skal pakkes rundt om det?
- Uddrag - Inkluder uddrag fra dine indlæg eller vis kun titlen.
- Uddrag Længde - Bestem længden af ekstrakterne.
- Metadata - Definerer postmetadata, der er tilgængelige for besøgende.
- Separator mellem - Separatorsymbol mellem metadataoplysninger.
- Læs mere - Inkluder et "læs mere" -link, ja eller nej?
- Badge - Gør det muligt at tilføje flere oplysninger til indlæg, f.eks. Kategorier og tags.
- Taxonomi-badge - Her kan du beslutte, hvilke oplysninger der skal inkluderes.
- Avatar – Hermed kan du ændre profilbilledet på forfatterne til artiklerne
Ud over ovenstående har du et par flere muligheder. Under Personsøger du kan definere, hvordan arkivering af sider skal håndteres. For eksempel, hvordan det vises, antallet af sider, der skal inkluderes, og justeringen af teksten.
Endelig Avanceret giver dig mulighed for at indstille beskeden til at blive vist, når en besøgende lander på et tomt arkiv. Alt andet burde være bekendt. Bemærk blot, at stilmulighederne ændrer sig afhængigt af den hud, du har valgt.
4. Kontroller antallet af publikationer pr. Arkiv
En hurtig note om arkivskabeloner. For at ændre antallet af poster, der vises i et arkiv (eller på din blogside), skal du gøre det i WordPress under Indstillinger> Læsning.
Her skal du blot indtaste antallet af indlæg, du vil have dine besøgende til at se.
personalisering facile WordPress-tema med Elementor
Tilpasning af WordPress-temaer er brød og smør for mange professionelle. Selvom dette normalt involverer en masse kodning og redigering af filer, er dette ikke længere nødvendigt med Elementor.
Som du så ovenfor, er plugin en fuldgyldig WordPress-temaditor. Det giver dig mulighed for at tilpasse hver del af det fra dens brugergrænseflade. Du kan redigere webstedets header, sidefod, side- og postskabeloner, arkivskabeloner med mere.
Med muligheden for at bruge dynamisk indhold og forhåndsvise en hvilken som helst del af dit websted, kan du implementere alle de trendy tilpasninger
Kort sagt, Elementor gør det nemt at tilpasse dit WordPress-tema. I stedet for omhyggeligt at foretage ændringer med snesevis af filer og hundreder af kodelinjer, kan du hurtigt gøre det hele ét sted.
Hent Elementor Pro nu!
Konklusion
Der er det ! Det er det for denne artikel, der viser dig, hvordan du tilpasser et WordPress-tema med Page Builder Elementor. Hvis du er i tvivl om, hvordan du kommer dertil, så lad os det vide inden for kommentarer.
Du kan dog også konsultere vores ressourcer, hvis du har brug for flere elementer til at udføre dine projekter med oprettelse af internetsider ved at konsultere vores guide om WordPress blog oprettelse eller den ene på Divi: tidenes bedste WordPress-tema.
Men i mellemtiden del denne artikel på dine forskellige sociale netværk.
...
