Inserire una Game Card di itch.io in un post di WordPress

Chiunque sviluppi videogiochi indie o scriva di game design sa bene quanto sia importante presentare i propri progetti (o quelli che si recensiscono) in modo chiaro, pulito e visivamente d’impatto.

Itch.io è la piattaforma di riferimento per la scena indipendente, ma quando si tratta di integrare le celebri game card (le schedine promozionali dei giochi) all’interno di un sito WordPress, le cose sono sempre state meno fluide del previsto. Spesso ci si ritrova a dover copiare manualmente i frame HTML forniti da Itch, modificare le variabili nell’URL a tentativi o combattere con il layout nell’editor a blocchi Gutenberg.

Per risolvere questo problema una volta per tutte, ho sviluppato Itch.io Embed, un plugin nativo per WordPress che semplifica drasticamente questo processo.

Come funziona Itch.io Embed Game Card

L’obiettivo principale era creare uno strumento che fosse leggero, nativo e facilissimo da usare, senza richiedere configurazioni complesse o chiavi API.

L’esperienza di utilizzo è immediata:

1. Inserisci il blocco Itch.io Embed Game Card nell’editor Gutenberg.
2. Incolla l’URL pubblico della pagina del gioco (es. https://username.itch.io/game-title).
3. Cliccha su Generate Embed.

Il plugin comunica con le API endpoint di Itch per recuperare automaticamente l’ID del gioco e generare l’iframe personalizzato in tempo reale direttamente all’interno dell’editor.

Il risultato è questo:

Personalizzazione totale direttamente dalla Sidebar

Invece di accontentarsi dell’iframe standard di default, Itch.io Embed Game Card espone un set di controlli avanzati direttamente nell’Inspector Sidebar di Gutenberg:

• Dark Mode Toggle: Un semplice switch per alternare istantaneamente tra il tema chiaro e scuro.
• Tavolozza Colori Custom: Puoi personalizzare nel dettaglio ogni elemento dell’embed (colore di sfondo, testo principale, pulsante/link e bordo) tramite il color picker di WordPress.
• Controllo Bordi: Gestione dello spessore e del colore del bordo dell’iframe.
• Padding Indipendente: Controlli RangeControl per impostare al pixel il padding superiore, inferiore, destro e sinistro, garantendo una spaziatura perfetta all’interno del layout del tuo tema.

Leggerezza e Sicurezza

Il plugin è stato sviluppato seguendo i rigidi standard di sicurezza e qualità del WordPress Coding Standards (WPCS):

• Nessun impatto sulle prestazioni: Sul frontend viene caricato esclusivamente l’iframe necessario, senza librerie JavaScript pesanti o dipendenze esterne.
• Sanificazione e Escaping avanzati: Tutti gli input e l’output HTML sono validati e scappati secondo le best practice di sicurezza di WordPress.
• Nessuna API Key richiesta: Funziona out-of-the-box sfruttando il parsing delle pagine pubbliche di Itch.io.

Download Open Source su GitHub

Il codice del plugin è 100% Open Source e già disponibile su GitHub per chiunque voglia provarlo, testarlo o contribuire al progetto:

🔗 Repository GitHub: desdinovait/itch-io-embed-game-card

Come installarlo manualmente:

1. Vai sul repository GitHub e scarica il file ZIP della repository.
2. Nel tuo pannello WordPress, vai su Plugin > Aggiungi nuovo > Carica plugin.
3. Seleziona il file ZIP e clicca Installa ora, quindi Attiva.

Se lo provi sul tuo blog o hai suggerimenti per nuove funzionalità, lasciami un feedback nei commenti o apri un’issue direttamente su GitHub!