Hai problemi a iniziare con il Plugin elementor ? Ecco la guida completa su come utilizzare Elementor

Oggi ti mostreremo come utilizzare Elementor per creare pagine e blocchi per il tuo sito web.

I page builder sono diventati parte integrante dello sviluppo web per coloro che hanno poca o nessuna esperienza nel web design.

Uno dei page builder più popolari è Elementor, disponibile gratuitamente e con più funzionalità in modalità premium.

Come usare Elementor

In questo articolo, spiegheremo perché pensiamo che Elementor sia il page builder perfetto con cui iniziare:

Conoscere Elementor

L'incontro iniziale dell'utente con il tuo sito Web lascia un'impressione duratura. Sia che tu abbia optato per uno stile retrò o minimalista o che tu abbia messo in comune le tue risorse per creare una visione di come saranno le pagine web in futuro, in entrambi i casi un generatore di pagine WordPress come Elementor è quello che ti consente di personalizzare il tuo sito Web senza alcuna codifica .

È essenziale installare prima un tema WordPress compatibile con Elementor.

Leggi anche: Puoi usare Elementor senza un tema? (No - Ecco perché)

Ai vecchi tempi, progettavi il tuo sito web utilizzando le opzioni di design disponibili offerte dal tuo tema. Ma alcuni temi mancavano di alcune funzionalità di personalizzazione, altri erano goffi ed estremamente difficili da personalizzare per ogni pagina.

Il generatore di pagine Elementor ti consente di apportare modifiche al tuo sito Web in tempo reale senza dover passare dal frontend al backend per verificare come sono state implementate le nuove modifiche.

Puoi installare Elementor visitando il tuo proprio sito web e successivamente caricando il file zip sul tuo WordPress o navigando nel repository di plugin di WordPress e cercando "Elementor" e facendo clic su Installer.

Assicurati di attivare il plug-in e sarai pronto per esplorare tutte le opzioni che Elementor ha da offrire.

Leggi anche: Come installare Elementor

Le funzionalità che Elementor ha da offrire

Fortunatamente, Elementor è un editor frontend, il che significa che puoi vedere le modifiche avere effetto nel momento e apportare modifiche.

Un altro vantaggio indiretto è che, grazie alla sua popolarità, non mancano le risorse disponibili sul sito Web YouTube o WordPress per iniziare. Questo articolo è un caso illustrativo di questi siti web.

La personalizzazione su Elementor riguarda i widget e una volta che ti sarai abituato a trascinare e rilasciare i tuoi widget sulla pagina, scoprirai perché è molto meglio che gestire il generatore di pagine predefinito del tuo tema WordPress.

Inserisci un widget pulsante Paypal

Ogni pagina su WordPress è composta da sezioni e questa è la base della creazione di pagine con Elementor.

C'è un menu hamburger sul lato sinistro dello schermo che ti consente di apportare modifiche all'intero sito Web mentre le modifiche si riflettono sul lato destro.

La funzione di trascinamento della selezione consente un'esperienza di creazione di pagine Web più veloce che ricorda uno strumento di progettazione.

L'unico motivo per cui avrai bisogno di un tema è perché il tuo sito Web non può funzionare senza un tema e Elementor non avrebbe nulla da cambiare senza uno.

Lire Puoi usare Elementor senza un tema? (No - Ecco perché)

Inoltre, hai ancora bisogno del tema per cambiare intestazione e piè di pagina se prevedi di rimanere con la versione gratuita di Elementor.

Elementor Free vs Elementor Pro

La principale differenza tra loro è nel numero di widget offerti nella versione Pro.

Quindi assicurati di controllare se ne hai bisogno nel tuo design.

E anche la possibilità di cambiare piè di pagina e intestazione in Elementor è utile, anche se se il tuo tema è già dotato di un generatore di intestazione e piè di pagina dedicato, potrebbe non essere altrettanto utile. .

In termini di widget, ecco i widget di base disponibili nella versione gratuita:

  • Sezione interna
  • Immagine
  • Editor di testo
  • Video
  • Pulsante
  • separatore
  • icona
  • divisore
  • Google Maps

