@font-face in Ubuntu block notes

Un breve resoconto di come utilizzo i font esterni nel mio blog tramite @font-face.

Da un po’ di tempo a questa parte dovreste vedere questo blog con i font di una famiglia precisa: il Droid. Gran bel font, senza dubbio, che uso anche come carattere standard nella mia linux-box. Dopo averlo provato sul blog senza includerlo negli stili del CSS, ho deciso di renderlo operativo per chiunque usi un browser moderno che legga correttamente la dichiarazione @font-face. In questo articolo condivido alcuni punti fondamentali per l’implementazione.

Leggi tutto “@font-face in Ubuntu block notes”

La creazione delle colonne in CSS3

Una delle funzioni di CSS3 che può affascinare chi ama impaginare libri è la facilissima possibilità di impostare il testo in colonne. Ieri, dando uno sguardo a questo articolo, ho pensato di prenderne spunto e scriverne brevemente soprattutto per chi ancora non avesse visto in azione questa funzione.

Non tutte le caratteristiche della gestione delle colonne sono ancora implementate. Firefox 3.5 non comprende ancora lo spanning di un titolo su tutte le colonne.

Di seguito alcuni esempi, con il relativo stile utilizzato.

Leggi tutto “La creazione delle colonne in CSS3”

Pulsanti aggiuntivi al pannello di scrittura di WordPress

Usi spesso l’editor di WordPress in modalità HTML e ti servirebbero dei comodi pulsanti per velocizzare la scrittura dei tag? Leggi l’articolo e scopri come fare.

Come sapete, quando scrivete un articolo di WordPress, potete scegliere se usare l’interfaccia “Visuale” o quella “HTML”, selezionabili dalle due schede poste sopra il campo di scrittura dell’articolo. La differenza è sostanziale: con la versione HTML potete intervenire nel codice dell’articolo e usare alcuni tag HTML che altrimenti WordPress vi taglierebbe. Ora, avrete presente che la versione HTML del pannello è più o meno questa:

I pulsanti sono pochi, anche rispetto alla sua versione “Visuale”. Ma potete aggiungerne quanti ne volete e far scrivere ai pulsanti i tag che vi servono più spesso. Ecco come si presenta attualmente il mio pannello:

Ho aggiunto la seconda e terza riga di pulsanti che scrivono per me quei tag che uso di più e che scoccia dover scrivere a mano quando si modifica l’HTML (a me capita spesso). Aggiungere questi pulsanti personalizzati è davvero semplice: basta un plugin.
Leggi tutto “Pulsanti aggiuntivi al pannello di scrittura di WordPress”

Angoli arrotondati senza immagini

Come arrotondare gli angoli di un box di una pagina HTML senza far uso di alcuna immagine, ma solo dei tag CSS.

Quando si vuole creare un box con gli angoli arrotondati, generalmente si crea – in base all’uso – una immagine già pronta oppure una serie di piccole immagini ognuna contenente uno dei quattro angoli richiesti (come nel caso di questo blog). Ma c’è un sistema, ancora in fase di bozza, per far generare al browser i quattro angoli necessari per il layout senza l’uso di alcuna immagine.
La funzione si chiama border-radius e ha questi valori:

  • border-radius
  • border-top-right-radius
  • border-bottom-right-radius
  • border-bottom-left-radius
  • border-top-left-radius

In attesa che la funzione entri nelle specifiche ufficiali degli standard CSS, i software di casa Mozilla e quelli che usano Webkit già consentono l’uso di questo comando, diversamente, invece, da Explorer.
Leggi tutto “Angoli arrotondati senza immagini”

HTML, CSS e Wordpress Help Sheets

sheets_pdf.png

Quante volte sarà capitato agli smanettoni del codice HTML, dei fogli stile (i CSS) e del codice PHP di WordPress di non ricordarsi la sintassi di quel particolare comando! A me, che non sono uno smanettone, è capitato tante volte. Ci ha pensato gosquared.com, che ha creato tre PDF con la sintassi dei comandi più comuni. Un ottimo strumento per chi modifica spesso codice. Ecco i link alle tre pagine:

  1. HTML Help Sheet
  2. CSS Help Sheet
  3. WordPress Help Sheet