[Risolto] Widget in HTML personalizzato mal formattato

[adm3004]

Salve,

mi occupo del web design del sito del "mio" circolo di scacchi e ho deciso di aggiungere nel sito un widget da parte di un altro sito. Il widget visualizza una scacchiera interattiva con un puzzle giornaliero da risolvere.

Ho inserito il widget creando un modulo del tipo "Personalizzato", modificato attraverso un utente amministratore fittizio che avesse l'editor none tra i parametri. Il modulo è posizionato in una position "Right top (position-6)" del template Helix3 di Joomla 3.

Nonostante le accortezze, il widget viene visualizzato senza la corretta formattazione ovvero le caselle della scacchiera escono dal riquadro che dovrebbe contenerle. Allego schermata per completezza.

Ho pensato che non tutte le impostazioni dell'user fittizio siano corrette (come editor none) ma non ne sono sicuro. Qualcuno sa aiutarmi?

Grazie.

Alessio

[adottauncane]

Ciao,
metti un link al sito, con un'immagine è impossibile aiutarti...

[adm3004]

Avevo tolto il widget perché preferivo avere il sito non "corrotto". Ho re-inserito il widget errato e il sito è il seguente:

https://www.quattrotorri.it/

il widget si trova in home page sulla destra.

Grazie.

Alessio

[adottauncane]

Sembrano mancare le misure minime per formattare la scacchiera. Puoi aggiungerle al codice?

[adottauncane]

Trovato. Fai un file custom.css nel template e mettici:

Codice: [Seleziona]

#puzzle-boardBorder {width: 190px !important; height:190px !important;}

[adottauncane]

Perché hai messo questo nel file template.css?

Codice: [Seleziona]

<script type="text/javascript" src="https://chesstempo.com/js/dailypuzzle.js"></script>
<script>
    new Puzzle({ pieceSize: 20});
</script>
Non serve...

[adm3004]

Grazie. Funziona.

Due domande:

1) come mai lo script nel file template.css non serve a niente?

2) come si configura il file custom.css in generale? Io l'ho inserito nella cartella /templates/shaper_helix3/css, lo posso mettere in altre cartelle, in modo da non essere dipendente dala template scelto?

Grazie ancora.

[adottauncane]

È uno script in un file css non viene letto.

Come hai fatto tu. È indipendente da eventuali aggiornamenti, quindi se aggiorni non viene toccato, viene richiamato del file .php del template proprio per personalizzare il template. Se le personalizzazioni le metti nel file template.css è possibile che al primo upgrade tu le perda. Quindi, se ne hai altre, mettile nel file custom.css

[adottauncane]

No, non è mai indipendente dal template scelto perché ogni template ha le sue regole. Nel caso in questione quello specifico css potrebbe funzionare anche con altri template. Nel caso lo copi e lo metti nel file personale di un altro template.
Ma non è detto che serva. Ad esempio in Protostar lo script funziona senza correzioni.

[adm3004]

Ok grazie.

C'è una regola per capire quali siano i parametri da impostare? Ad esempio, come faccio a capire che il campo da inserire nel file custom.css è #puzzle-boardBoarder?

Grazie.

Alessio

[adottauncane]

Se usi Firefox sotto Strumenti > Sviluppo web > Attiva Strumenti si apre sotto al sito l'analisi della pagina dove trovi i css che puoi provare a modificare in linea e poi riportare sul file custom.css

Nel caso del widget però non tutti puoi portarli sul tuo sito perché dipendono da un file esterno.

[adm3004]

Ok, chiaro.

Grazie.

Alessio