Ecco alcuni dei widget disponibili nella versione Pro:

  • Portfolio
  • Forma
  • Flip box
  • Listino prezzi
  • Blocco preventivo
  • Chiamare all'azione

Di seguito sono state fornite tutte le informazioni utili per prendere una decisione finale informata sull'aggiornamento o meno a Elementor Pro.

Ma in generale, ti consigliamo di giocare con la versione gratuita finché non sei sicuro che Elementor sia il miglior generatore di pagine WordPress per te.

Elementor gratuito Elementor Pro
Prezzo gratis $ 49 a $ 99,199 / anno
Numero di widget 25+ 50+
Generatore di pagine disponible disponible
Generatore di temi non disponibile disponible
Assistenza non disponibile disponible
Contenuto dinamico non disponibile disponible
Modelli e blocchi professionali non disponibile disponible
Integrazione e-commerce non disponibile disponible

In definitiva, la rassicurazione di avere il team di supporto di Elementor che fornisce supporto nella versione Pro è ciò che ci fa credere fermamente nella versione Pro.

Viene fornito anche con alcune funzionalità di nicchia che troverai in altri plugin, ma perché non farlo tutto in una volta.

Per esempio, il generatore di popup, opzioni dinamiche, condizioni per le quali l'intestazione o i popup sono visibili, CSS personalizzati, codici brevi e widget modello, caratteri personalizzati e gestore dei ruoli.

Essere in grado di assegnare e limitare i ruoli agli utenti su WordPress consente loro di andare avanti con il loro lavoro senza compromettere il tuo design. Il cliente ha accesso solo alla modifica del contenuto della pagina e non può aggiungere o rimuovere elementi trascinandoli; in questo modo il tuo design sarà sempre protetto.

L'ambiente di editing

Quando progetti la tua prima pagina utilizzando Elementor, potresti essere sopraffatto all'inizio dal numero di widget e non aver abbozzato un disegno da mettere su una tela bianca; è qui che entrano in gioco i modelli di pagina Elementor per coloro che si sentono meno ispirati al momento.

Basta selezionare un modello predefinito dall'enorme elenco e inserirlo nella tua pagina e personalizzarlo in base alle tue esigenze. Il lato destro è il tuo parco giochi di progettazione in cui puoi aggiungere elementi che formano il layout della tua pagina.

Il lato sinistro è un pannello creativo pieno di widget drag-and-drop sulla pagina.

Puoi aggiungere sezioni e trascinare i widget per adattarli al tuo design o optare per modelli predefiniti.

Leggi anche: Come aggiungere l'effetto hover in Elementor tramite CSS personalizzato

Nel pannello inferiore troverai l'icona della freccia circolare che ti riporta alla tua cronologia ed è suddivisa in azioni e recensioni; nelle azioni puoi trovare i tuoi passaggi e tornare a un'edizione precedente e in fase di revisione puoi trovare tutte le tue versioni salvate.

come usare Elementor

Un altro vantaggio dell'utilizzo di Elementor è l'accesso rapido a diverse modalità di visualizzazione in modo da poter verificare immediatamente come appare il tuo design attuale su schermi diversi come tablet e dispositivi mobili.

Se hai voglia di progettare una home page, Elementor's Blocks ti aiuterà a creare la tua pagina da zero.

Leggi anche: Come aggiungere l'effetto hover in Elementor tramite CSS personalizzato

Opzioni scheda Style (colore, tipo di carattere, dimensione) consentono di personalizzare il contenuto dei blocchi in base alle proprie esigenze.

C'è anche l'opzione estremamente utile di copiare lo stile di una sezione esistente e incollare da lì per modificare tutti i blocchi allo stesso modo.

come usare Elementor

I siti Web semplici con pagine statiche, come per il portfolio, sono per lo più statici, ma la maggior parte dei siti Web ha più pagine (blog, negozio online, risultati di ricerca).

Queste pagine dinamiche possono essere modificate con Elementor Pro o con le opzioni del tema, ad esempio progettando intestazione e piè di pagina.

Vedi anche: Come attivare la modalità Prossimamente in Elementor

La versione Pro include anche più blocchi, modelli e widget.

