Vai al contenuto

Icone dei nodi con immagine personalizzata


Askancy

Messaggi raccomandati

  • Admin

Volete che ogni nodo abbia la sua icona, che ne indica se è stato letto tutto o no?

< nodo da leggere>

Screenshot 2019-11-09 at 11.51.11.png

< nodo non letto>

Screenshot 2019-11-09 at 11.51.00.png

 

Per aggiungere un icona a un nodo, è necessario aggiungere un codice CSS/LESSal nostro extra.less che possiamo trovare in:

AdminCP->Aspetto->Stili->Modelli-> cercare extra.less in ordine alfabetico o tramite il menu cerca.

Aggiungere:

/*** Node icons with image **/
.node.node--idXXXXX {
    .node-icon i { display: none; }

    &.node--forum {
        .node-body {
            /*padding-left: 5px;*/
        }
        .node-icon {
            background-image: url('/images/your_image.png');
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }
        &.node--read .node-icon {
            opacity: 0.4;
        }
    }
}
/*****/

In questo codice dovrete modificare XXXXX con l'ID del forum

Sostituisci /images/your_image.png con l'icona presente sul tuo server.

Inoltre, se il tuo nodo è una categoria o un link, devi cambiare .node--forum in .node--category.node--page.node--link.

Ovviamente potete scegliere il posizionamento dell'icona levando i /* */ dal commento del padding-left.

Cambiare icona tutta uguale a tutti i nodi

Per farlo la procedura è la stessa, quello che cambia è il codice CSS/LESS da inserire in extra.less:

 

/*** Node icons with image **/
.node {
    .node-icon i { display: none; }

    &.node--forum, &.node--category {
        .node-body {
            /*padding-left: 5px;*/
        }
        .node-icon {
            background-image: url('/images/your_image.png');
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }
        &.node--read .node-icon {
            opacity: 0.4;
        }
    }
}
/*****/

 

 

Fonte

Link al commento
Condividi su altri siti

Crea un account o accedi per lasciare un commento

Devi essere un membro per lasciare un commento

Crea un account

Iscriviti per un nuovo account nella nostra community. È facile!

Registra un nuovo account

Accedi

Sei già registrato? Accedi qui.

Accedi Ora
  • Chi sta navigando   0 utenti

    • Nessun utente registrato visualizza questa pagina.
×
×
  • Crea Nuovo...

Informazioni importanti

Abbiamo inserito dei cookies nel tuo dispositivo per aiutarti a migliorare la tua esperienza su questo sito. Puoi modificare le impostazioni dei cookie, altrimenti puoi accettarli cliccando su continua. to insert a cookie message.