Condividi le tue decorazioni di Halloween su Discourse!

[Canapin (Coin-coin le Canapin)]

Similmente a decorazioni di Natale, ecco un argomento per condividere le decorazioni di Halloween.

Spettro spaventoso

Lo spettro ha di default 1 possibilità su 10 di apparire quando si apre il compositore.

1. Carica la seguente immagine nel tuo tema/componente e imposta il nome della variabile come ghost:

Sorgente

2. Aggiungi questo JavaScript nella scheda \u003c/head\u003e del tuo tema o componente:
   Puoi aumentare o diminuire il valore della variabile rarity per far apparire lo spettro meno o più frequentemente.

   \u003cscript type="text/discourse-plugin" version="1.4.0"\u003e
   const appEvents = api.container.lookup("service:app-events");
   appEvents.on('composer:opened', () =\u003e {
       let rarity = 10 // lo spettro ha 1 possibilità su [valore di rarity] di apparire quando si apre il compositore
       if (Math.floor(Math.random() * rarity) == 0) {
           let halloweenGhost = document.createElement("img");
           halloweenGhost.id = "halloween-ghost";
           halloweenGhost.src = settings.theme_uploads.ghost;
           document.getElementsByTagName("body")[0].appendChild(halloweenGhost);
           setTimeout(function () {
               halloweenGhost.classList.add("ghost-show");
           }, 0);
           setTimeout(function(){
               halloweenGhost.remove();
           }, 1000);
       }
   });
   \u003c/script\u003e
   

3. Aggiungi questo codice nella scheda CSS:

   #halloween-ghost {
       position: fixed;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%) scale(.5);
       z-index: 10000;
       opacity: 1;
       pointer-events: none;
       transition: opacity .75s ease-in, top .75s ease, transform .75s cubic-bezier(0.175, 0.885, 0.32, 1.275);
       \u0026.ghost-show {
           transform: translate(-50%, -60%) scale(.6);
           opacity: 0;
       }
   }
   @media all and (min-width: 1024px) {
       #halloween-ghost {
           transform: translate(-50%, -50%) scale(.75);
           \u0026.ghost-show {
               transform: translate(-50%, -60%) scale(.9);
           }
       }
   }
   

Lo spettro “salta” su mobile quando appare la tastiera virtuale.

Ragnatele

Le ragnatele saranno nascoste su schermi più piccoli.

Come aggiungere questo al tuo forum:

1. Crea un nuovo componente del tema o modifica il tuo tema, carica questa immagine e imposta il nome della variabile come spiderweb:

   
   
   Sorgente

2. Aggiungi il seguente CSS al tuo tema o componente:

   @media all and (min-width: 1300px) {
      #main {
        \u0026:before, \u0026:after {
            content: "";
            display: block;
            top: 4em;
            width: 300px;
            height: 300px;
            position: absolute;
            background: transparent url($spiderweb) top left no-repeat;
            background-size: contain;
            z-index: -1;
        }
        \u0026:after {
            right: 0;
            transform: scaleX(-1);
         }
      }
   }
   

Icona teschio per il selettore emoji

Una soluzione sottile che sostituisce l’icona del sorrisino nel compositore dei messaggi con un teschio

1. Aggiungi skull nelle tue impostazioni svg icon subset:
   

   

2. Sostituisci l’icona nella scheda \u003c/head\u003e del tuo tema/componente del tema:

   \u003cscript type="text/discourse-plugin" version="0.8.23"\u003e
       api.replaceIcon('far-smile', 'skull');
   \u003c/script\u003e
   

Di conseguenza, sostituisce anche l’icona del sorrisino in altri luoghi, come il pannello di amministrazione. Ma è Halloween, no?

Jack-o’-lantern

Una semplice zucca intagliata statica posizionata in basso a destra del tuo sito:

1. Crea un nuovo componente del tema o modifica il tuo tema, carica questa immagine e imposta il nome della variabile come pumpkin:

   
   
   Sorgente

2. Aggiungi il seguente CSS al tuo tema o componente:

   body {
       background: transparent url($pumpkin) bottom right no-repeat;
       background-size: 10%;
   }
   @media all and (min-width: 1024px) {
       body {
           background-size: 7%;
       }
   }
   

È incompatibile con i forum che utilizzano già un’immagine di sfondo su \u003cbody\u003e.

Logo inquietante

