Come comprimere facilmente la barra laterale in Divi
Come comprimere la barra laterale in Divi?
Bene, per prima cosa dovresti sapere che dovrai accedere ad alcuni codici sulla pagina per poter modificare questa opzione.
È necessario gestire i seguenti codici per poter comprimere la Sidebar, il primo sarà quello di far scomparire la barra ma allo stesso tempo sarà solo un pulsante che l’utente potrà utilizzare per aprire e chiudere la barra.
Rendi pieghevole la barra laterale
@media solo schermo e (min-KID: 981px) {
/ * Pulsante espandi / comprimi barra laterale * /
#db_hide_sidebar {
indice z: 10000;
imbottitura: 10px;
cursore: puntatore;
}
.db_right_sidebar_collapsible #db_hide_sidebar {
destra: 0;
}
.db_left_sidebar_collapsible #db_hide_sidebar {
sinistra: 0;
}
.et_fixed_nav #db_hide_sidebar {
posizione: fissa;
}
.et_non_fixed_nav #db_hide_sidebar {
posizione: assoluta;
}
#db_hide_sidebar: prima di {
famiglia di caratteri: ‘ETModules’;
dimensione del carattere: 24px;
}
.et_right_sidebar #db_hide_sidebar: prima,
.db_left_sidebar_collapsible.et_full_width_page #db_hide_sidebar: prima di {
contenuto: ‘\39’;
}
.db_right_sidebar_collapsible.et_full_width_page #db_hide_sidebar: prima,
.et_left_sidebar #db_hide_sidebar: prima di {
contenuto: ‘\38’;
}
/ * Assicurati che la formattazione a larghezza intera corrisponda alla formattazione della barra laterale * /
.db_sidebar_collapsible.et_full_width_page.et_post_meta_wrapper: primo figlio {
padding-top: 58px! importante;
}
}
</style>
<script>
jQuery (funzione ($) {
if ($ (‘# barra laterale’). lunghezza) {
if ($ (‘body.et_right_sidebar’). lunghezza) {
$ (‘body’) addClass (‘db_sidebar_collapsible db_right_sidebar_collapsible’);
$ (‘# contenuto principale’).
$ (‘<span id = «db_hide_sidebar» title = «Toggle Sidebar»> </span>’).click (function () {
$ (‘corpo’) toggleClass (‘et_right_sidebar et_full_width_page’);
$ (‘# barra laterale’).toggle ();
})
);
$ (‘corpo’) addClass (‘db_collapsible_sidebar’);
} else if ($ (‘body.et_left_sidebar’). lunghezza) {
$ (‘body’) addClass (‘db_sidebar_collapsible db_left_sidebar_collapsible’);
$ (‘# contenuto principale’).
$ (‘<span id = «db_hide_sidebar» title = «Toggle Sidebar»> </span>’).click (function () {
$ (‘corpo’) toggleClass (‘et_left_sidebar et_full_width_page’);
$ (‘# barra laterale’).toggle ();
})
);
}
}
});
</script>
Dovrai solo copiarlo e accedere a WordPress, una volta lì, individua la sezione Divi e seleziona » Opzioni del tema «.
Seleziona la scheda » Integrazione «, ora abilita l’opzione » Abilita codice intestazione «, continua ad incollare il codice nella sezione » Aggiungi codice all'<head> del tuo blog «.
Una volta copiato il codice, devi solo salvare le modifiche e aggiornare la pagina live del tuo blog in modo da poter vedere la modifica. Apparirà una freccia accanto alla barra laterale che ti consentirà di aprire e chiudere facilmente la barra laterale.
Rimuovi la barra di divisione tra il contenuto e la barra laterale
Vi lasciamo un secondo codice con il quale potrete rimuovere la barra che divide lo spazio tra il contenuto del blog e la Sidebar.
Con questa funzione, comprimendo la barra laterale in Divi, il blog sarà più ampio quando il lettore comprime la barra grazie alla freccia che hai posizionato. Il codice è il seguente:
# main-content.container: before {background: none;}
Ora devi ripetere i passaggi precedenti, con l’unica differenza che il codice va incollato nella sezione » Custom CSS «, salvare le modifiche e aggiornare la pagina live del tuo blog.
consigli
Molti utenti utilizzano i propri smartphone per accedere ai propri blog preferiti, quindi si consiglia di gestire i contenuti in modo da facilitarne la lettura. Un altro modo per ottenere questo risultato è aggiungere un menu comprimibile al tuo sito web.
I contenuti del tuo blog devono essere organizzati, in modo da generare una migliore leggibilità, questo aiuta molte persone a seguire i contenuti che pubblichi.
Puoi aggiungere diverse opzioni al tuo blog che lo rendono più interattivo, come moduli di contatto o sezioni di commento.
Ora ti consigliamo che se hai social network e hai contatti con i tuoi lettori, prendi in considerazione i loro consigli, ma mantenendo sempre l’essenza dei tuoi contenuti.
In questo modo generi engagement con i contenuti che produci, questo manterrà il tuo blog sempre pieno di visite, puoi anche utilizzare i link ad alcuni prodotti o pagine che consigli e così monetizzare un po’ il tuo lavoro.
Un’informazione importante che ti aiuterà a ottenere visite al tuo blog o sito web è utilizzare BreadScrumb per migliorare la SEO e attirare visitatori.
Infine, speriamo che i nostri consigli e questo articolo ti siano di grande aiuto per migliorare la visualizzazione del tuo blog.
