Sono riuscito a trovare la soluzione al mio problema di cambiare gli emoticon e volevo condividerla, magari a qualcuno può tornare utile
Premetto che ci sarà sicuramente qualche modo più elegante per sostituire gli emoticon ma le mie conoscenze di web editing sono un po' limitate, quindi non ho trovato di meglio...
Il post è lungo perchè cerco di spiegare tutti i passaggi
Il mio problema era quello di cambiare gli emoticon (le icone) che compaiono nei forum, che hanno un look un po' troppo anni 90 a differenza delle icone dell'area corsi del backend che sono state rinnovate in Forma.
Gli emoticon che possono essere scelti quando si crea un nuovo forum si trovano in templates/standard/images/emoticons
Per cambiarli servono:
1. le nuove icone (tutte di dimensioni 22px per 22px)
2. un CSS Sprite generator
3. alcune modifiche in tre file
1. Le nuove icone (meglio se png o gif) vanno copiate nella cartella templates/standard/images/emoticons.
Le vecchie icone possono essere eliminate.
In alternativa si può create un nuovo template e fare tutte le operazioni nel nuovo template lasciando invariato quello standard: per comodità riporto percorsi e cartelle del template standard, se create un nuovo template le operazioni vanno ovviamente fatte nelle cartelle del nuovo template.
2. Forma (e Docebo) gestiscono le icone utilizzando la tecnica CSS Sprite, che prevede l'uso di una sola immagine che contiene tutte le icone, e prevede una serie di istruzioni nei CSS che indirizzino di volta in volta il browser verso l'icona giusta.
Per risparmiare tempo nella creazione dei file e di parte delle istruzioni ho usato un CSS Sprite generator gratuito: ce ne sono tanti su internet, io ho usato quello a questo indirizzo
http://css.spritegen.com/ ma vanno bene anche altri.
Il CSS Sprite generator produce due tipi di output: l'immagine contenente tutte le icone e alcune righe di codice da adattare e copiare successivamente in alcuni file php di Forma.
Per configurare il CSS Sprite generator ci vogliono 2 minuti e bisogna :
- caricare singolarmente o in blocco le icone (o averle sotto mano se il software è in locale)
- specificare il formato output del file che contiene tutte le icone (png, gif o jpg), un eventuale suffisso per le classi del CSS (in forma il suffisso è "emo-") e l'eventuale distanza tra le icone (padding...potete scegliere quella che volete, serve solo al CSS Sprite generator per creare il file e le righe di codice)
L'immagine contenente tutte le icone deve essere salvata con il nome "emoticon_sprite.png" in templates/standard/images/emoticons (è il nome che ha attualmente, salvarla con un altro nome significa cambiare il nome anche nel CSS)
3. I file da modificare sono tre:
a) il file templates/standard/style/lms-to-review.css righe 350-425.
Al momento si trovano una serie di istruzioni come queste:
.emo-access span { background-position: 0 0; }
.emo-agent span { background-position: 0 -44px; }
...
Devono essere sostituite con tante righe quante sono le nuove icone.
Il CSS Sprite generator dovrebbe aver generato parte del codice da copiare, comunque ogni icona deve avere una riga con la sintassi:
.emo-nomeicona1 span { background-position: X -XXpx; }
b) il file /appLms/modules/forum/forum.php righe 3707 e seguenti.
Al momento si trovano una serie di istruzioni come queste:
function getEmoticonsArr() {
return array(
'access',
'agent',
...
'access' 'agent' ecc sono i nomi delle vecchie icone.
Vanno sostituiti con i nomi delle nuove icone (senza il prefisso .emo-)
Le righe 3707 e seguenti diventano quindi:
function getEmoticonsArr() {
return array(
'nomeicona1',
'nomeicona2',
...
c) il file appLms/modules/public_forum/public_forum.php righe 3904 e seguenti.
Vanno compiute le stesse operazioni del punto b)
A questo punto basta rientrare in piattaforma, fare 1-2 refresh se necessario e nell'elenco delle icone si troveranno quelle nuove.
Le icone precedentemente inserite cambiano automaticamente con quelle nuove.
Se è stato creato un nuovo template andrà assegnato agli utenti/gruppi/nodi ecc.
Maurizio
