Come creare un preloader su WordPress usando Elementor

Muneeb Tutorial WordPress Nov 22, 2021

Un Preloader, noto anche come caricatore, è un'animazione o GIF semplice o complessa che continua a essere eseguita sulla pagina durante il caricamento degli altri contenuti della pagina.

È molto importante intrattenere i tuoi utenti per il breve lasso di tempo che il tuo sito Web impiega per caricare il contenuto. Non solo aiuta a trattenere molti utenti, ma consente anche di creare una presenza duratura nella mente degli utenti. In questo tutorial, capiremo come creare Preloader usando Elementor .

Come creare un preloader usando Elementor

Elementor è pieno di opzioni che ti consentono di rappresentare il tuo sito Web a un livello completamente distinto. Allo stesso modo, ti consente anche di creare Preloader utilizzando i quali puoi catturare gli utenti che rimbalzano rapidamente sul tuo sito web.

Per iniziare, assicurati di creare Preloader solo per le pagine che effettivamente richiedono alcuni istanti per caricare il contenuto ed è un aspetto importante del tuo sito web.

Create Amazing Websites

Con il miglior generatore di pagine gratuito Elementor

Parti ora

Una volta deciso in quale pagina posizionare il Preloader, trova un SVG o una GIF che si adatti al tuo sito Web e a quella particolare pagina. Icons8 è una fonte davvero famosa per l'animazione dei Preloader.

Se non sai come importare file in formato SVG su Elementor, vai avanti e dai un'occhiata al nostro tutorial .

Successivamente, ci sono due modi per utilizzare i Preloader sul tuo sito Web, utilizzandolo per una determinata pagina o utilizzandolo per l'intero sito Web.

  • Se desideri utilizzare il Preloader per l'intero sito web, crea una nuova sezione nel Modello di intestazione .
  • Se desideri utilizzare il Preloader per una determinata pagina, crea una nuova sezione nella parte superiore della pagina .

In entrambi i casi, assicurati di modificare le impostazioni della sezione su No Gap .

Nel complesso, quando hai finito con le impostazioni, vai alla scheda Elementi a sinistra dello schermo e scegli HTML .

Nel campo HTML, aggiungi il seguente codice assicurandoti di modificare l' URL del preloader con il tuo.

>div class="loader" /divscript/scriptstyle/style

La codifica ha una spiegazione di commento per i principianti per apportare una sorta di modifica se necessario.

Infine, vai avanti e pubblica il tuo Preloader e controlla se funziona perfettamente. Ecco come puoi creare un Preloader con Elementor sul tuo sito Web WordPress.

Ci auguriamo che questo tutorial ti aiuti a fidelizzare gli utenti del tuo sito Web e a renderlo molto più professionale. Questo è tutto da noi per questo tutorial. Assicurati di unirti a noi su Twitter e Facebook per rimanere aggiornato sui nostri contenuti.

Divi WordPress Theme