Wiki della Community
Advertisement
Wiki della Community

Stai creando dei codici personalizzati per la tua community o per il tuo account? In questa pagina trovi i dettagli che possono aiutarti in entrambi i casi.

Prima di iniziare, però, potresti trovare utile consultare quali pagine possono essere usate per la personalizzazione. Se stai pensando di scrivere del codice JavaScript per la tua community, devi chiedere che venga abilitato contattando il supporto di Fandom e familiarizzarti con il processo di revisione Javascript. Per informazioni più generali, vedi Aiuto:Personalizzare CSS e JS.

Personalizzazione di pagine specifiche[]

CSS[]

L'elemento HTML <body> degli articoli include un identificatore univoco basato sul nome della pagina. Per esempio, su questa pagina di aiuto, la classe è .page-Aiuto:CSS_e_JS_avanzati.

Il formato generale è .page-[titolo articolo], dove gli spazi, i due punti, e gli altri caratteri speciali sono sostituiti da trattini bassi (_).

JavaScript[]

In Mediawiki:Common.js, utilizza il comando "switch" per applicare il JavaScript solo ad alcune pagine:

switch (mw.config.get('wgPageName')) {
    case 'nome pagina':
        // questo JS sarà applicato a "nome pagina"
        break;
    case 'altra pagina':
        // questo JS sarà applicato a "altra pagina"
        break;
}

Applicare CSS e JS a community specifiche[]

Nel tuo CSS personale, puoi aggiungere una classe prima di ogni altro selettore CSS che ti permette di modificare gli stili che il tuo account vede su wiki specifiche.

Questa classe è basata sul nome di database della community, non il suo URL — questi sono tipicamente, ma non sempre, gli stessi. Il formato è:

.wiki-[nome di database]

o, per una wiki internazionale:

.wiki-[codice lingua][nome di database]

Per esempio, se volessi rendere parte dello sfondo di Wookieepedia rosso per te, dovresti aggiungere questo nel tuo file global.css:

.wiki-starwars .page__main { background-color:red; }

Per JavaScript, wgDBname può essere usato per selezionare una community specifica.

Ordine di caricamento[]

L'ordine di carimento generale sia per il CSS che per JS è:

  1. Codice base di Fandom
  2. codice della community locale
  3. codici personali

All'interno di ogni livello, l'ordine di caricamento è prima Common, poi Fandomdesktop. Questo significa che se avete settato .class { color: red; } in Common.css, ma .class { color: green; } in Fandomdesktop.css, la .class sarà verde. E poiché il CSS personale è l'ultimo ad essere caricato, qualsiasi cosa metterai lì sovrascriverà sempre le scelte locali della wiki.

Ciò implica anche che se stai importando CSS o font personalizzati — e la tua wiki ha sia Common.css e Fandomdesktop.css — questi import devono essere in cima a Common.css.

Per JS, l'ordine di caricamento è particolarmente importante quando si considera come usare al meglio MediaWiki:ImportJS. Poiché ImportJS è caricato per ultimo, puoi inserire la tua personalizzazione degli script dalla Dev Wiki in Common.js o Fandomdesktop.js, ma avere l'import vero e proprio dello script in ImportJS. Il l'ordine di caricamento completo di JS è:

  1. Common.js
  2. Fandomdesktop.js
  3. Script importati attraverso Common.js
  4. Script importati attraverso Fandomdesktop.js
  5. ImportJS

Infine, ricorda un'ovvietà: la pagine sono caricate dall'alto in basso. Ciò significa che le dichiarazioni in cima alla pagna possono essere sovrascritte da quelle in basso.

!important nel CSS[]

A causa dell'ordine di caricamento dei CSS, a volte potrebbe esserti necessario far uso della proprietà !important " per assicurarti che una regola del CSS venga applicata. Ma !important dovrebbe essere evitato quando possibile con l'uso di selettori CSS specifici (anche fin troppo specifici).

Problemi di cache[]

Ogni file scaricato da internet viene memorizzato nella cache. Di solito questa è una buona cosa perché riduce il traffico sia per il tuo dispositivo sia per i server di FANDOM, ma può diventare un problema quando si stanno provando dei cambiamenti di design. Può essere necessario un po' di tempo prima che i cambiamenti abbiano effetto, a meno che non bypassi la tua cache.

Se bypassare la cache non funziona, puoi provare a debuggare il tuo codice aggiungendo ?debug=1 alla fine dell'URL di ogni pagina. Debuggare il tuo codice significa che il codice è quasi garantito al 100% che caricherà gli script e/o i figlio di stile aggiunti di recente.

Frammenti popolari di JavaScript[]

Per avere un'idea di alcuni script creati da altri che potresti trovare utili o voler provare, dai un'occhiata alla lista di miglioramenti JavaScript nella Fandom Developers Wiki.

JavaScript duplicati[]

Alcuni script possono creare problemi se vengono eseguiti più volte nella stessa pagina. Assicurati di scrivere il codice in modo che ogni suo pezzo sia eseguito solo una volta. Evita di incollare lo stesso codice in più file perché è probabile che provochi conflitti e causi confusione sia a te sia agli altri visitatori.

Disabilitare temporaneamente il CSS/JS[]

I CSS e JS personalizzati possono essere temporaneamente disabilitati usando i seguenti comandi.

