Tips til at fremskynde designprocessen med Elementor

Tips til at fremskynde designprocessen med Elementor

Det er ingen hemmelighed, at Elementor er en af ​​de bedste sidebygere i WordPress-samfundet i dag. Og det er ikke længere bare en sidebygger. Elementor har udviklet sig så meget, at du kan designe fuldt fungerende websteder, selv med et gratis, grundlæggende WordPress-tema uden at skrive en enkelt kodelinie!


Selvom Elementor tilbyder mange indstillinger og tilpasningsmuligheder, går vi ofte glip af plugins mindre detaljer og dele, der kan have stor indflydelse på designprocessen på et websted.

Det er allerede hurtigt og nemt at designe websider med Elementor, men hvis du vil fremskynde designprocessen, er du på det rigtige sted. I denne artikel lærer du, hvordan du kan fremskynde designprocessen med Elementor ved fuldt ud at bruge redigereren med tredjepartsværktøjer.

Start med Premade-skabeloner

Premade-skabeloner kan fremskynde udviklingen af ​​dit projekt. At designe nye sider fra bunden tager tid, og oftere end ikke mister du den tid, mens du konstant justerer sidens layout og stilarter. Det er præcis, hvor skabeloner kommer godt med. Elementors skabelonbibliotek er en stor ressource til at fremskynde designprocessen. Selv hvis du ikke bruger en forhåndsindstillet skabelon, kan du altid bruge skabelonbiblioteket som inspiration. Skabeloner kan let importeres direkte på siden med et enkelt klik.

Elementorskabeloner kan opdeles i to dele. Først når du f.eks. Vil importere en forhåndsindstillet side fra top til bund, kan du importere en hel side (som en Om eller Kontakt side) med alt dets indhold. Den anden mulighed er, hvis du bare vil importere en sektion eller blok af designet. Du kan gøre dette, hvis du for eksempel kan lide en af ​​sektionerne fra tjenester, helt, kontakte os eller abonnere sektioner.

Vidunderlige gratis og premium samlinger af skabeloner er let tilgængelige på nettet.

Envato marked

Envato marked

Envato-markedet er sandsynligvis den mest populære markedsplads ikke kun for Elementor-skabeloner, men til WordPress-temaer og plugins.

Template Monster

Template Monster

TemplateMonster er en anden udbyder af skabelonaktiver af god kvalitet, de har også nogle gratis skabeloner.

Elementor-skabelonbibliotek

Elementor-skabelonbibliotek

Elementor-skabelonbibliotek – Er oprindeligt skabelonlager til Elementor, nye nye og Premium-skabeloner vises meget ofte.

Brug hurtigtaster

Hvis du arbejder med Elementor med bare din mus, skal du stoppe! Brug 10 minutter på at lære kortkoder, hvilket sparer dig masser af tid og fremskynder designprocessen på dit websted. Bortset fra de enkle som kopier og indsæt, kan du også bruge mere avancerede brugerdefinerede genveje. De kan være ekstremt nyttige, især hvis du vil navigere mellem panelet og preview-tilstanden eller skifte til mobilredigering.

Her er en liste over genveje, der seriøst kan øge hastigheden ved at designe dit websted:

Handlinger

FortrydCtrl / Cmd + ZFortryd enhver ændring foretaget på siden
RedoCtrl / Cmd + Skift + ZGentag enhver ændring foretaget på siden
KopiCtrl / Cmd + CKopier et afsnit, en kolonne eller en widget
sæt indCtrl / Cmd + VIndsæt en sektion, kolonne eller widget
Indsæt stilCtrl / Cmd + Skift + VIndsæt et afsnit, en kolonne eller widgetens stil
SletSletSlet en sektion / kolonne / widget, der er redigeret
DuplikereCtrl / Cmd + DKopier en sektion / kolonne / widget, der er redigeret
GemmeCtrl / Cmd + SGem din side i revisionshistorikken

Gå til

Panel / EksempelCtrl / Cmd + PSkift mellem panelet og preview-visningen
MobilredigeringCtrl / Cmd + Skift + MSkift mellem desktop, tablet og mobilvisninger
HistorieCtrl / Cmd + Skift + HGå til historikpanelet
NavigatorCtrl / Cmd + IÅbner navigatoren
SkabelonbibliotekCtrl / Cmd + Skift + LÅbner vores skabelonbibliotek modal
TastaturgenvejeCtrl / Cmd + ?Åbner vinduet Hjælp til tastaturgenveje
AfslutESCÅbner indstillinger og springer til Afslut til Dashboard

Tilpasset CSS til sider

Vidste du, at du kan have tilpasset CSS til hver side? Ja, men bemærk, at denne funktion kun er inkluderet i Pro-versionen af ​​Elementor. Som en løsning på dette viser jeg dig, hvordan du inkluderer en tilpasset CSS til hver side. Dette trick sparer dig penge, hvis du ville have Pro-versionen bare til at tilføje små tilpasninger på sideniveau.

For at gøre dette, skal du blot bruge HTML-widgeten og dette kodestykke inde:

Se på dette eksempel:

Brugerdefineret kode

Elementor Finder-søgelinje

