Hur man skapar avancerat dragspel med Elementor

Hur man skapar avancerat dragspel med Elementor

Webbplatsbesökare gillar hopfällbara avsnitt för att kontrollera snabb information och komprimera dem baserat på deras intressen. Så, snyggt anpassade avancerade dragspel hjälper till att hålla din WordPress-webbplats ren och jämna ut användarupplevelsen.

I den här guiden går vi igenom steg-för-steg-processen för hur du skapar avancerat dragspel med Elementor.

Hur man skapar avancerat dragspel med Elementor

Vad är ett dragspel?

Ett dragspel är ett hopfällbart element som låter dig dölja och avslöja innehåll på en WordPress-webbsida.
Du kan använda dragspelet för att organisera information i sektioner. Sektionerna kan utökas eller komprimeras efter behov, vilket sparar utrymme och förbättrar användarupplevelsen.

Fördelar med att använda avancerade dragspel i WordPress Site Design

⭕ Avancerat dragspel Elementor ger ett rent och organiserat sätt att presentera information.

⭕ Det kan du minska sidladdningstiderna genom att gömma mindre viktigt innehåll i dragspel. Det kan också förbättra din webbplatss sökmotorranking.

⭕ Det är enkelt att få tillgång till ytterligare information med avancerade dragspel. Så det kan det uppmuntra användare att utforska din webbplats vidare. Dragspel är också anpassningsbara till olika designstilar och layouter.

⭕ Du kan designa WordPress avancerade dragspel till tillåta användare med funktionshinder för att få tillgång till information.

Hur skapa ett avancerat dragspel i Elementor

Medan dragspelswidgeten ingår i Elementor, kan du hitta begränsade stylingalternativ. Om du letar efter mer avancerad anpassning, överväg att använda ett Elementor-tillägg. 

Här, vi har valt ElementsKit. Insticksprogrammet erbjuder en avancerad dragspelswidget som låter dig skapa en mer visuellt tilltalande och funktionell webbplats.

Hur man skapar dragspel med ElementsKit

En dragspelswidget är en typ av widget som låter dig skapa hopfällbara sektioner på din WordPress-webbplats. Det ger ett sätt att organisera innehåll i flera sektioner, som var och en kan utökas eller komprimeras för att avslöja dess innehåll. Detta används ofta för att visa information på ett kompakt och användarvänligt sätt.

Steg 1: Skaffa ElementsKit-plugin

Tillgång till WordPress-instrumentpanelen:
1. Gå till Plugins
2. Klicka på Add New Plugin
3. Sök ElementsKit
4. När du har hittat den klickar du på knappen Installera nu

Installera ElementsKit

Du kan också ladda ner ElementsKit-plugin från WordPress. org snabbt. Efter det behöver du bara ladda upp den till plugins-delen av din instrumentpanel.

Ladda ner ElementsKit-plugin

Dock, Advanced Accordion är en Pro-widget av ElementsKit. Var inte sen! Välj en flexibel plan och njut skapa avancerade dragspel med lätthet.

Steg 2: Aktivera plugin-programmet

När du har installerat plugin-programmet måste du aktivera det.

Aktivera ElementsKit

Steg 3: Slå PÅ den avancerade dragspelswidgeten

  1. Gå till ElementsKit
  2. Hitta widgets
  3. Hitta Advanced Accordion och slå PÅ växlingsknappen
  4. Klicka på SPARA ÄNDRINGAR
Aktivera ElementsKit avancerad dragspelswidget

Steg 4: Öppna en sida från din instrumentpanel 

  1. Navigera till Pages
  2. Öppna en befintlig sida eller lägg till en ny sida
  3. Klicka på Redigera med Elementor (för den nya sidan kan du hitta det här alternativet efter att du har öppnat sidan)
Redigera din sida med Elementor

Steg 5: Lägg till Advanced Accordion i redigeraren

Sök efter namnet på widgeten, klicka på den eller dra och släpp den till redigeraren.

Dra och släpp ElementsKit avancerad dragspelswidget

Steg 6: Utforska anpassningsalternativ

I innehållsdelen ser du –

  • Dragspel:
    • Innehåll: Här kan du lägga till innehåll, redigera titeln, växla knappen 'håll detta öppet'
    • Håll den första bilden automatisk öppen: Om du vill hålla den första bilden öppen kan du aktivera den här knappen.
    • Ajax: Om du aktiverar det här alternativet kommer det bara att uppdatera relevant innehåll på dragspelet, vilket ger en smidigare användarupplevelse. Detta kan vara särskilt användbart när du har att göra med ett stort antal dragspelsföremål.
    • Stil: Det finns flera dragspelsstilar att välja mellan.
  • Ikon:
    • Ikonposition: Ställ in ikonpositionen härifrån.
    • Visa antal loopar: Du kan visa slingantalet eller hålla det dolt.
    • Höger ikon: Välj symbolen som pekar åt höger. Det indikerar expansionen av dragspelsobjektet.
    • Höger ikon aktiv: Välj en ikon för att indikera tillståndet för en högerikon när du klickar eller trycker på den.
Redigera innehållet i ElementsKit avancerade dragspelswidget

I stildelen kan du anpassa dragspelet med hjälp av dessa alternativ –

  • Titel: Här kan du ändra typografi, färg, bakgrundstyp, boxskugga, marginal-botten, etc. för titlarna.
  • Innehåll: För att styla dragspelets innehåll kan du använda olika färger, typografi, kantradie, stoppning och så vidare.
  • Gräns: För att ändra varje fliks eller dragspelets kanttyp, bredd, färg, boxskugga etc. kan du använda det här alternativet.
  • Ikon: Det låter dig justera marginalen, färgen och storleken på ikonen.
Style ElementsKit avancerad dragspelswidget

Det är det långa och korta med hur man skapar avancerat dragspel med Elementor! ✌️

Varför väljer du ElementsKit Advanced Accordion-widget framför Elementor Accordion-widget?

Låt oss veta några skillnader mellan ElementsKit Advanced Accordion och Elementor Accordion.

Det är din tur nu

Nu, prova själv! Med ElementsKit kan du effektivt innehåller exceptionellt avancerade dragspel in i din webbplats design.

Tips till dig –

⭐ Experimentera med olika anpassningsalternativ för att uppnå önskat utseende och funktionalitet du vill ha.

⭐ Tänk på din webbplatss övergripande design.

⭐ Testa den slutliga utgången på olika enheter och webbläsare.
⭐ Uppdatera dina dragspel regelbundet.

ElementsKit Elementor-tillägg

Kommentarer

Lämna ett svar

Din e-postadress kommer inte publiceras. Obligatoriska fält är märkta *