Come personalizzare WordPress per aumentare le conversioni?
Gli studi lo dimostrano di più 68% degli acquirentiiniziare a cercare prodotti online. Quando digitano il nome della tua attività o il prodotto che stanno cercando su Google e arrivano sul tuo sito web, è estremamente importante che tu fornisca loro le informazioni pertinenti che stanno cercando.
Ci vuole meno di un secondo agli utenti per prendere una decisione sul tuo sito web che determina se rimangono o se ne vanno.
Se i tuoi potenziali clienti trovano la strada per il tuo sito web solo per riprendersi, nemmeno un secondo dopo, stai perdendo le vendite.
Con migliaia di opzioni tra cui scegliere e migliaia di aziende per spendere soldi per il marketing digitale, un solo sito web genericoun rendimento scarso non si tradurrà in conversioni e vendite.
Quando i potenziali clienti trovano esattamente le informazioni che stanno cercando, è più probabile che rimangano, interagiscano e alla fine acquistino.
Gli studi dimostrano che i consumatori hanno maggiori probabilità di acquistare da un'azienda che offre un'esperienza utente personalizzata e che i contenuti personalizzati possono aumentare l'efficacia della spesa di marketing dal 10 al 30 percento.
Con numeri come questi, non puoi permetterti di non personalizzare il tuo sito web.
Il contenuto che devi personalizzare
Trascorri molto tempo a costruire e perfezionare il tuo sito Web WordPress, quindi può essere travolgente quando cerchi di decidere quali parti di contenuto personalizzare.
Le foto sul tuo sito web sono estremamente potenti e possono avere un enorme impatto sui tuoi tassi di conversione. Sia che la tua immagine aggiunga un elemento umano al tuo marchio, mostri dettagli o guidi il consumatore dove vuoi che guardi, la personalizzazione di questa parte del tuo sito web consente ai tuoi visitatori di relazionarsi con la tua attività a un livello più profondo.
Informazioni di contatto - Sebbene le immagini ti consentano di stabilire connessioni emotive con i tuoi visitatori, fornire i dettagli di contatto corretti è un modo semplice per personalizzare il tuo sito web. Indipendentemente dal fatto che tu abbia rappresentanti di vendita one-stop per varie località o una linea di assistenza notturna specifica, mostrare ai visitatori del tuo sito web i dettagli di contatto corretti consente loro di contattarti immediatamente e semplificare gli acquisti.
Recensioni e testimonianze dei clienti - i clienti leggono le recensioni prima di effettuare un acquisto. Per questo motivo, è sempre più importante avere commenti sul tuo sito web. La personalizzazione di questi commenti può renderli ancora più efficaci. Puoi farlo mostrando le recensioni dei prodotti pertinenti a qualcuno che ha acquistato in precedenza o mostrando le recensioni di qualcuno in una determinata regione del paese a qualcun altro in quella regione.
Informazioni sul prodotto - Se vendi un prodotto o un servizio che non è disponibile in determinate regioni o per determinati gruppi di età, la personalizzazione delle descrizioni dei prodotti può essere il modo ideale per essere in anticipo su queste informazioni. Questa tecnica consente di fornire informazioni pertinenti ai clienti pertinenti senza ingombrare la pagina Web per le persone che non ne hanno bisogno.
Inviti all'azione - A seconda del dispositivo che utilizza il visitatore del sito web, dove si trova e cosa gli interessa, a pulsante di chiamata all'azione non è sempre pertinente o allettante. La personalizzazione del testo dell'invito all'azione e del collegamento a cui invia il cliente può renderlo più efficace di un'opzione valida per tutti.
Articoli ad un blog e altri contenuti - In questo pazzo mondo di WordPress SEO, i post del blog che scrivi e altri contenuti che crei sul tuo sito web devono essere pertinenti e coinvolgenti per gli utenti. Mostrare contenuti ai visitatori del sito web e post di blog che sono interessanti e rilevanti per loro non solo fornisce valore ai tuoi visitatori, ma aumenta i livelli di coinvolgimento sui tuoi post del blog.
Per guadagnare popolarità con il tuo sito web, coinvolgere un pubblico già interessato a ciò che stai scrivendo può essere molto importante ed è un uso più pratico del tuo tempo.
Come personalizzare il tuo sito web
A seconda del tuo prodotto o servizio, ci sono molti modi per personalizzare il tuo sito Web WordPress per aumentare le conversioni. Ecco alcune idee per far fluire la tua creatività mentre personalizzi il tuo sito web:
Targeting geografico
La personalizzazione dei contenuti in base alla posizione dei visitatori è un ottimo modo per personalizzare il tuo sito web. È possibile modificare le immagini per riflettere le immagini rilevanti per il visitatore, modificare i numeri di telefono e le informazioni di vendita per mostrare i dettagli di contatto corretti in base a dove stanno facendo acquisti e molto altro.
Una taglia non si adatta a tutti quando si tratta del tuo sito web e delle informazioni che i visitatori del tuo sito web stanno cercando da luoghi diversi.
In questa immagine, puoi vedere come l'Università del Montana potrebbe utilizzare il targeting geografico per personalizzare il proprio sito Web in base alla posizione dello studente interessato che sta visitando il sito Web. Invece di un messaggio generico " Ulteriori informazioni sul motivo per cui la messaggistica unificata è giusta per te", I visitatori di Boston vedrebbero il messaggio" Il Montana visita Boston E avrebbe l'opportunità di fissare un appuntamento per incontrare il rappresentante del campus quando si trovano nella regione. La percentuale di clic per i contenuti personalizzati è quasi il doppio rispetto ai post generici.
GeoFli è un ottimo strumento WordPress per targeting geografico e la geo-personalizzazione. Il loro plugin per WordPress ti consente di personalizzare facilmente il tuo sito Web in base alla posizione del visitatore. Con GeoFli, puoi scegliere la posizione target in base al codice postale, allo stato, al paese o persino disegnare il tuo recinto geografico.
Ti consente inoltre di reindirizzare i visitatori da determinati luoghi a URL diversi. Per utilizzare GeoFli, tutto ciò che devi fare è selezionare il contenuto da modificare, selezionare l'area da indirizzare e modificare la copia o il contenuto per fornire valore al pubblico di destinazione.
Personalizzazione del tipo di dispositivo
Mostrare contenuti pertinenti agli utenti in base al dispositivo che stanno utilizzando per eseguire ricerche sul Web è un ottimo modo per ridurre la frequenza di rimbalzo, aumentare le conversioni e fornire informazioni ai visitatori del tuo sito web. di cui hanno bisogno.
Comprendere le abitudini dei tuoi clienti può aiutarti con questa forma di personalizzazione. Ad esempio, è più probabile che i consumatori acquistino da un computer desktop che da uno smartphone. Sapere questo potrebbe incoraggiarti a visualizzare le informazioni sull'acquisto del prodotto sul computer, mettendo in evidenza i tuoi valori aziendali ei vantaggi dei prodotti sui dispositivi mobili.
Logic Hop consente di personalizzare il contenuto del sito Web in base a come il visitatore è arrivato al sito Web e al contenuto visualizzato. Il loro plugin per WordPress è un modo potente per fornire contenuti personalizzati ai visitatori del tuo sito web.
Per utilizzare Logic Hop, tutto ciò che devi fare è creare logica condizionale su alcune sezioni del tuo sito web e il tuo sito web mostrerà queste sezioni quando le condizioni saranno soddisfatte.
Personalizzazione del tempo
Mostrare inviti all'azione e contenuti unici in base all'ora del giorno, della settimana o dell'anno in cui il visitatore si trova sul tuo sito web può consentirti di utilizzare i modelli utente per aumentare le conversioni.
Se sai che un determinato prodotto o servizio sta vendendo meglio in un certo momento, puoi personalizzare il tuo sito web per mostrarlo durante quel periodo.
Personalizzazione avanzata di Flowcraft consente di personalizzare il contenuto del sito Web in base al tempo, al numero di visite e altro. Il loro plugin per WordPress ti consente di combinare facilmente le sezioni e personalizzarle per gruppi di persone ancora più specifici.
Simile a Se è così, per utilizzare la personalizzazione avanzata di Flow Craft, è sufficiente creare una condizione e specificare cosa verrà visualizzato se la condizione è soddisfatta o meno.
Personalizzazione dell'interazione con il sito web
Il modo in cui un consumatore interagisce con il tuo sito web è anche una grande opportunità per mostrare loro contenuti personalizzati. Se sono collegati e hanno fatto précédents acquisti, puoi suggerire articoli simili, se sono visitatori per la prima volta, puoi mostrare loro gli articoli più popolari e se hanno trovato il tuo sito web a causa di un annuncio specifico, puoi visualizzarli. visualizzare le informazioni pertinenti a questo annuncio.
If-So ti consente di personalizzare il contenuto del sito web in base al profilo del tuo visitatore o all'interazione con il sito web. Questo plugin per WordPress ti consente di visualizzare contenuti unici in base a data, profilo utente e altro.
Per utilizzare If-So, tutto ciò che devi fare è selezionare la condizione che desideri targetizzare e quindi impostare il contenuto che desideri visualizzare indipendentemente dal fatto che la condizione sia soddisfatta.
Quando potenziali clienti visitano il tuo sito web, hai solo una frazione di secondo per attirare la loro attenzione e mantenerli interessati. La personalizzazione del contenuto del tuo sito Web WordPress è quindi un ottimo modo per fornire ai visitatori le informazioni che stanno cercando e, in definitiva, aumentare le conversioni.
Che si tratti di personalizzare le informazioni di contatto in base alle posizioni dei visitatori o di personalizzare le immagini per il periodo dell'anno, i contenuti di valore sono la chiave per convertire i clienti di alta qualità.
Risorse raccomandate
Scopri altre risorse consigliate per aiutarti a costruire e gestire il tuo sito web.
Ecco ! Qui finisce la nostra guida su come personalizzare WordPress per aumentare le conversioni. Se ne hai alcuni commentaires o suggerimenti, non esitate a comunicarcelo nella sezione riservata a questi.
In questo articolo ti mostreremo come installare i plugin di WordPress
Essendo uno dei sistemi di gestione dei contenuti (CMS) più popolari, WordPress offre grande flessibilità e numerose opzioni di personalizzazione. Offre un'ampia varietà di plugin per WordPress, che ti consentono di modificare la funzionalità del tuo sito web.
WordPress ha una propria directory, fornita con plugin gratuiti e premium. Questi plugin ti consentono di aggiungere varie funzionalità, che vanno dai moduli di contatto e newsletter personalizzate alla memorizzazione nella cache del sito Web e alla sicurezza di WordPress.
In questo tutorial, ti mostreremo il processo passo dopo passo di installazione dei plugin di WordPress utilizzando tre diversi metodi.
Alla fine di questo articolo, includeremo anche alcuni suggerimenti che puoi seguire quando cerchi nuovi plugin per WordPress per migliorare il tuo sito web.
Come installare i plugin di WordPress dalla directory ufficiale dei plugin
Il modo più semplice per installare i plugin di WordPress è accedere alla directory ufficiale dei plugin attraverso l'area di amministrazione di WordPress. Tuttavia, questa directory di plugin di WordPress è limitata alle sole opzioni di plugin gratuite.
Accedi alla dashboard di WordPress e vai a Estensioni->Aggiungi. Procedi con la ricerca del plugin nel file barra di ricerca. Puoi anche sfogliare i plug-in in primo piano, popolari o consigliati facendo clic sulle schede fornite a sinistra.
Ad esempio, se stai cercando il plugin MonsterInsights, lo vedrai apparire come primo risultato. Fare clic sul pulsante Installer ora per avviare l'installazione del plugin.
Attendi il completamento del processo e fai clic sul pulsante attivare per iniziare a utilizzare questo plugin per WordPress.
Una volta attivato il plugin, controlla e configura il impostazioni del plugin andando a Estensioni -> Plugin installati.
Come installare manualmente i plugin di WordPress
Un altro modo per installare i plug-in di WordPress è caricare manualmente i file dei plug-in tramite la dashboard di WordPress.
Questo metodo ti consente di installare un plug-in che potrebbe non essere nella directory ufficiale di WordPress ma disponibile da mercati di terze parti, come CodeCanyon etCodificatore.
Prima di avviare il processo di installazione del plug-in, devi prima scaricare il file Codice di avviamento postale (CAP) del plugin dalla fonte di tua scelta.
Quindi, vai alla tua area di amministrazione di WordPress e fai clic Estensioni -> Aggiungi. poi individuare il pulsante a Talzare un'estensione in alto a sinistra della pagina.
Seleziona il file sul tuo computer Codice di avviamento postale (CAP) plug-in che si desidera scaricare, quindi fare clic su installare ora.
Attendi il completamento dell'installazione del plug-in e tocca Abilita estensione.
Utilizzo di un client FTP per installare i plugin di WordPress
Esistono diversi plug-in WordPress premium e personalizzati che richiedono l'installazione manuale utilizzando a client FTP. Per un principiante, il processo potrebbe essere leggermente più complicato poiché dovrai prima imparare come configurare un client FTP.
Non preoccuparti, la seguente guida ti guiderà passo dopo passo. Tutto quello che devi fare è semplicemente seguire i passaggi.
In primo luogo, estratto il file ZIP del plugin e salvalo in una cartella sul tuo computer. Tieni presente che la cartella del file del plug-in estratto sarà quella che devi caricare tramite il client FTP.
Quindi, collega il tuo sito Web al server FTP. Per fare ciò, trova i dettagli FTP del tuo provider di hosting.
Una volta effettuato l'accesso, vai al tuo client FTP – per questo esempio stiamo usando fileZilla. Lì, inserisci le tue credenziali di accesso e premi il pulsante Connessione rapida. Quindi vai al pannello sito remoto e cercala cartella wp-content / plugins /.
Nel pannello sito web locale, carica la cartella del plug-in estratta dal tuo computer in la cartella wp-content/plugins/ dal tuo server.
Una volta completato il trasferimento, il plugin di WordPress verrà installato sul tuo sito web.
Per attivare il plugin, devi accedere alla dashboard di WordPress. Vai a Estensioni-> sezione Plugin installati, individua il plug-in, quindi fai clic su attivare.
Cosa ricordare quando si seleziona un plugin per WordPress?
Ci sono molti plug-in nella directory dei plug-in di WordPress e ancora di più disponibili su siti Web di terze parti. Questo numero di opzioni può sembrare schiacciante, soprattutto per i principianti che cercano di capire cosa è giusto per il loro sito web.
Le sezioni seguenti ti mostreranno alcune cose essenziali da considerare quando selezioni un plugin per il tuo sito web.
Aggiornamenti regolari.
WordPress rilascia aggiornamenti regolari per mantenere aggiornato il suo sistema. In questo modo migliorano le prestazioni, mantengono la sicurezza, risolvono problemi di bug e aggiungono nuove funzionalità.
Quindi, prima di installare qualsiasi plugin, considera questi punti:
Assicurati che sia adatto al lavoro
Ultimo aggiornamento. La scelta di un plug-in WordPress che viene aggiornato frequentemente può impedirti di commettere violazioni della sicurezza. Mostra anche che gli sviluppatori stanno ancora attivamente mantenendo e migliorando il plugin.
Numero di installazioni. Questo numero mostra quanto sia popolare detto plugin per WordPress. In genere, più installazioni attive ha un plugin, migliore è la sua qualità.
Pubblico. Le recensioni e i commenti degli utenti possono aiutarti a valutare i pro ei contro di un plug-in specifico. Questo ti dà un'idea di come si comporta il plugin in situazioni in tempo reale.
Compatibilità. Un plugin che riceve aggiornamenti regolari dai suoi sviluppatori è solitamente compatibile con l'ultima versione di WordPress. Controlla sempre la scheda della descrizione per vedere quale versione di WordPress è necessaria per eseguire il plugin.
Prima di scaricare e installare qualsiasi plugin sul tuo sito WordPress, assicurati di controllare le affermazioni fatte dagli sviluppatori. Leggi la documentazione del plug-in, controlla i forum di supporto del plug-in e leggi le recensioni.
Anche la ricerca tra i post del blog è una buona pratica poiché molti siti Web forniscono recensioni di plug-in.
Quando si testa un plug-in in WordPress, ricordarsi di installare e testare ogni plug-in individualmente. In questo modo, vedrai rapidamente se sta causando problemi al tuo sito Web e se puoi risolverli.
Se decidi di testare diversi plugin su WordPress, ricordati di disattivare il plugin precedente prima di provarne un altro.
Inoltre, quando hai diversi plugin inattivi, è meglio rimuoverli poiché troppe installazioni possono sovraccaricare il tuo sito Web WordPress e influire sulle sue prestazioni.
Usa un solo plugin per ogni funzione
Sebbene i plugin di WordPress aggiungano nuove funzionalità e migliorino la funzionalità del tuo sito web, l'installazione di troppi di essi può rallentare il tuo sito web.
Infatti, ogni volta che installi i plugin di WordPress, aggiungi un nuovo codice al tuo sito web. Se utilizzati in modo eccessivo, i plug-in invieranno troppe richieste HTTP per caricare le proprie risorse, come fogli di stile CSS, file JavaScript e immagini, il che rallenterà la velocità di caricamento del tuo sito web.
Inoltre, l'installazione di plug-in WordPress che svolgono funzionalità simili può causare conflitti, con la potenziale rottura di uno o entrambi i plug-in. Quindi, la migliore pratica è installare un plug-in WordPress per ciascuna funzionalità.
Per esempio, Yoast SEO et AISEO hanno set di funzionalità simili: basta sceglierne uno per evitare conflitti di plug-in.
Ci auguriamo che questo tutorial ti abbia aiutato a imparare come installare i plugin di WordPress sul tuo blog o sito web. Ora hai l'opportunità di migliorare la funzionalità del tuo sito web anche se non hai precedenti conoscenze o abilità tecniche.
Se non sei sicuro di quale plugin iniziare, considera cosa manca al tuo attuale sito web. Successivamente, esamina i plug-in disponibili e confronta fattori importanti come compatibilità, recensioni e ultimo aggiornamento.
Ecco alcuni dei nostri plug-in WordPress essenziali consigliati per iniziare:
Yoast SEO. Questo plugin aiuta a migliorare il tuo post sul blog WordPress e la SEO della pagina attraverso l'ottimizzazione delle parole chiave e le meta descrizioni
Elementor ou Beaver Builder. Ti aiuta a costruire il tuo sito web fornendo un'interfaccia drag and drop facile da usare.
W3 Total Cache ou WP Super Cache. Aumenta le prestazioni del tuo sito Web e riduce i tempi di caricamento con la memorizzazione nella cache e l'integrazione con le CDN.
Sitemap XML di Google. Genera automaticamente mappe del sito XML per una migliore ottimizzazione dei motori di ricerca.
Akismet. Questo plugin rileva e filtra lo spam nei tuoi commenti e nei moduli di contatto per prevenire attacchi dannosi.
Altre risorse consigliate
Ti invitiamo inoltre a consultare le risorse seguenti per approfondire la presa e il controllo del tuo sito Web e blog.
Questo è tutto per questa guida che ti mostra come installare i plugin di WordPress. Se hai dubbi o suggerimenti, faccelo sapere all'interno commentaires.
Ti piacerebbe avere un Mega Menu Divi con immagini per illustrare il contenuto del menu? Segui il nostro tutorial su come aggiungere immagini a un Mega Menu?
Adoriamo interagire con le immagini online. Con questo in mente, ha senso aggiungere un'immagine al tuo sito web ogni volta che è possibile.
Inoltre, l'aggiunta di immagini in un mega menu è un'altra grande opportunità per offrire ai tuoi utenti l'interazione di cui hanno bisogno.
Le immagini migliorano anche il menu catturando la loro attenzione per semplificare ulteriormente il processo di navigazione.
Panoramica
Prima di entrare in questo tutorial, diamo un'occhiata al risultato che vogliamo ottenere.
Creazione del mega menù
Per iniziare, dobbiamo prima creare il menu.
Per questo esempio, creeremo una voce di menu principale principale chiamata “Mega Menù” con quattro voci di sottomenu di seguito. Ciascuna delle quattro voci di sottomenu ha tre voci di sottomenu.
Vai alla dashboard di WordPress, quindi fai clic su Aspetti> Menu
Fare clic 'Crea un nuovo menu', assegnagli un nome e fai clic su 'Crea menu'.
Assicurati di abilitare la proprietà del menu Classi CSS facendo clic sulla scheda Opzioni schermata in alto a destra della schermata Menu e verifica Classi CSS.
Ora puoi aggiungere le tue voci di menu al nuovo menu che hai creato.
Per prima cosa creiamo la voce di menu che sarà il genitore di tutte le altre voci di menu. Questo è il collegamento che mostrerà il tuo mega menu al passaggio del mouse.
Per creare questa voce di menu, creare un collegamento personalizzato con i seguenti parametri:
URL: http://#
Titolo di navigazione: Mega Menu
Classi CSS: mega-menu
Ora disponi/trascina le quattro voci di menu (ognuna con tre voci secondarie proprie) in modo che diventino voci secondarie del collegamento principale Mega Menu principale.
Una volta aggiunti i collegamenti al menu, scorrere fino a 'Reglages du menu' nella parte inferiore della schermata del menu e selezionare 'Menu principale' per posizione di visualizzazione. Infine, fai clic su 'Salva menu'
Ecco come si presenta finora il nostro mega menù:
Aggiunta di immagini al mega menu
Ora che il menu è pronto, è il momento di aggiungere le immagini.
Inizia ottenendo quattro immagini. Queste immagini dovrebbero riguardare le quattro voci del sottomenu (Informazioni, Consegna del servizio, Il nostro lavoro e Contattaci).
Usa un editor di foto per ridimensionare e ritagliare ogni immagine in modo che sia larga 500 px e alta 300 px.
Aggiungi queste immagini alla libreria di WordPress. Clicca su Media > Aggiungi.
Trascina le tue immagini sulla pagina per aggiungerle o fai clic su 'Seleziona i file'
Inserisci le immagini nel Mega Menu
Torna alla pagina dei menu nella dashboard di WordPress.
In questo esempio, il collegamento nella parte superiore della prima colonna è " Di ".
Fare clic sulla freccia a destra dell'elemento " Di ". Nella casella Etichetta di navigazione, aggiungi l'immagine desiderata utilizzando il tag html img subito prima del testo " Di ". Il tag immagine dovrebbe assomigliare a questo:
Per trovare l'URL dell'immagine, vai a Media > Libreria multimediale, fai clic sull'immagine che desideri aggiungere.
Nella schermata pop-up Dettagli allegato, trova l'URL nella sezione giusta, quindi fai clic su "Copia URL negli appunti"
Ora torna alla configurazione della voce di menu " Di " nella pagina del menu e sostituire il testo "Inserisci URL immagine" incollando l'URL dell'immagine utilizzando ctrl + v.
Prima di uscire dalle opzioni di configurazione per la voce di menu " Di ", trova la casella di testo Classi CSS e inserisci la classe "mega-link".
Questo ci consentirà di aggiungere uno stile personalizzato in un secondo momento.
Ripetere questo processo per aggiungere le seguenti tre immagini a ciascuna delle voci di sottomenu con la classe "mega-link". (In questo esempio, i restanti tre elementi sono “Erogazione dei servizi”, “Il nostro lavoro” et " Contattaci ".)
Risultato
Vai al tuo sito web e passa il mouse sopra il link del mega menu. Ora il tuo mega menu dovrebbe assomigliare a questo:
Nota che quando passi il mouse su ciascuna delle immagini, le immagini sfumano con la voce del sottomenu direttamente sotto. Questo perché l'immagine fa parte di quel collegamento, quindi facendo clic su di essa si accederà all'URL associato.
Tocchi finali
Per quest'ultimo passaggio, aggiungi alcuni CSS personalizzati al menu per rendere il carattere del testo più grande e centrato. Assegna anche un raggio di bordo attorno all'immagine per farla sembrare più pulita.
Nella dashboard di WordPress, vai a Divi> Opzioni tema .
Scorri verso il basso fino alla casella CSS personalizzato, inserisci il CSS di seguito e fai clic 'Salvare le modifiche' :
Hai un mega menu Divi con immagini senza dover utilizzare un plug-in. Questo tipo di menu funziona particolarmente bene per i siti di e-commerce che hanno molti contenuti e richiedono immagini di prodotti. Ci auguriamo che questo tutorial possa essere utile per i tuoi prossimi progetti Divi.
Ti piacerebbe imparare come aggiungere caratteri personalizzati a un sito Web WordPress?
Perché rendere noioso il tuo blog usando i caratteri standard? Lascia che il tuo blog parli della tua personalità vibrante e degli argomenti che tratti con un'ampia varietà di caratteri personalizzati. I caratteri personalizzati sono una caratteristica interessante che rende il tuo blog preferibile agli altri.
Affrontiamolo; tutti amiamo blog e siti Web con i caratteri giusti. Non solo decorano il sito Web, ma aiutano anche ad attirare l'utente verso i tuoi contenuti. Tuttavia, la scelta dei font standard di WordPress è limitata e dipende dal tema che stai utilizzando. La buona notizia è che puoi aggiungerli manualmente o con plugin WordPress specializzati.
E qui sorgono due domande: dove ottenere caratteri personalizzati per WordPress e come installare caratteri personalizzati sul tuo sito web.
Andiamo a scoprirlo.
Perché dovrei usare caratteri personalizzati?
Sono finiti i giorni in cui Times New Roman e Georgia erano considerati gli unici caratteri tipografici per il testo sui siti web. Negli ultimi anni, lo spazio dei caratteri è completamente cambiato con l'avvento di caratteri come Google Fonts e altri.
Oggi ci sono centinaia di font gratuiti, informazioni e ausili di formazione e risorse di progettazione disponibili su Internet. A differenza di Adobe Illustrator, Photoshop e altre app classiche, WordPress non ti dà il pieno controllo sui caratteri predefiniti. Solo alcuni temi WordPress scelgono di supportare e utilizzare caratteri personalizzati.
Pertanto, in questo articolo imparerai come trovare i caratteri personalizzati adatti e usarli sul tuo sito Web WordPress.
L'importanza di utilizzare caratteri personalizzati
Perché cambiare i caratteri, il rientro delle parole, l'interlinea, l'interlinea delle lettere o la saturazione dei caratteri, chiedi? Tuttavia, alcuni studi lo dimostrano la tipografia migliora la comprensione della lettura.
Molto dipende dalla costruzione dei caratteri. A livello conscio e inconscio, tutti valutano il contenuto di una pagina web in base alla progettazione.
Il design dei caratteri influisce sui lettori, anche se non ci prestano attenzione. Rinunciare al design dei caratteri significa rinunciare allo sviluppo stesso! L'umore del lettore dipende da questo. Il carattere facilita la lettura o costringe gli utenti a lasciare la pagina.
Tutti i browser Web includono una serie di caratteri predefiniti. Ciò significa che se il font non è specificato nel CSS della pagina, verrà utilizzata la versione standard. Puoi ancora utilizzare i caratteri predefiniti, ma rendono più difficile per gli utenti. Per questo è fondamentale utilizzare un font personalizzato. Se il tuo tema WordPress non ti offre opzioni per cambiare il carattere, ci sono molti siti Web e strumenti che possono aiutarti.
Alternative a Google Fonts
Molti di voi conoscono il Caratteri di Google. Ci sono molti altri siti Web in cui puoi trovare bellissimi caratteri. Alcuni di essi sono gratuiti per uso personale. Se hai bisogno di un uso commerciale, avrai bisogno di una licenza. Google Fonts e Adobe Edge Fonts sono gratuiti. Questo è il motivo per cui non sono così unici.
Ecco alcuni altre risorse per trovare i caratteri per uso gratuito e commerciale:
TemplateMonster— Sul sito Web TemplateMonster troverai tutto ciò di cui hai bisogno per il web design. Ci sono anche molti font e pacchetti di font per uso personale a un piccolo prezzo. Inoltre, per aiutarti a scegliere, tutti i caratteri presentati su opuscoli o cornici. Ogni carattere è inoltre presentato con una licenza commerciale.
MyFonts— MyFonts offre attualmente la più ampia selezione di caratteri al mondo. Tuttavia, i prezzi qui sono anche nel segmento superiore. Quindi, se hai un budget limitato, questo potrebbe non essere adatto a te.
FontSpring— Fontspring vende font di novità per uso commerciale. Ma in quasi tutte le famiglie, 1-2 font gratuiti possono essere utilizzati per scopi personali. Inoltre, c'è una sezione separata con caratteri gratuiti. La collezione è vivace. Ma dovrai studiare attentamente le informazioni sulla licenza per un particolare font prima del download.
caratteri cufon— È anche una vasta collezione di diversi tipi di carattere. Selezionane uno qualsiasi e vedrai una pagina con informazioni dettagliate a riguardo. Ci sono molti font gratuiti e sono divisi in singole sezioni. Il sistema di smistamento su CufonFonts è abbastanza flessibile e conveniente. Inoltre, è incluso il supporto Webfont.
Dafont— Un'altra raccolta accessibile di 3 caratteri gratuiti. La maggior parte di essi sono progettati esclusivamente per uso personale. Una caratteristica interessante di DaFont è un sistema di categorie. Puoi selezionare i caratteri nello stile di fumetti, videogiochi, vintage ecc….
La scelta dei caratteri è molto allettante perché sono tutti belli. Ma non dovresti scegliere molto. Non utilizzare più di due caratteri su un sito ragnatela. Quindi l'aspetto del tuo sito Web sarà coerente. Una volta scelti i caratteri, assicurati di caricare i file per ogni stile che utilizzerai (normale, grassetto, corsivo, ecc.).
Ora che hai selezionato il font appropriato per il tuo sito web, scopriamo come aggiungerlo.
Come aggiungere caratteri personalizzati a WordPress
Esistono diversi modi per aggiungere caratteri a un sito Web WordPress:
plugin : in questo caso vengono utilizzati diversi plugin di WordPress per facilitare il processo.
manualmente : utilizzando questo metodo è necessario scaricare un font scaricato dal sito e modificare il file CSS.
temi: molti temi popolari hanno opzioni integrate per personalizzare i tuoi caratteri (nota: non tratteremo questa opzione poiché il processo varierà a seconda del tema che stai utilizzando.
Opzione 1: cambia i caratteri di WordPress con i plugin
Se non ci interessano le modifiche globali, possiamo installare plugin di WordPress che cambieranno i caratteri sul tuo sito web.
Caratteristiche dei plugin di caratteri personalizzati
Il software open source ha un vantaggio per l'interesse della comunità e anche WordPress ha questo vantaggio. Diversi plugin di WordPress ti consentono di aggiungere caratteri personalizzati. Come scegliere un plugin appropriato quando ce ne sono così tanti? Quali sono le caratteristiche dei plugin di WordPress con font personalizzati?
Ecco alcuni punti da considerare:
Possibilità di utilizzare un carattere personalizzato
Possibilità di utilizzare più font
Intestazioni e componenti di destinazione
Bonus: la possibilità di modificare le impostazioni dei caratteri dall'editor visivo
È tutto. La prima caratteristica dell'elenco è molto importante. Puoi comunque scaricare font da siti Web come DaFont, Font Squirrel, ecc., ma devi essere in grado di caricarli su WordPress.
Diamo un'occhiata ad alcuni plugin per WordPress che ti permettono di caricare font personalizzati.
1. Font migliore
Questo plugin per WordPress consentirà ai suoi utenti di combinare automaticamente l'ultima versione dei font Better Font Awesome con il CSS, codici brevi e altro ancora. Inoltre, questo plugin per WordPress viene aggiornato automaticamente.
Troverai come funzionalità: aggiornamenti regolari, un generatore di shortcode, compatibilità con altri plugin di WordPress, ecc ...
Questo plugin WordPress è composto da caratteri speciali 877, che ti permetteranno di usare tutti i caratteri sui tuoi siti Web WordPress. Grazie alla sua anteprima in tempo reale, ti permetterà di vedere come sarà il tuo sito web una volta applicato il font.
Inoltre, sarai in grado di salvarlo e modificarlo sul frontend quando trovi la combinazione che ti piacerà.
Le sue caratteristiche includono: un'anteprima in tempo reale, a SEO abbastanza avanzato, supporto multilingue, supporto per più 870 + Google Fonts, aggiornamenti facili e altro ancora.
Fonts Plugin è un plugin gratuito per WordPress che consente agli utenti di accedere alle librerie di Google Fonts e Adobe Fonts. Con questo plug-in per WordPress, puoi scegliere tra oltre 1000 caratteri Google e Adobe, utilizzare più caratteri sul tuo sito Web e testare diverse opzioni con la funzione di anteprima in tempo reale del plug-in nel personalizzatore di WordPress.
Per ulteriori modi per personalizzare la tipografia del tuo sito Web come la dimensione del carattere, la spaziatura delle lettere e l'altezza della riga, puoi eseguire l'aggiornamento alla versione premium, Font Plugin Pro.Download| Demo | Web hosting
4. Facile Google Fonts
Easy Google Fonts è uno dei migliori plugin di WordPress per personalizzare la tipografia del tuo sito web. Come Fonts Plugin, ti consente di scegliere tra centinaia di Google Fonts e visualizzarli in anteprima nel Customizer prima di aggiungerli al tuo sito web.
Sebbene fornisca l'accesso a un numero minore di Google Fonts, è unico in quanto consente di creare controlli e regole dei caratteri personalizzati nell'area di amministrazione, che appariranno immediatamente nel personalizzatore di WordPress.
Opzione 2 – Installa manualmente i font personalizzati di WordPress
Usando la direttiva @font-face, puoi collegare uno o più font al tuo sito web. Ma questo metodo ha i suoi pro e contro.
Avantages:
Grazie ai CSS puoi collegare font di qualsiasi formato: ttf, otf, woff, svg.
I file dei caratteri si troveranno sul tuo server: non dipenderai da servizi di terze parti.
svantaggi :
Per la corretta connessione dei caratteri per ogni stile, è necessario registrare un codice separato.
Senza conoscere i CSS, puoi essere facilmente confuso.
Ma non è un vero problema se puoi basta copiare un codice finito e dove devi specificare i tuoi valori.
osservazione : Prima di iniziare, assicurati di farlo creare un tema figlio per il tuo sito web. In questo modo puoi apportare tutte le modifiche al tuo tema figlio, lasciando il tuo tema principale in modo da poterlo aggiornare facilmente se necessario in futuro.
Passaggio 1: crea una cartella "caratteri".
Nel tuo tema figlio, crea una nuova cartella "caratteri" in: wp-content/themes/your-child-theme/fonts
Passaggio 2. Carica i file dei font scaricati sul tuo sito web
Questo può essere fatto tramite il pannello di controllo dell'hosting o tramite FTP.
Aggiungi tutti i file dei caratteri alla cartella dei caratteri appena aggiunta: wp-content/themes/ Nel tuo tema figlio, crea una nuova cartella "fonts" sotto: wp-content/themes/your-child-theme/fonts che hai creato.
Passaggio 3. Importa i caratteri tramite il foglio di stile del tema figlio
Aprire il file style.css del tuo tema figlio e aggiungi il codice seguente all'inizio del file CSS (dopo il commento del tema figlio):
dove MyWebFont è il nome del font e il valore della proprietà src (i dati tra parentesi tra virgolette) è la loro posizione (collegamenti relativi). Dobbiamo specificare ogni stile separatamente.
Poiché colleghiamo prima lo stile normale, impostiamo le proprietà dello spessore del carattere e dello stile del carattere su normale.
Passaggio 4. Quando si aggiunge corsivo, scrivi quanto segue:
Bene, questo è tutto. Ora che hai collegato quattro stili di carattere al tuo sito web.
Ma c'è una nota: questa connessione di font non verrà visualizzata correttamente in Internet Explorer 8. La consolazione è che ci sono pochissime persone che usano ancora IE8.
Altre risorse consigliate
Ti invitiamo inoltre a consultare le risorse seguenti per approfondire la presa e il controllo del tuo sito Web e blog.
Qual è la prima cosa che gli utenti notano quando visitano il tuo sito web? Esatto, il suo design! La maggior parte del design si basa sull'uso corretto di bellissimi caratteri. Quindi, devi prenderti cura del design del carattere del tuo sito web. Aggiungi codice o utilizza uno dei plug-in sopra menzionati per incorporare un nuovo stile di carattere. Come scegli dipende da te.
Assicurati di non utilizzare più di due font sullo stesso sito web. Poiché più caratteri personalizzati aggiungi al sito Web, più la velocità del sito Web diminuirà.
Questo è tutto per questo articolo che ti mostra come aggiungere caratteri personalizzati a un sito Web WordPress. Ti invitiamo a provare. Se hai dubbi o suggerimenti, faccelo sapere all'interno commentaires.
In questo tutorial, ti mostreremo come preparare il tuo sito Web WordPress per il programma Facebook Instants Articles.
Con il programma Articoli istantanei di Facebook aperto a tutti per gli editori di contenuti il 12 aprile 2016, dovrai preparare il tuo blog WordPress, per poter pubblicare direttamente su Facebook utilizzando pochi tag.
Più di un miliardo di persone accedono a Facebook da un dispositivo mobile ogni mese e le prestazioni dei contenuti visualizzati utilizzando l'app mobile di Facebook sono più importanti che mai. Facebook ha lanciato Instant Articles a maggio 2015 come un modo per accelerare la consegna dei contenuti e offrire il tipo di esperienza coinvolgente che gli utenti di app mobili si aspettano.
All'inizio, il programma era limitato a un gruppo selezionato di noti editori come BuzzFeed, The New York Times e BBC News. Tuttavia, ad aprile 2016, il programma sarà aperto a tutti gli editor di contenuti.
Facebook crea un "Articolo istantaneo" quando un feed RSS correttamente formattato è associato a una pagina Facebook approvata utilizzando il Business Manager di Facebook. Gli editori devono presentare domanda per partecipare al programma e, una volta accettati, potranno personalizzare l'aspetto e il comportamento degli articoli istantanei.
Se la tua organizzazione è attiva su Facebook e riceve una quantità significativa di traffico dai contenuti condivisi sul social network, è ora possibile configurare il tuo sito web per generare un feed RSS correttamente formattato. Tuttavia, aderire al programma Instant Articles di Facebook non è così facile come potresti pensare.
Cosa fa il contenuto quando ti iscrivi al programma?
Gli editori di contenuti che partecipano al programma ottengono un grande controllo su come i loro contenuti vengono visualizzati nell'app Facebook. Gli editori possono anche vendere spazio pubblicitario negli articoli istantanei e mantenere il 100% o il 70% delle entrate pubblicitarie a seconda che l'editore o Facebook venda lo spazio.
Un maggiore controllo sulla UX e un aumento delle entrate sono i due fattori motivanti, ma il motivo principale per cui avrai bisogno di aderire al programma è perché gli utenti di Facebook hanno un'esperienza migliore con gli articoli istantanei.
Facebook afferma che gli articoli istantanei si caricano dieci volte più velocemente rispetto ai contenuti Web mobili standard, un'affermazione che non è stata confermata in modo indipendente. Gli articoli istantanei stanno anche rivoluzionando l'utilizzo dell'intera finestra disponibile del dispositivo mobile, il che rende gli articoli istantanei molto più coinvolgenti dei contenuti visualizzati in un browser.
Chi dovrebbe partecipare al programma di Instant Elementi di Facebook?
Questo programma è stato progettato per editor di contenuti e altre organizzazioni che pubblicano contenuti regolarmente. In realtà, gli autori non possono aderire al programma finché non hanno almeno 50 articoli pronti per la revisione. Se la tua organizzazione ha più di 50 articoli, potresti considerare di iscriverti al programma.
Come prepararsi per articoli istantanei
Caricare i tuoi articoli su Facebook Gli articoli istantanei sono facili come installare un plug-in?
Sì e no.
Partecipare al programma è un processo a passi di 11.
Facebook ha cercato di rendere le cose molto più semplici creando una guida che ti guiderà attraverso l'intero processo, ma prima puoi iniziare inviando la tua organizzazione all'approvazione di Facebook. Non puoi fare domanda per aderire al programma prima di aprile, tuttavia puoi dirlo Facebook che ti interessa al programma, il che probabilmente significa che ti faranno sapere quando il programma sarà disponibile.
Per ora, ecco 3 cose che devi fare per essere pronto quando il programma sarà effettivamente lanciato per tutti gli editori (autori).
Fase uno: assicurati di avere una presenza efficace su Facebook
La presenza della tua organizzazione su Facebook e la tua familiarità con la piattaforma devono essere efficaci.
Innanzitutto, devi assicurarti che la tua organizzazione abbia una pagina e che tu sia l'amministratore o l'editore. Potrebbe anche essere necessario creare un account Business con il gestore dell'account aziendale, se la tua organizzazione non dispone di una pagina, puoi aggiungere una pagina al tuo account e aggiungere altri membri della tua organizzazione alla tua pagina utilizzando il Gestore account aziendale.
Instant Articles è gestito direttamente dall'interfaccia di gestione dell'account aziendale, quindi devi ricordarti di configurare il tuo account aziendale, in modo da non doverlo fare in seguito.
Se non lo usi, puoi scaricare l'app Facebook Pages. Puoi trovarlo su App Store per usarlo su iPhone o iPad o su Google Play Store. È necessaria questa app per visualizzare in anteprima gli articoli istantanei. Puoi testare la funzione per vedere come funziona.
Passo 2: Costruisci la tua RSS per Instant articoli
Instant Articles è assemblato su Facebook utilizzando contenuto HTML importato dal feed RSS formattato in un modo specifico. Per integrare il tuo sito web con gli articoli istantanei, devi generare un feed RSS appositamente formattato, ecco un plugin che puoi usare per questo.
Il plugin creato in collaborazione con Automattic et decodificare, potrebbe eventualmente essere aggiunto alla directory ufficiale dei plugin di WordPress. Per ora, puoi semplicemente scaricare il plugin direttamente da Github.
Il plugin verrà scaricato in formato ZIP e hai due opzioni per installare il plugin:
Puoi installare il plugin direttamente dalla dashboard di WordPress usando il file ZIP.
Per il momento, l'installazione del plugin non aggiungerà un pannello di amministrazione. Mentre il file readme.txt su Github afferma che i filtri possono essere utilizzati per manipolare ciò che appare nel feed RSS, non sono state fornite istruzioni e i filtri implementati e richiede la modifica manuale dei file. . Inoltre, le note menzionano che i filtri possono cambiare nel tempo. Ti consigliamo di utilizzare il feed predefinito.
Quindi puoi andare avanti e modificare l'URL attraverso il quale desideri generare la funzione Articolo istantaneo. Per fare questo, devi aprire il file chiamato "facebook-instant-articles.php" e trovare la costante "INSTANT_ARTICLES_SLUG". Nella versione 0.1 del plugin, si trova alla riga 18. È quindi possibile rimuovere "instant-articles" e inserire lo slug che si desidera utilizzare.
Dopo aver apportato tutte le modifiche necessarie, puoi andare su Impostazioni> Permalink. Questo aggiornerà le regole di riscrittura e il nuovo slug avrà effetto. Ora potresti essere in grado di individuare l'URL del tuo articolo istantaneo.
Passaggio 3: iscriviti al programma e segui i passaggi
Il prossimo passo è aspettare che Facebook lanci ufficialmente il programma. Se sei un'organizzazione e sei interessato al programma, puoi farlo fargli sapere di Facebook.
Puoi prendere il tempo per rivedere la guida introduttiva che Facebook ha messo insieme. Questo ti preparerà a essere pronto quando il programma sarà disponibile.
Passaggio 4: limitare il flusso a elementi non più vecchi di 24 ore
Lo farai solo dopo essere stato accettato per il programma.
Quando ti iscrivi al programma Instant Articles, Facebook vorrà vedere almeno 50 articoli sul tuo feed RSS. Tuttavia, una volta che il tuo feed RSS viene importato per la prima volta, Facebook ignorerà gli articoli che non sono stati aggiornati nelle ultime 24 ore. Per questo motivo, quando la tua organizzazione viene aggiunta al programma e il tuo feed viene importato, potrai farlo modificare il flusso per includere solo gli elementi che sono stati modificati nelle ultime 24 ore.
Per apportare questa modifica, devi scaricare una copia del file "facebook-instant-articles.php" che puoi ripristinare se qualcosa non funziona normalmente. In questa copia, è necessario definire una costante "INSTANT_ARTICLES_LIMIT_POSTS" su "true". Probabilmente avrà più senso aggiungere questa costante appena prima della condizione "if", per definire se il flusso sarà limitato o meno. Nella versione 0.1 del plugin, lo troverai alla riga 150.
Tutto quello che devi fare ora è salva le tue modifichee accedi al tuo feed RSS. Sarai in grado di visualizzare articoli limitati che sono stati aggiornati 24 ore fa.
Ricorda che la tua organizzazione non sarà approvata a meno che tu non abbia più di 50 articoli già pronti. Quindi non limitare il tuo feed finché la tua organizzazione non sarà accettata nel programma e il tuo feed non sarà importato da Facebook.
Come puoi vedere, l'adesione al programma non è per tutti. E per coloro che sono veramente interessati al Servizio Assistenza, dovranno mobilitare alcuni sforzi per raggiungere i propri obiettivi.
Scopri anche alcuni plugin WordPress premium
Puoi utilizzare altri plugin di WordPress per dare un aspetto moderno e ottimizzare la presa del tuo blog o sito Web.
Ti offriamo qui alcuni plugin WordPress premium che ti aiuteranno a farlo.
1. ARPrice
ARPrice è il plugin premium WordPress più flessibile e completo per la creazione di griglie di prezzo. Contiene oltre 300 modelli di griglie dei prezzi e offre tutti gli strumenti necessari per creare griglie dei prezzi uniche e reattive, nonché tabelle di confronto. Puoi anche creare facilmente una bella vetrina per il tuo team.
È un plugin WordPress bello, intuitivo e unico, con il suo impressionante editor visivo, con un'anteprima in tempo reale delle personalizzazioni.
Scegli un modello, quindi, con semplici clic, trascina e rilascia strumenti per personalizzare la tua griglia dei prezzi, fin nei minimi dettagli. Sarai in grado di aggiungere un numero illimitato di colonne, cambiare colori, caratteri, icone e aggiungere le tue immagini e nastri per annunciare uno sconto, Per esempio.
PrivateContent è una soluzione potente ma facile da usare per la creazione di un vero sito Web di registrazione multilivello. È un plug-in compatibile con la nuova legislazione europea sulla protezione dei dati degli utenti.
Come la maggior parte dei plug-in in questo elenco, viene fornito con tutta una serie di funzionalità complete che aspettano solo l'installazione.
Proteggi i tuoi contenuti con questo plug-in WordPress premium e consenti agli abbonati di accedervi in base al ruolo o allo stato che hanno. Inoltre, è uno dei plugin più venduti in questa nicchia e merita un'attenzione speciale da parte tua.
Le plug-in Cursore dei prodotti correlati a WooCommerce è un plug-in di WordPress utilizzato per visualizzare prodotti associati a graziosi effetti. Prodotti simili provengono dalla stessa categoria o dalla stessa etichetta.
Questo plug-in ha alcune opzioni aggiuntive, che consentono all'utente di visualizzare il plug-in in diverse posizioni della pagina dei dettagli del prodotto, l'utente sarà in grado di visualizzare fino a 50 prodotti nel dispositivo di scorrimento, personalizza l'aspetto e l'aspetto del dispositivo di scorrimento.
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.
Se hai suggerimenti o commenti, lasciali nella nostra sezione commentaires.
Vuoi creare un'animazione al passaggio del mouse con Elementor?
In questo tutorial useremo una lattina di pepsi che sorvoleremo e che rivelerà una descrizione a riguardo.
Vi invitiamo a guardare il seguente video per avere un'idea di cosa vogliamo mostrarvi.
Inserisci una singola sezione di colonna, quindi nella barra laterale seleziona Altezza minima su Hauteur
Sur altezza minima clic VH quindi trascina il cursore su 100. Sempre nella scheda disposizione définir 650 come largeur.
Seleziona la colonna e sulla barra laterale del campo Allineamento verticale selezionare Mezzo.
Nella scheda Style, cambia il colore di sfondo facendo clic sul Selettore colore e digita #D37636 poi nella sezione confine, prendiamo 20 per tutti i raggi di cordolo.
Nella scheda avanzato, disattiva la rilegatura del riempimento e digita 75 per margini interni Haut et Basso et 25 per margini interni Goffo et Diritto.
Quindi trascina un widget nella colonna sezione interna. Rimuoviamo una delle colonne dalla sezione Interna.
Nella colonna della restante sezione interna, rilascia il Widget del titolo e cambia il titolo in Pepsi Amore.
Poi nella scheda Style, dai al testo un colore bianco e per la tipografia imposta il taille su 32, la altezza della riga su 1.2, spaziatura del carattere su 0.5.
Sotto il Widget del titolo, rilascia a Widget Editor di testo e modifica il testo. Nella scheda Style, cambia il colore del testo in bianco e il taille tipografia attiva 16, la altezza della riga su 1.5 espaziatura del carattere su 0.5.
Nella scheda avanzato cambia il margine Basso su -10%.
Nella sezione posizionamento tab avanzato, modificare il Larghezza su personnalisé e Larghezza Personalizzata impostare quest'ultimo su 310.
Sotto il paragrafo aggiungeremo a widget del pulsante con per il testo Per Saperne Di Più.
Nella scheda Style dai il colore al bottone Bianco e il colore del testo impostalo su Nero.
Ora seleziona la colonna del sezione interna, nella sezione avanzato tab avanzato disattivare il collegamento e fare clic sulla percentuale, quindi impostare il margine Goffo su 20 e nel Margine interno definire quello di Goffo su 20.
Ora trascina il widget di immagini sopra il Sezione interna inserire un'immagine. Abbiamo scelto per l'esempio un'immagine di una bevanda che si trova facilmente sul web.
Una volta inserita l'immagine, configurare il Dimensione dell'immagine su Totale e allineamento clicchiamo su Centro.
Nella scheda avanzato, vai alla sezione Posizione su Larghezza selezionare In linea (automatico)Su Posizione selezionare assoluto e Orientamento orizzontale selezionare Destra poi spostamento entrare -9.9% e sul spostamento dell'Orientamento verticale entrare -105%.
Vai più in basso Sezione Trasforma definire ridimensionare su 0.5.
Ora seleziona la colonna del Sezione interna e nella scheda avanzato inserire il nome del classi CSS testo pepsi.
Quindi seleziona la nostra sezione principale, vai alla sezione CSS personalizzato della sua Tab Avanzate, copia e incolla il seguente codice:
Ora se vogliamo rimuovere il colore di sfondo dal testo, selezioneremo la nostra colonna principale e nella scheda Stile disattiveremo il colore di sfondo.
A questo punto, l'animazione verrà eseguita normalmente sul browser.
Anche l'animazione su tablet sembra essere perfetta
Ma su smartphone, non viene visualizzato normalmente. Risolviamo questo problema.
Mostriamo il browser
Nel browser seleziona Sezione (assicurati di essere ancora in modalità smartphone) e abbassa il Larghezza su 320
Quindi seleziona la colonna principale e nella sua scheda Avance, imposta tutti i margini interni su 25
Nel browser, seleziona l'immagine e nella scheda Style, Cliquez sur PX de Larghezza e impostalo su 180.
Nella scheda avanzato du Widget immaginedai Posizionee selezionare assolutoin spostamento orizzontale entrare 75 ed in spostamento verticale entrare 236. In breve, assicurati di centrare l'immagine al centro del cerchio usando i diversi offset.
Ora puoi visualizzare in anteprima la tua animazione su diversi dispositivi.
Ecco ! Questo è tutto per questo articolo che ti mostra come creare un'animazione al passaggio del mousein Elementor. Se hai dubbi su come arrivarci, ci piacerebbe avere tue notizie nel commentaires.
Riservatezza e cookies: questo sito utilizza cookies. Continuando a navigare su questo sito, acconsenti al nostro utilizzo.
Per saperne di più, compreso come controllare i cookie, vedere quanto segue:
Politica sui cookie