Sul back-end, puoi anche accedere al menu Strumenti che fornisce opzioni come Sostituisci URL, modalità di manutenzione e controllo della versione per ripristinare una versione precedente se il tuo sito Web ha riscontrato un problema con l'ultimo Elementor.

In breve, entrambe le versioni consentono di creare una pagina, utilizzare strumenti di modifica e inserire modelli predefiniti.

Prezzo Elementor Pro

A giudicare dalla tabella sopra, se sei convinto che Elementor Pro sia la scelta giusta per te, il team di Elementor ha 5 diversi piani per iniziare a seconda di quante licenze hai bisogno.

Alla fine

In generale, combinare Elementor (gratuito o Pro) con un potente tema WordPress che copre i suoi punti ciechi è la strada giusta nella maggior parte dei casi.

Altri plugin premium aggiuntivi per WordPress 

Scopri anche altri plugin di WordPress premium che ottimizzano le prestazioni del tuo blog o sito Web WordPress.

1. Foodify

Foodify è il modo più rapido e semplice per i clienti di ordinare cibo da un negozio. Lo è interamente di risposta e include funzionalità aggiuntive come immagine, opzione di ricerca, informazioni sul prodotto. Menu del cibo del ristorante Foodlify per woocommerce

Aggiunge anche pulsanti al carrello per migliorare l'esperienza dell'utente. Questa estensione WooCommerce è una soluzione di ordinazione rapida e completa che può essere aggiunta a qualsiasi sito Web WooCommerce.

Qui per te Plugin 5 WordPress per ottimizzare le descrizioni e le etichette delle categorie

Ha il vantaggio di essere molto flessibile e compatibile con molti plugin esistenti nella directory di WordPress.

Download | Demo | Web hosting

2. Pan Zoom Image

Questo plugin ti consente di aggiungere facilmente una funzione di zoom panoramico per le immagini sul tuo blog WordPress tramite uno shortcode. Puoi ad esempio integrarlo nel tuo articolo o nella tua pagina.

Zoom immagine pan wordpress plugin per lo zoom

Come funzionalità, avrai tra le altre: lo zoom panoramico su una singola immagine o una galleria con immagini illimitate, la posizione della barra di controllo può essere in alto, a destra, in basso e a sinistra, il fondo del contenitore può essere scuro, chiaro e niente di tutto ciò; l'anteprima dal vivo nella dashboard, l'esempio di zoom panoramico multiplo sulla stessa pagina, ecc.

Scopri anche il nostro 5 utilizza shortcode per i plugin WordPress premium

Download | Demo | Web hosting

3. Slider Pro

La soluzione Slider Pro ti offre una piattaforma all-in-one per aiutarti a creare e modificare diapositive o cursori che piacerà non solo ai blogger, ma a coloro che non pubblicano solo articoli.

Slider plug-in reattivo per wordpress slider

Ce WordPress Plugin premium evita inutili fronzoli, che spesso sono un ostacolo per gli utenti che cercano le informazioni di cui hanno bisogno. Inoltre, si concentra su semplicità e prestazioni, offrendo al contempo una vasta gamma di possibilità di personalizzazione.

Scopri anche Come creare una presentazione con Slider Revolution su WordPress

La sua gestione di Urls sulla barra di ricerca del browser è presente una delle caratteristiche che ci ha fatto notare su quest'ultimo. Come suggerisce il nome, questa è la soluzione professionale di cui hai bisogno.

Leggi anche il nostro Plugin 5 WordPress per creare domande frequenti su un blog

Le sue caratteristiche sono: caricamento dell'immagine ottimizzato, facile personalizzazione, animazioni fluide, layout multipli e altro ancora.

Download | Demo | Web hosting

Risorse raccomandate

Scopri altre risorse consigliate per aiutarti a costruire e gestire il tuo sito web.

Conclusione

Ecco ! Questo è tutto per il nostro articolo che ti mostra come usare Elementor in WordPress. Se hai commenti o suggerimenti, non esitate a farcelo sapere nella sezione riservata.

Tuttavia, puoi anche consultare le nostre risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress o quello acceso Divi: il miglior tema WordPress di tutti i tempi.

Ma nel frattempo, condividi questo articolo sui tuoi diversi social network

...