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

Guarda la videoguida:

Steps to Use ElementsKit Sticky Content:

• Vai a ElementsKit → Moduli → Enable Contenuto appiccicoso → 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:

Abilita il modulo Contenuto permanente #

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 Sotto ElementsKit collegare
2. Go to MODULES
3. Toggle the Sticky Content module SU
4. Clicca su Salvare le modifiche

Steps 2: Sticky on Top #

Questa funzione ti aiuterà a incollare qualsiasi sezione nella parte superiore della pagina.

Guarda la nostra videoguida:

Oppure segui le istruzioni passo passo:

• Navigare verso ElementsKit→ Piè di pagina intestazione→ clic Modifica con Elementor.

• Crea una nuova pagina-> Fai clic su Icona del kit di elementi per inserire qualsiasi pagina già pronta dai nostri modelli predefiniti.

1. Clicca sul Icona della sezione interna.
2. Vai a Avanzate
3. Espandi ElementsKit Sticky.
4. Seleziona l'opzione Permanente➔ Superiore dal menu a discesa

• Ora vai alla tua pagina-> Puoi vedere che la tua intestazione è appiccicosa in alto.

Cambiamento del colore dello sfondo dell'adesivo in alto #

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.

• Scegli un colore di sfondo appiccicoso: Blue.
• Fare clic su Aggiorna

Appiccicoso fino in cima #

Se vuoi che le tue sezioni siano permanenti su più sezioni e smettano di essere permanenti dopo una sezione specifica, puoi impostare l'ID della sezione qui. Rendiamolo permanente fino alla sezione Chi siamo.

• Clicca su Modifica con Elementor.

1. Clicca sul Our School Goals 2019 inner section icon
2. Vai su Avanzate
3. Find Layout

Impostare il CSS ID and Copy it.

• Vai a Intestazione➔Avanzate➔Elementskit Sticky➔Appiccicoso fino a quando.
• Ora incolla la sezione "Chi siamo". ID CSS dentro Appiccicoso fino a quando campo.

• Ora puoi vedere l'intestazione is Sticky Until the Our School Goals 2019 Section.

Funzionalità di aggiunta classe #

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. Vai al personalizzatore-> CSS aggiuntivi.
2. Utilizza la classe: “effetti-ekit-sticky” e imposta il colore dello sfondo Grigio.

• Vai all'intestazione-> Rimuovi il file Colore di sfondo.
• Aggiungi compensazione. Ad esempio: 50px.

• Puoi vedere il colore dello sfondo Trasparente. Ma dopo aver effettuato lo scorrimento fino a 50 px, viene aggiunto un colore di sfondo.

Offset appiccicoso in alto #

• Puoi decidere la quantità di spazio da lasciare mentre il contenuto o l'immagine rimarranno appiccicati in alto. Puoi fare lo stesso per altre posizioni difficili. Fornisci l'offset fisso: 100px. Puoi vedere che l'intestazione viene visualizzata dopo 100 px.

• Sono disponibili tre opzioni di scelta del dispositivo per visualizzare lo sticky: Tutti i dispositivi, Solo desktop, Desktop e tablet. Scegli un'opzione per decidere esattamente su quali dispositivi desideri mostrare il contenuto come appiccicoso.

Mostra permanente su Scorri verso l'alto #

Questa funzione ti aiuterà a mantenere qualsiasi sezione della pagina quando scorri verso l'alto.

Guarda la nostra videoguida:

Oppure segui le istruzioni passo passo:

• Go back to ElementsKit Appiccicoso opzioni.

• Seleziona l'opzione permanente➔ Mostra su Scorri verso l'alto dal menu a discesa.

Fai clic su Aggiorna-> Vai alla tua pagina->Aggiorna-> Scorri verso l'alto.

Puoi vedere che l'intestazione è fissa quando scorri verso l'alto.

Sticky fino allo scorrimento verso l'alto #

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

• Click on the sticky Care About Us Icona della sezione interna.
• Now, going to the Layout settings from Advanced tab, impostare il ID CSS e copialo.

• Fare clic sull'intestazione di navigazione fissa Icona della sezione interna.
• Vai a Avanzate
• Trovare Elementskit Sticky and paste that sticky header section’s ID CSS dentro Appiccicoso fino a quando campo.

• Fai clic su Aggiorna-> Vai alla home page-> Aggiorna-> Scorri verso l'alto.
• Ora puoi vedere che l'intestazione è fissa finché la sezione dell'intestazione fissa e quando la sezione video arriva nell'intestazione non è più fissa.

Appiccicoso sul fondo #

Questa funzione ti aiuterà a incollare qualsiasi sezione nella parte inferiore della pagina.

Guarda la nostra videoguida:

Oppure segui le istruzioni passo passo:

• Clicca sul Icona del kit di elementi per inserire qualsiasi piè di pagina dai nostri modelli predefiniti.

Vai a Elementi ➔ Trascina i seguenti widget e rilasciali nell'area selezionata.

• Intestazione.
• Logo del cliente.
• video.
• Intestazione.

• Clicca sul Icona della sezione interna del piè di pagina.
• Vai a Avanzate-> Espandi ElementsKit Sticky.
• Seleziona l'opzione permanente➔ Metter il fondo a dal menu a discesa.

• Fai clic su Aggiorna-> Vai alla tua pagina->Aggiorna-> Scorri verso l'alto.
• Puoi vedere che il piè di pagina è appiccicoso quando scorri verso l'alto.

Appiccicoso fino al fondo #

Rendiamolo appiccicoso fino alla sezione appiccicosa inferiore.

• Clicca sul Fondo appiccicoso Icona della sezione interna.
• Ora, andando nelle Impostazioni avanzate, imposta il file ID CSS e copialo.

• Fare clic sul piè di pagina Icona della sezione interna.
• Vai a Avanzate➔ Elementskit Sticky➔ Appiccicoso fino a quando.
• Ora incolla la sezione adesiva in basso ID CSS dentro Appiccicoso fino a quando campo.

• Fai clic su Aggiorna-> Vai alla home page-> Aggiorna-> Scorri verso l'alto.
• Ora puoi vedere che l'intestazione è fissa finché la sezione fissa inferiore e quando la sezione del logo del cliente arriva nel piè di pagina non è più fissa.

Appiccicoso sulla colonna #

Questa funzione ti aiuterà a incollare qualsiasi sezione sulla colonna.

Guarda la nostra videoguida:

Oppure segui le istruzioni passo passo:

• Seleziona la tua struttura dall'area selezionata. Qui sto prendendo 3 colonne.

Vai a Elementi ➔ Trascina i seguenti widget e rilasciali nell'area selezionata.

• Intestazione.
• Immagine.
• Casella delle icone.

Rendiamo permanente la sezione dell'intestazione e dell'immagine.

• Clicca sul Icona della sezione interna dell'intestazione.
• Vai a Avanzate-> Espandi ElementsKit Sticky.
• Seleziona l'opzione permanente➔ Colonna dal menu a discesa.

• Clicca sul Icona della sezione interna dell'immagine.
• Vai a Avanzate-> Espandi ElementsKit Sticky.
• Seleziona l'opzione permanente➔ Colonna dal menu a discesa.

• Fai clic su Aggiorna-> Vai alla tua pagina->Aggiorna-> Scorri verso il basso.
• Puoi vedere che l'intestazione e l'immagine sono appiccicose e il lato destro del contenuto della casella dell'icona è ancora in movimento.