I comandi dovrebbero essere aggiunti alla fine dell'URL (Esempio: https://community.fandom.com/it/wiki/Speciale:Random?usesitecss=0. [Questo esempio disabilita il CSS del sito]).

Se è necessario più di un comando, invece del punto interrogativo (?), inserisci una "e" commerciale (&) per il secondo, terzo e quarto comando (nel caso ci siano) (Esempio: https://community.fandom.com/it/wiki/Speciale:Random?usesitecss=0&useuserjs=0. [Questo esempio disabilita il CCS del sito e il JS personale]).

Ecco una tabella di tutti i comandi CSS/JS.

Comando Azione
?useusercss=0 Disabilita tutto il CSS che è stato aggiunto nella tue pagine CSS personali.
?useuserjs=0 Disabilita tutto il JS che è stato aggiunto nella tue pagine JS personali.
?usesitecss=0 Disabilita tutto il CSS che è stato aggiunto nel CSS locale della wiki.
?usesitejs=0 Disabilita tutto il JS che è stato aggiunto nel JS locale della wiki
?safemode=1 Disabilita tutto il CSS e JS personalizzato, del sito e personale.

Controllo degli errori negli editor di CSS e JS[]

Gli editor di CSS e JS hanno attivo il controllo degli errori ("linting") e la syntax highlighting:

  • Mentre digiti il codice, la pagina ti fa sapere se si verificano errori nella sintassi.
  • Ricorda che non tutti i problemi (errori) devono essere risolti: la tecnologia CSS (e anche JS) è in continua evoluzione e i browser non si comportano tutti allo stesso modo, perciò alcuni messaggi di errore potrebbero non richiedere alcuna azione.

Problemi comuni[]

Problemi con il CSS
Problema Spiegazione
@import prevent parallel downloads, use <link> instead I tag Link sono usati di solito per importare CSS. Tuttavia, MediaWiki non supporta l'aggiunta di tag link personali senza l'uso del JS, perciò normalmente questo errore può essere ignorato. Usare @import è il metodo consigliato.
Expected X but found Y Vuol dire che hai digitato un valore non valido per una proprietà. Per esempio, in color: foo; il valore foo, inserito per la proprietà "color" (colore), non è valido perché non è un colore.
Use of !important !important in generale dovrebbe essere evitato nel CSS perché rende più difficile mantenerlo, e rende anche più difficile per gli utenti sovrascrivere le impostazioni nel loro CSS personale. Quasi sempre, se si utilizza il selettore corretto si riesce a evitare di usare !important.
Unknown property 'codename' Sebbene non tutti i codici CSS siano riconosciuti dallo strumento (dato che lo stesso CSS viene aggiornato frequentemente), alcuni codici CSS possono ancora essere letti quando vengono eseguiti per un dato oggetto nella pagina di Fandom (per esempio, mix-blend-mode: color-dodge;).

Vedi anche[]

Navigazione[]

Contenuti
Per iniziare
Il tuo account Registrazione  • Login  • Preferenze  • Cambiare username
La tua wiki Creare una wiki  • Barra dei progressi della wiki  • Fondatori  • Tipi di utenti
Funzioni di Fandom Bacheca  • Notifiche  • Blog  • Discussioni
Consigli Profilo  • Avatar  • Creare una wiki di successo  • Errori comuni
Contribuire
Aggiungere contenuti Nuova pagina  • Modifica  • Immagini  • Video
Formattazione VisualEditor  • Wikitext  • Stile della pagina  • Testo
Strumenti Ultime modifiche  • Cronologia  • Barra degli strumenti  • Pagina di discussione  • Commenti
Suggerimenti Redirect  • Layout  • SEO  • La funzione Consigli  • Linee guida per le community
Gestione della community
Impostazioni Wiki Funzioni  • Pagine speciali  • Estensioni  • Protezione delle pagine
Strumenti per gli admin Pannello di controllo Admin  • Blocco degli utenti  • Pannello Wiki Analytics
Design Theme Designer  • Menù di navigazione  • Pagina principale
Trucchi per la gestione Guida per gli Amministratori  • Costruire una community  • Regolamenti di una wiki  • Integrazione con i social
Nozioni avanzate
Estensioni Sondaggi  • Note  • DPL  • Mappe  • Funzioni parser
Strumenti & scorciatoie Messaggi di sistema  • Wikitext avanzato  • Parole magiche  • Esportare e importare pagine  • Caricare file multipli  • HTML
Consigli Titolo della pagina  • Descrizione  • Pratiche migliori per wikitext
Personalizzazione
Personalizzazione di base Theme Designer  • Sfondo  • Favicon  • Logo
Personalizzazione esperta Regole sulla personalizzazione  • CSS e JS della community  • CSS e JS personali  • CSS e JS avanzati
Tabelle e template Tabelle  • Infobox  • Template  • Parametri dei template
Altro... Tag per la pagina principale  • Gallerie, slideshow e slider  • Lua
Mobile
Panoramica e consigli Introduzione alla versione mobile  • Pratiche migliori per wikitext  • Evitare tabelle nidificate
Prodotti per mobile App di Fandom
Trovare ulteriore aiuto
Consulta: Wiki della Community  • Blog di Fandom Italia  • Discussioni  • Contatta Fandom  • Politiche di Fandom  • Aiuto di MediaWiki
Advertisement