Se il tuo logo utilizza testo semplice o è una semplice immagine di testo, puoi sostituire il carattere con uno più in stile Halloween.

→
Font utilizzato: Creepster

• Se il tuo logo è un’immagine, modifica l’immagine per cambiare il carattere.
• Se il tuo logo è testo reale, segui questo tutorial per cambiare il carattere usato nel logo: Include assets (e.g. images, fonts) in themes and components
  • Usa il selettore #site-text-logo nel tuo CSS.

[JimPas]

Mi farebbe molto piacere, ma ho alcuni utenti con aracnofobia che lo hanno fatto sapere abbastanza spesso, e sono tra i miei postatori più frequenti.
Mi piacciono davvero le ragnatele. Sembrano ottime!

[Canapin (Coin-coin le Canapin)]

@JimPas

Mi piacerebbe molto, ma ho alcuni utenti che hanno l’aracnofobia

È per questo motivo che non ho incluso un ragno. Ho (forse erroneamente) assunto che le persone abbiano più tolleranza solo per le ragnatele?

[Paracelsus]

Avere ragni che corrono sullo schermo e un suono ‘MUHAHAAHA’ quando si visita per la prima volta, oltre a rumori di porte che scricchiolano o catene che trascinano quando si entra in una categoria o si clicca su un argomento (in modo un po’ casuale, ad esempio ogni 20 click, altrimenti diventerebbe molto fastidioso se accadesse ogni singola volta), sarebbe fantastico anche!

[Canapin (Coin-coin le Canapin)]

Ho pensato di far apparire casualmente (e raramente) per un secondo un piccolo fantasma sullo schermo quando rispondiamo a un argomento:

[ondrej]

Che sarebbe una bella idea! Grazie per aver creato questo.

[Chaboi_3000]

Questo componente del tema creato da @Rhidian sarebbe la scelta perfetta:

Bugs theme-component

Bugs: a Discourse theme-component Did you know fruit flies were the first living creatures to be sent into space? Spiders are found on every continent of the world except Antarctica This theme component is a port and update of Auzbugs repo. It originally started out as an April fools joke and has been adapted over time. I’ve included a new bugs interact feature in this component. This is just a bit of fun : I suggest you use it sparingly, maybe just at …

[ondrej]

Ho appena aggiunto anche quello. Grazie @Chaboi_3000!

[Terrapop]

Fantastico, abbiamo appena aggiunto le ragnatele al nostro Discourse

[Canapin (Coin-coin le Canapin)]

Ho rimosso i miei ultimi post per inserirli nel primo, dato che si tratta di una wiki. Vi invito a condividere anche le vostre personalizzazioni!
Ho migliorato il codice del fantasma e aggiunto un effetto “pop-out” con una transizione di scala.

[ECoops123]

Penso di aver trovato un’idea per questo, @ondrej. Dovrebbe portare un po’ di divertimento e un’atmosfera festiva alla community; mi piacerebbe molto che venisse aggiunto durante il periodo di Halloween.

Forse ridurre la varietà per aggiungere un po’ più di ‘piccante’ inaspettato

[Canapin (Coin-coin le Canapin)]

@ondrej

Sarebbe una bella idea!

Ho creato e aggiunto il fantasma spaventoso nel primo post.

[ondrej]

Ah! Bene, me ne occuperò.

[soraiden]

Grazie mille! Siamo in festa su http://lettucecraft.com/ con le tue decorazioni!

[anon89147131]

L’ho appena rimosso dal mio forum, ma è stato divertente finché è durato - grazie per l’aiuto (abbiamo dato credito)! Screenshot 2020-11-01 alle 18.08.00|690x55

[soraiden]

Ho ripreso lo stesso concetto per le festività di dicembre. Grazie ancora una volta! https://forum.lettucecraft.com/

[darkpixlz (Pyx)]

Sto riscontrando questo errore sul mio sito con l’aggiunta di ghost.

[Stephen]

È abbastanza plausibile se si considera l’età e quanto raramente viene utilizzato.

[darkpixlz (Pyx)]

Sì, l’ho appena visto e ho pensato che sarebbe stata un’idea divertente aggiungerne un po’. È anche divertente come discourse dica “ATTENZIONE!!! IL TUO SITO È ROTTO!!!” quando è solo un pop-up fantasma rotto lol

[Canapin (Coin-coin le Canapin)]

Ci proverò. È troppo spaventoso così.