Inserire un avviso nei topic chiusi

Da **Niko** Dom 17 Gen 2021 - 16:27

Inserire un avviso nei topic chiusi

in questo tutorial imparerai come aggiungere un avviso sugli argomenti bloccati. Può essere utile per i membri capire meglio. Ecco un'immagine di come sarà.

Installazione

Il procedimento è molto semplice, basta andare verso Pannello di amministrazione ► Moduli ► HTML e JavaScript ► Gestione del codice JavaScript e creare un nuovo codice con queste caratteristiche:

Titolo: a tua scelta
Dove: negli argomenti
Codice:
Codice:
$(function(){ $('.bodyline #page-body:has(#i_reply[alt*="locked"]), #main-content:has(.i_reply[alt*="locked"])').prepend('<div class="topic-warning-block" align="center">Siamo spiacenti, questo topic è chiuso e quindi non accetta nuove risposte.</div>'); });

Installazione CSS

In modo analogo andiamo verso Pannello di amministrazione ► Visualizzazione ► CSS ► Foglio stile CSS e aggiungiamo questo codice, interamente personalizzabile da voi, nel nostro foglio di stile:

Codice:: .topic-warning-block { border: 1px solid; margin: 10px 0px; padding: 15px 10px 15px 50px; background-repeat: no-repeat; background-position: 10px center; background-image: url(https://1.bp.blogspot.com/_5rlxf3T9Z9U/SsIXuytpYfI/AAAAAAAADcI/I4Tm0W5gDQk/lock_32.png); color: #750000 !important; background-color: #D26067; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; text-align: center; font-weight: bold; font-size: 18px; text-shadow: 1px 1px 1px #AAA; }

Personalizzazione

Elementi Javascript

E' possibile modificare il testo visualizzato andando a modificare la scritta Siamo spiacenti, questo topic è chiuso e quindi non accetta nuove risposte. presente all'interno del codice.

Elementi CSS

border - 1px: imposta lo spessore del bordo. Aumenta il numero di px per aumentare lo spessore.
border - solid: imposta il design del bordo. Scegli tra solido o tratteggiato.
margin - 10px: imposta lo spazio del margine per la parte superiore e inferiore. Aumenta il numero di px per aumentare lo spazio.
margin - 0px: imposta lo spazio del margine per destra e sinistra. Aumenta il numero di px per aumentare lo spazio.
background-image:Visualizza un'immagine per lo sfondo. Cambia l'URL all'interno della parentesi per modificare l'immagine di sfondo.
color: imposta il colore del testo per l'avviso.
background-color: imposta il colore per lo sfondo dell'avviso.
border-radius: imposta quanto saranno arrotondati i bordi del bordo. Aumenta il numero di px per aumentare la rotondità.
text-align: imposta l'allineamento del testo.
font-weight: imposta il volume del testo in grassetto.
font-size: imposta la dimensione del carattere. Aumenta il numero di px per aumentare la dimensione del testo.
text-shadow: imposta l'ombra e il colore del testo.