Pubblicato il 27/06/15 - aggiornato il  | 2 commenti :

Aggiunti nuovi tag al linguaggio del modello di Blogger.

Nuovi tag di Blogger aggiunti al linguaggio specifico della piattaforma.
Dopo averci informato dell'aggiunta di nuove espressioni appena un mese fa ecco che tramite un post su Blogger Buzz ci dicono che sono disponibili altri tag specifici per Blogger. Per evitare fraintendimenti è bene sottolineare alcune cose. Il template di Blogger è in linguaggio XML e la piattaforma Blogger supporta i linguaggio HTML e Javascript.

Accanto però a questi due linguaggi di base, Blogger utilizza delle espressioni non riconducibili a nessuno di questi linguaggi di markup e che possono essere interpretate solo se inserite correttamente nel modello o nei widget della piattaforma. Ho già presentato un elenco dei tag di Blogger  che però nel frattempo sono aumentati. Per essere sempre aggiornati su tutte le espressioni specifiche della piattaforma è consigliabile consultare la pagina dei Tag dei dati per il Layout.

Si tratta in sostanza di un sistema che ricorda quello delle funzioni in ambito matematico. Quando viene indicata la variabile l'espressione prende un valore determinato. C'è però una differenza sostanziale con la matematica visto che questi tag non funzionano ovunque. Solo i tag cosiddetti globali possono essere inseriti in qualsiasi posizione del modello e in qualsiasi widget.

TAG GLOBALI DI BLOGGER


I tag di Blogger hanno la seguente struttura <data:name/> o <data:name1.name2/> dove name, name1, name2, name3, ecc. sono appunto le variabili. I tag globali hanno tutti come name1 l'espressione blog mentre name2 può assumere diversi valori. I tag globali hanno cioè la sintassi <data:blog.name/> . Ecco quali sono
  1. <data:blog.title/> è il titolo del blog
  2. <data:blog.pageType/> è il tipo di pagina corrente. Il valore può essere "item", "archive" o "index".
  3. <data:blog.url/> è l'URL della pagina corrente.
  4. <data:blog.homepageUrl/> è la home page del blog.
  5. <data:blog.pageTitle/> è il titolo della pagina corrente
  6. <data:blog.encoding/> è la codifica per il blog per esempio UTF-8
  7. <data:blog.feedLinks/> è il link dei feed di autorilevamento
Ci sono poi i tag che possono essere usati solo nella Intestazione della pagina,  nei Post dei blog, negli Archivi. Si tratta cioè di tag specifici per i singoli widget come HTML/Javascript, Feed, Foto, Etichette, Elenco, Elenco di link e Logo. Un elenco completo può essere visionato nella pagina linkata in precedenza. Ai meno esperti ricordo che viene indicati solo la parte di tag colorata di viola e rosso nell'esempio di sintassi che ho fatto all'inizio di questa sezione.

NUOVI TAG PER IL LAYOUT


Dopo le espressioni e gli operatori già visti nel post di un mese fa ora se ne sono aggiunti altri. Parto però con un esempio dell'operatore condizionale <b:loop>che pur presente da tempo non avevo ancora presentato. Questo tag serve per ripetere un ciclo
Sintassi di <b:loop>
<b:loop var='identifier' values='insieme di dati'>
  [Si ripete questo contenuto]
</b:loop>
Esempio di <b:loop>
<b:loop var='i' values='data:posts'>
  <h2><data:i.title/></h2>
</b:loop>
Con questa espressione si mostreranno i titoli dei post nel widget post del blog. La guida sui nuovi tag che sono stati aggiunti non è ancora disponibile in italiano ma si può consultare in inglese.

CONDIZIONE B:SWITCH


Si tratta di espressioni che possono essere usate quando ci siano molte condizioni concatenate


<b:switch var='data:blog.pageType'>
<b:case value="static_page" />
  <h1><data:post.title></h1>
<b:case value="item" />
  <h1><data:post.title></h1>
<b:default />
  <h2><data:post.title></h2>
</b:switch>

CONDIZIONE B:EVAL

Questa condizione si utilizza insieme a expr: per valutare espressioni più complicate

<b:eval expr="data:newWidth * data:height / data:width" />px;
L'output è un valore di altezza in funzione del nuovo valore di larghezza.
<b:eval expr="data:post.labels[0].url" />
L'utput è l'URL della prima etichetta del post.
<b:eval expr='data:post.allowComments ? "Commenta" : "Commenti disabilitati" />
Oltre a b:eval è presente anche l'operatore ternario ? e l'output di questa espressione è "Commenta" quando i commenti sono permessi, e "Commenti Disabilitati" qualora i commenti non siano permessi


CONDIZIONE B:WITH


Si può usare questo tag per memorizzare temporaneamente il valore di una espressione calcolata ed evitare espressioni in linea più complesse.

<b:with var='style'
       value='"background-image: url(\"" + data:sourceUrl "\"); "
           + " width: " + data:width + "px; " '>
<div id='header-outer'>  
   <div id='header-inner' expr:style='data:style'>
     <h1>Intestazione</h1>
   </div>
</div>
</b:with>

Il problema con queste funzionalità di Blogger è sempre lo stesso. Le istruzioni sul loro funzionamento sono molto criptiche e gli esempi assolutamente insufficienti ma forse è un problema mio che ho un QI non adeguato.


2 commenti :

  1. Potrebbero essere usate per creare un template responsive. In pratica controllando il dispositivo utilizzato dal lettore si potrebbe variare la larghezza del template.

    RispondiElimina
    Risposte
    1. Non vedo applicazioni immediate. Per la versione mobile ci sono già i tag condizionali che mostrano un elemento su desktop o su mobile. Se al posto del dispositivo invece prendiamo come base la risoluzione si può usare questo tag
      @media screen and (max-width: 768px){ CSS per i dispositivi tipo iPad o inferiori }
      per impostare i fogli di stile per risoluzioni uguali o inferiori a quella data.
      @#

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy