De Sticky Content module of ElementsKit lets you make any section of the page or post sticky to a selected position.

Se videoguiden:

Steps to Use ElementsKit Sticky Content:

• Gå till ElementsKit → Moduler → Enable Klibbigt innehåll → Save.
• Open page in Elementor.
• Select section/column/widget → Advanced → ElementsKit Sticky.
• Choose Sticky Type (Top / Bottom / Scroll Up / Column).
• Set Offset, Sticky Until (CSS ID), Background if needed.
• Update and test on devices.

Follow the module’s detail functions:

Aktivera Sticky Content Module #

To start using the Sticky Content module, the first thing you should do is to enable this from the list of ElementsKit modules. Go to ElementsKit from your dashboard and follow the steps:

1. ElementsKit under ElementsKit plugin
2. Go to MODULES
3. Toggle the Sticky Content module PÅ
4. Klicka på Spara ändringar

Steps 2: Sticky on Top #

Den här funktionen hjälper dig att hålla fast vilken sektion som helst högst upp på sidan.

Se vår videoguide:

Eller följ instruktionerna steg för steg:

• Navigera till ElementsKit→ Sidhuvud Sidfot→ klick Redigera med Elementor.

• Skapa en ny sida-> Klicka på ElementsKit-ikonen för att infoga valfri färdig sida från våra färdiga mallar.

1. Klicka på Ikon för inre avsnitt.
2. Gå till Avancerad
3. Expandera ElementsKit Sticky.
4. Välj Sticky-alternativ➔ Topp från rullgardinsmenyn

• Gå nu till din sida-> Du kan se att din rubrik är klibbig på toppen.

Bakgrundsfärgförändring av Sticky på toppen #

You can change the background color whenever you need. Under the Sticky Until feature, you can find the option to change the background color of the sticky section.

• Välj en klibbig bakgrundsfärg: Blue.
• Klicka på Uppdatera

Sticky Tills på toppen #

Om du vill göra dina sektioner klibbiga upp till flera sektioner och sluta klibbiga efter en specifik sektion, kan du ställa in det sektions-ID här. Låt oss göra det klibbigt tills avsnittet Om oss.

• Klicka på Redigera med Elementor.

1. Klicka på Our School Goals 2019 inner section icon
2. Gå till Avancerat
3. Find Layout

Ställ in CSS ID and Copy it.

• Gå till Rubrik➔Avancerad➔Elementskit Sticky➔Sticky Tills.
• Klistra nu in det om oss avsnitt CSS ID in i Sticky Tills fält.

• Nu kan du se rubriken är Sticky Until the Our School Goals 2019 Section.

Klass Lägg till funktion #

ElementsKit provides you another option and that is a class adding feature. If you scroll down for example 50px, a new class will be added and that is “ekit-sticky-effects”. Using this class you can make any CSS you want. Let’s see how you can do it.

1. Gå till Customizer-> Ytterligare CSS.
2. Använd klassen: "ekit-sticky-effekter" och gör bakgrundsfärgen Grå.

• Gå till rubrik-> Ta bort Bakgrundsfärg.
• Lägg till offset. Till exempel: 50px.

• Du kan se bakgrundsfärgen är Transparent. Men efter att ha rullat upp till 50px läggs en bakgrundsfärg till.

Klibbig offset på toppen #

• Du kan bestämma hur mycket utrymme som ska lämnas medan ditt innehåll eller din bild ska vara klibbig på toppen. Du kan göra samma sak för andra klibbiga positioner. Ange den klibbiga offset: 100px. Du kan se rubriken visas efter 100px.

• Det finns tre enhetsalternativ för dig att visa sticky: Alla enheter, endast stationära datorer, stationära och surfplattor. Välj ett alternativ för att bestämma exakt i vilken eller vilka enheter du vill visa innehållet som klibbigt.

Visa Sticky på Scroll Up #

Den här funktionen hjälper dig att hålla fast vid vilken del av sidan som helst när du rullar uppåt.

Se vår videoguide:

Eller följ instruktionerna steg för steg:

• Go back to ElementsKit Sticky alternativ.

• Välj klibbigt alternativ➔ Visa på Scroll Up från rullgardinsmenyn.

Klicka på Uppdatera-> Gå till din sida->Uppdatera-> Scrolla upp.

Du kan se att rubriken är klibbig när du rullar uppåt.

Sticky Tills på Scroll Up #

Let’s make it sticky until the Care About Us Section.

• Click on the sticky Care About Us Ikon för inre avsnitt.
• Now, going to the Layout settings from Advanced tab, ställ in CSS ID och kopiera det.

• Klicka på den klibbiga navigeringsrubriken Ikon för inre avsnitt.
• Gå till Avancerad
• Hitta Elementskit Sticky and paste that sticky header section’s CSS ID in i Sticky Tills fält.

• Klicka på Uppdatera-> Gå till hemsidan-> Uppdatera-> Scrolla upp.
• Nu kan du se att rubriken är Sticky Tills den klibbiga rubriksektionen och när videosektionen kommer in är rubriken inte längre klibbig.

Klibbig på botten #

Den här funktionen hjälper dig att hålla fast vilken sektion som helst längst ner på sidan.

Se vår videoguide:

Eller följ instruktionerna steg för steg:

• Klicka på ElementsKit-ikonen för att infoga valfri sidfot från våra färdiga mallar.

Gå till Element ➔ Dra följande widgets och släpp på det valda området.

• Rubrik.
• Kundlogotyp.
• Video.
• Rubrik.

• Klicka på Sidfot Inner Sektion Ikon.
• Gå till Avancerad-> Expandera ElementsKit Sticky.
• Välj klibbigt alternativ➔ Botten från rullgardinsmenyn.

• Klicka på Uppdatera-> Gå till din sida->Uppdatera-> Scrolla upp.
• Du kan se att sidfoten är klibbig när du rullar uppåt.

Klibbig tills på botten #

Låt oss göra det klibbigt tills den nedre klibbiga delen.

• Klicka på Botten Sticky Ikon för inre avsnitt.
• Gå nu till Avancerade inställningar och ställ in CSS ID och kopiera det.

• Klicka på sidfoten Ikon för inre avsnitt.
• Gå till Avancerad➔ Elementskit Sticky➔ Sticky Tills.
• Klistra nu in den nedre klibbiga delen CSS ID in i Sticky Tills fält.

• Klicka på Uppdatera-> Gå till hemsidan-> Uppdatera-> Scrolla upp.
• Nu kan du se att sidhuvudet är Sticky Tills den nedre klibbiga sektionen och när klientlogotypen kommer in är sidfoten inte längre klibbig.

Sticky på kolumn #

Den här funktionen hjälper dig att fästa vilken sektion som helst i kolumnen.

Se vår videoguide:

Eller följ instruktionerna steg för steg:

• Välj din struktur från det valda området. Här tar jag 3 kolumner.

Gå till Element ➔ Dra följande widgets och släpp på det valda området.

• Rubrik.
• Bild.
• Ikon Box.

Låt oss göra rubriken och bilddelen klibbig.

• Klicka på Rubrik Inner Sektion Ikon.
• Gå till Avancerad-> Expandera ElementsKit Sticky.
• Välj det klibbiga alternativet➔ Kolumn från rullgardinsmenyn.

• Klicka på Bild Inner Sektion Ikon.
• Gå till Avancerad-> Expandera ElementsKit Sticky.
• Välj det klibbiga alternativet➔ Kolumn från rullgardinsmenyn.

• Klicka på Uppdatera-> Gå till din sida-> Uppdatera-> Scrolla ner.
• Du kan se rubriken och bilden är klibbiga och innehållet på höger sida av ikonrutan rör sig fortfarande.