Meget ofte, når du arbejder med sidedesign, vil du hoppe til andre sider, indstillinger, en salgsside eller andre steder, og det kan være tidskrævende, hvis du: gemmer siden> gå tilbage til dit betjeningspanel> åbne sider > søg efter den side, du vil åbne. Dette kan spilde en masse tid og energi, hvis du skulle gøre det gang på gang.

Heldigvis har Elementor en indbygget løsning til at strømline og fremskynde designprocessen. I stedet for at gennemgå alle de problemer, kan du blot bruge Elementor Finder. Du kan direkte hoppe til alle indstillinger, skabeloner, sider eller en temadel ved at søge i søgefeltet. Finder kan fås ved at klikke på Cmd / Ctrl + E-tasterne hvor som helst i WordPress-instrumentbrættet. Tjek denne video for at se alt hvad du kan gøre med Finder.

Brug Navigator

Navigator er et vindue med navigationstræ, der giver nem adgang til alle elementer i sidebyggeren. Dette lille vindue giver dig mulighed for at navigere gennem elementerne og trække og slippe widgets let.

Navigator er især nyttig til lange sider eller sider med komplekst flerlagsdesign og til elementer, der kombinerer Z-indekset minus en margin, absolut position osv. Det giver dig adgang til elementhåndtag, der kan placeres bag andre elementer.

Du kan få adgang til Navigator på en af ​​tre enkle måder:

  1. Højreklik på ethvert element og klik derefter på Navigator. Dette vil automatisk omdirigere dig til det specifikke element i navigationstræet.
  2. Klik på elementsknappen i panelets sidefod.
  3. Brug Cmd / Ctrl + I-tastaturgenvejen.

Se på denne video for at se den i handling:

Navigator har også nogle andre funktioner, såsom navngivning af widgets, sammenbrud og udvidelse af widgets, flydning eller docking af panelet og visning eller skjuling af widgets. Du kan se en komplet anmeldelse i deres dokumentation.

Definer din farvepalet

Når vi designer et websted, følger vi typisk et designmønster oprettet af designeren. Dette mønster indeholder normalt en kombination af farver, der gentages på hele webstedet. Dette er mærkefarver, der skal forblive uændrede. Dette betyder, at hver gang vi tilføjer en ny widget på siden, skal vi kopiere-indsætte farvekoden, eller vi skal huske, hvad farvekoden er for at anvende den i widgetindstillingen. Det kan være tidskrævende at gøre dette. Heldigvis har Elementor en løsning for os.

Du kan definere dine mærkefarver i Color Picker-indstillingerne og genbruge dem, hver gang du får adgang til farveindstillinger til widget-styling. Vælg bare en forudindstillet palet eller definer dine egne brugerdefinerede farver for at spare tid, når du designer.

Se på denne video:

Premade og genanvendelige widgetformater og skabeloner

Elementor er en af ​​de bedste sidebygere, men har du tænkt på standard og grimme knapper? Tabs? Menuer? Eller nogen anden widget? Disse standardwidgets ser ud som om de er designet for flere år siden, eller måske ønskede du at genbruge widget, du har stylet i projekt A i Projekt B?

I øjeblikket er du ikke i stand til at gemme og genbruge widget-stilarter til fremtidige projekter med Elementor. Heldigvis er det gratis WunderWP plugin tilbyder et par måder at løse dette problem på.

For det første inkluderer WunderWP et antal forudindstillede widgetformater til din rådighed. Readymade-stilarter til overskrifter, gallerier, knapper, afdelere, karruseller, formularer, prisborde med mere er tilgængelige med et klik. Træk blot en Elementor-widget på din side, vælg en readymade WunderWP-widgetstil og begynd at tilføje indhold.

WunderWP forudindstillinger

Med WunderWP kan du også nemt gemme og genbruge dine egne widget-stilarter i Elementor. Det er enkelt: stiliser en widget, gem den i WunderWP Cloud (som er gratis!) Og brug den senere til lignende widgets. Dette fungerer for både enkle og komplicerede widgets. For eksempel kan du bruge dette til at gemme en overskriftswidget, der indeholder forskellige typografiske værdier eller til en billedwidget med tilpassede drop skygger.

WunderWP brugerdefinerede stilarter

Det samme gælder skabeloner – du kan gemme hele eller delvis skabeloner, du opretter i WunderWP Cloud. Skabelonen vil være der, så når du er klar, kan du nemt indsætte den på en side eller et websted. På denne måde behøver du kun at opbygge den én gang, hvilket sparer dig meget tid.

WunderWP brugerdefineret skabelon

Eller du kan drage fordel af WunderWPs skabeloner til readymade indhold Lige nu er der over 50 readymade sektionsskabeloner – såsom kontakt, opfordring til handling, header, sidefod, tjenester, om, team, tjenester, nedtælling og meget mere – til en række forskellige formål.

WunderWP Premade Template

Afslutter

Indtil dette øjeblik, uden tvivl om, er Elementor en af ​​de bedste WordPress-sideopbyggere derude. Næsten hver dag tilføjes nye værktøjer og funktioner til strømline og fremskynde designprocessen og fremskynde projektets leveringstid.

Hvilket tip synes du er det mest nyttige, og hvilket du ikke kendte før? Måske ved du også noget, der ikke er nævnt her? Del det venligst med andre.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map