Come aprire un video in una finestra pop-up o PopUp con Lightbox in Divi facendo clic su
Aggiungere contenuti da altre pagine è davvero molto semplice, perché attraverso la codifica della tua pagina devi solo ancorare il link a cui vuoi reindirizzare.
Tuttavia, alcuni utenti (incluso te) desiderano che il collegamento di reindirizzamento venga aperto in una nuova scheda in modo che il lettore non lasci la pagina.
Attraverso la piattaforma WordPress anche questo è possibile, anche in diverse tipologie di template come Divi che hanno rivoluzionato il design di questi siti.
Cos’è Divi e per cosa funziona?
Come accennato in precedenza, Divi è un modello WordPress che consente agli utenti di progettare qualsiasi cosa possano immaginare.
Il suo metodo di lavoro è attraverso un costruttore visivo chiamato Divi Builder che non merita il layout e la codifica HTML da zero per creare il design, poiché consente di aggiungere gli elementi «trascinandoli e rilasciandoli» all’interno della pagina. Divi ha anche una libreria di layout preimpostati.
Non richiede installazione, quindi devi solo accedere al » Menu » di WordPress, cercare la sezione » Aspetto » e inserire » Temi » per assicurarti che sia presente.
Allo stesso modo, il suo builder può essere utilizzato tramite l’opzione » Post e pagine » per selezionare il pulsante » Usa Divi Builder » sotto il titolo del post.
Scopri come aprire un video o un PopUp in una finestra pop-up con Divi!
Sebbene Divi sia caratterizzato dall’essere un visual builder che consente di progettare qualsiasi tipo di sito Web con gli elementi che l’utente può immaginare, a volte è necessario utilizzare un plug-in o scrivere codice per creare funzioni specifiche per la propria pagina.
L’esempio seguente viene utilizzato per aprire un video di YouTube in una finestra pop-up (chiamata anche PopUp o Lightbox) con la semplice pressione di un pulsante.
Codice JQuery che attiverà la funzione popup
<tipo di script = «testo / javascript»>
(funzione ($) {
$ (documento).ready (funzione () {
// $ (‘#IDname a’).addClass (‘popup-video’);
$ ((‘popup-video’). magnificPopup ({
disabilita On: 100,
tipo: ‘inframe’,
mainClass: ‘mfp-fade’,
Ritardo rimozione: 160,
precaricatore: falso,
fixedContentPos: false
});
});
}) (jQuery)
</script>
Per cambiare il colore di sfondo della finestra che apparirà una volta che la persona avrà premuto il pulsante, viene applicato il seguente codice:
.mfp-bg {
Sfondo: # 673ab7;
}
Nel caso in cui si voglia impostare un altro colore, è sufficiente inserire il codice per il quale si desidera modificarlo e salvare.
Vantaggi dell’utilizzo di Divi in WordPress
Oltre a consentirci di aprire un video o un PopUp in una finestra pop-up, questo builder ha anche molte virtù di cui puoi goderti quando inizi a riprodurlo nelle tue creazioni.
È un builder con un metodo di usabilità molto semplice, che si adatta a più linguaggi e stili di design che possono essere integrati nella comunità di WordPress.
A sua volta, integra lo stile del responsive design, potendo così integrare elementi che possono essere visualizzati solo su computer o dispositivi.
La modifica del suo contenuto viene eseguita in tempo reale, quindi non sarà necessario premere un pulsante » Anteprima » per poter vedere come appare la pagina ad ogni modifica.
Inoltre, non è necessario conoscere il linguaggio HTML e CSS per creare stili e, se ne hai la conoscenza, ti consente di personalizzare il codice di ciascun elemento.
Ogni disegno che realizzi può essere archiviato in una » Libreria » in modo che sia a tua disposizione quando desideri riutilizzarlo su qualsiasi altra pagina o voce.
Ha anche più strumenti che renderanno la tua pagina più attraente e più facile da usare per il lettore. Così come la possibilità di includere BreadScrumb per migliorare la SEO, comprimere la barra laterale per migliorare la lettura del lettore o correggere il piè di pagina.
Infine, attraverso il suo costante aggiornamento, sarai in grado di mantenere la sicurezza del tuo sito web e dei suoi contenuti all’interno della piattaforma.
