Come inserire un’ icona spoiler personalizzata su WordPress

Come inserire un’ icona spoiler personalizzata su WordPress

Molto comodo e utile, lo spoiler è uno strumento spesso utilizzato nei vari blog. Ci si possono inserire video, immagini, file da scaricare, ma anche consigli e segreti. Se poi si utilizzano icone personalizzate graficamente gradevoli, il risultato sarà un sito più bello e ordinato.

Purtroppo però, l’html non basta e molti software come WordPress non dispongono di funzioni personalizzabili di base. Dunque bisogna rimediare. Un modo per utilizzare un’icona spoiler personalizzata su WordPress c’è. E’ tutto molto semplice, basta installare un plugin molto conosciuto, Shortcodes Ultimate.

In questa guida, spiegheremo passo passo come realizzare un pulsante spoiler personalizzato in pochi semplici passaggi, aiutandovi con qualche screen. Iniziamo.

1. Scaricare Shortcodes Ultimate e installarlo su WordPress

Basta andare su questo sito e scaricare il file zip. Una volta scaricato, bisogna andare su WordPress nella sezione “Plugin“, quindi “Aggiungi Nuovo“, poi “Carica Plugin” e selezionare il file zip appena scaricato, in fine cliccare su “Installa adesso“. (ricordate una volta finito di cliccare su “attiva plugin“)

2. Creare un pulsante spoiler

A questo punto, andando sull’Editor per creare un nuovo articolo (o una nuova pagina), affianco al pulsante “Aggiungi Media” potete vedere un nuovo pulsante, “Insert shortcode“. Cliccando, si aprirà una finestra contenente diverse funzionalità dello script appena installato.

Inserire icona spoiler personalizzata - Inserire uno spoiler
Clicca su “Insert Shortcode” per aprire l’elenco dei codici

Selezionare “Expand“.

Inserire icona spoiler personalizzata - Inserire uno spoiler Expand
Scegliere “Expand” e non “Spoiler”

Ora si aprirà il menu del nostro spoiler. Ci sono diverse impostazioni da modificare per personalizzare al meglio il proprio spoiler:
– More Text Il testo che apparirà all’interno del pulsante (se non si usa un’icona personalizzata).

– Less Text Il testo che apparirà nel pulsante di chiusura dello spoiler.

– Height “Spessore” da cui deve iniziare lo spoiler. Consigliamo di lasciarlo a 0.

– Hide Less link Disattiva il tasto chiudi spoiler.

– More e Less icon Scelta delle icone personalizzate da utilizzare per il tasto di apertura e chiusura dello spoiler.

– Content   Molto importante, il contenuto dello spoiler. Supporta codici html, javascript, ecc.

Inserire Icona Spoiler personalizzata Expand Settings
Diverse impostazioni tra cui “More Icon” e “Less Icon” per selezionare l’icona personalizzata del tasto di apertura (more) e di chiusura (less)

3. Salvare il pulsante

Una volta creato il vostro pulsante, non vi resta che salvare il modello, senza dover ogni volta scegliere l’icona o il testo. Per farlo, basta cliccare in fondo al menu dello spoiler su “Presets“, poi “Save current settings as presets“. Ora basta dare un nome e confermare. Ogni volta che userete il pulsante, basterà andare in fondo, cliccare su “presets” e selezionare il nome del pulsante da utilizzare. In questo modo potrete anche usare diversi bottoni in base al contenuto da nascondere. Ricordate di inserire sempre il contenuto su “Content” prima di cliccare su Insert Shortcode.

1)

Cliccare su Presets e selezionare Save Current
Cliccare su Presets e selezionare Save Current

2) creare-icona-spoiler-personalizzata-salvare-expand-settings

Bene, se questo articolo su come creare un’ icona spoiler personalizzata ti è stato utile e l’hai trovato interessante, lasciaci un commento e condividi!

Posted on: 7 maggio 2016

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

*