[RISOLTO] Blocco Categorie: multi layout

[Medicina33]

Magari qualcuno di voi ci ha già pensato.

Sarebbe utile avere la possibilità di creare layout differenti nel blocco categorie, per distinguere categorie di prodotti non attinenti tra loro.

Ad esempio, supponendo di avere 4 categorie definite:

Mele
Pere
Limoni
Arance

vorrei poter mettere uno sfondo verde alle prime 2 (Mele e Pere) e uno sfondo rosso alle ultime 2 (Limoni e Arance).

Vedete l'immagine in allegato, per capire cosa intendo.

In questo modo potrei distinguere a colpo d’occhio gli agrumi dai non-agrumi.

Qualcuno di voi, per caso, sà come poter fare?

Grazie in anticipo.

[vinoalvino]

In linea teorica è facile:

nel file category-tree-branch.tpl del modulo blockcategories dove c'è la riga

{$node.name|escape:htmlall:'UTF-8'}

potresti fare qualcosa del tipo:

{$node.name|escape:htmlall:'UTF-8'}

Non ho testato quanto scritto e probabilmente non funziona ma potrebbe essere uno spunto.

Nel css dovresti definire gli stili cat_n dove n è l'id della categoria. Non prenderei in considerazione l'idea di utilizzare i nomi delle categorie sia perchè variano a seconda delle lingue sia perché si devono togliere tutti gli spazi ed i caratteri che non possono essere utilizzati per definire una classe del css.

[Medicina33]

Grazie mille!!! L'idea era corretta ma applicata alla sezione sbagliata.

Bisogna modificare la prima linea del "category-tree-branch.tpl"

da così:

a così:

Poi, nel "global.css" bisogna rinominare il blocco:

div#categories_block_left ul.tree li

in:

div#categories_block_left ul.tree li.cat_n

dove n è il numero della categoria interessata.

Per creare un layout diverso per alcune categorie, basta duplicare il blocco di sopra e assegnargli i numeri di categorie interessati, separati da virgola.


Per esempio, facciamo finta che voglio creare 2 tipi diversi di layout per i nomi nel blocco categoria: un layout con sfondo rosso ed un layout con sfondo verde.

Supponiamo che voglio assegnare lo sfondo rosso alle categorie 1 e 3 e lo sfondo verde alle categorie 2 e 4.

Nel file global.css, duplico tutto il blocco "categories_block_left ul.tree li".

Poi, un blocco lo rinomino in "categories_block_left ul.tree li.cat_1, categories_block_left ul.tree li.cat_3" e imposto lo sfondo a "rosso". Per esempio:

div#categories_block_left ul.tree li.cat_1, div#categories_block_left ul.tree li.cat_3{
   list-style:none;
   padding-left:15px;
   background-color: red;    /* <-- Sfondo rosso */
   margin-left:-5px; 
   font-weight:bold;
   font-size:13px;
   line-height:26px;
   border-left:none;
}

L'altro blocco, lo rinomino in "categories_block_left ul.tree li.cat_2, categories_block_left ul.tree li.cat_4" e imposto lo sfondo a "verde". Per esempio:

div#categories_block_left ul.tree li.cat_2, div#categories_block_left ul.tree li.cat_4{
   list-style:none;
   padding-left:15px;
   background-color: green;    /* <-- Sfondo verde*/
   margin-left:-5px; 
   font-weight:bold;
   font-size:13px;
   line-height:26px;
   border-left:none;
}

Il gioco è fatto.

[Duma]

Ragazzi scusate ma dove si trova “category-tree-branch.tpl” vi ringrazio ma sto modificando quello in modules-->blockcategories ma non accade nulla