Nascondi barre laterali e sezioni commenti una volta per tutte
Un articolo è qualche centinaio di parole di testo circondato da un'arena di distrazioni: colonne di tendenze, barre di condivisione fisse, pannelli di autoplay e sezioni di commenti che raramente ripagano lo scorrimento. JustZix ti permette di eliminare l'arena e tenere l'articolo.
Trova cosa rimuovere
Apri la pagina, fai clic destro sul blocco fastidioso e scegli Ispeziona. Annota il suo tag, id o una class stabile. Stai cercando un selettore abbastanza specifico da colpire solo il rumore. Parole generiche come sidebar, related, recommended e promo compaiono nei nomi di classe sulla maggior parte dei siti.
Il blocco di nascondimento di base
Inizia con un elenco dei soliti sospetti. display: none rimuove l'elemento del tutto, recuperandone lo spazio:
aside,
.sidebar,
#sidebar,
.related-articles,
.recommended,
.trending,
.most-popular,
.promo, .ad-slot {
display: none !important;
}
Aggiungi o rimuovi selettori per sito. Se sparisce qualcosa che vuoi tenere, elimina la riga che l'ha catturato.
Bandisci la sezione commenti
I widget dei commenti sono pesanti, lenti e spesso un pozzo di malafede. Nasconderli velocizza la pagina e protegge il tuo umore:
#comments,
.comments,
.comment-section,
#disqus_thread,
.fb-comments,
[id*="livefyre"] {
display: none !important;
}
Elimina il disordine fisso
Header fissi, barre di condivisione flottanti e bolle di chat ti seguono giù per la pagina. Alcuni li vuoi spariti; per altri, impedisci semplicemente che restino fissi:
.share-bar,
.floating-cta,
.chat-widget,
[class*="cookie-banner"] {
display: none !important;
}
header.sticky,
.site-header {
position: static !important;
}
Cambiare un header da fixed o sticky a static mantiene la navigazione disponibile ma le impedisce di mangiare spazio mentre leggi.
Riconquista la colonna
Una volta sparita una barra laterale, la colonna principale spesso resta alla sua vecchia larghezza stretta con spazio vuoto accanto. Riallargala:
.main-content,
.content-area,
article {
width: 100% !important;
max-width: 72ch !important;
margin-inline: auto !important;
float: none !important;
}
Il float: none annulla i vecchi layout a float; la max-width poi mantiene il testo ora centrato a una misura leggibile.
Un'alternativa più sicura a display none
Se nascondere un elemento rompe uno script che se lo aspetta, neutralizzalo visivamente invece:
.related-articles {
visibility: hidden !important;
height: 0 !important;
overflow: hidden !important;
}
Salvala come regola
Crea una regola JustZix, imposta il pattern URL sul sito che hai come obiettivo, incolla i blocchi che ti servono nel pannello CSS e salva. Ricarica l'articolo — il rumore è sparito e il testo resta da solo. Costruisci una regola per ogni sito che leggi spesso, poiché i selettori variano.
Una pagina ripulita si abbina perfettamente con uno sfondo caldo e una colonna messa a punto. Vedi come creare la tua modalità lettura per il trattamento completo, prendi preset dai nostri esempi pronti all'uso, e scarica JustZix per iniziare a tagliare il disordine.
Valuta questo articolo
Nessuna valutazione — sii il primo.