Codice VS WordPress.com

Ero stato troppo euforico, e la delusione è stata amara.

L’unico codice ben gestito da WordPress

Ricapitoliamo, vi va?

Esistono 4 modi per inserire codice nei propri articoli del blog:

1. non applicare alcuna formattazione;
2. usare il tag <code>;
3. usare il tag <pre>;
4. usare il tag .

Vediamo come si comporta l’editor a testina di vitello di WordPress in alcuni esempi che ho personalmente sperimentato.

---

Dottor DoppioTrattino e Mister Hypen

Quasi tutti i linuxari si trovano spesso a usare il doppio trattino. Che WordPress genialmente traduce in un simbolo di cui veramente non si sente il bisogno: il famigerato “hypen“.

Facciamo una prova con una porzione di codice shell che prima o poi tutti i linuxari disperati digitano, chiedendo aiuto. L’opzione doppiotrattinohelp!

1. Nessuna formattazione:
   programmaderkazzo –help
2. Tag <code>:
   programmaderkazzo --help

3. Tag <pre>:

   programmaderkazzo --help

4. Sourcecode con language=”cpp”:
   programmaderkazzo –help

Ecco come si presenta nell’editor di WordPress:

Ecco come si presenta dopo il salvataggio, prima di qualsiasi edit:

Ecco come si presenta dopo aver fatto un edit:

Conclusioni:

Sì, nell’edit ho messo una nuova riga “newline”. Infatti mi aveva molto stupito che il doppio trattino fosse rimasto!

Poi mi sono ricordato del commento di NotoriusXL che vi riporto qui:

Tornando al discorso del doppio trattino… ho notato che, usando il tag code solo come elemento inline (quindi, un CODE per ogni riga) e non mettendo dentro a CODE nessun altro tag, il doppio trattino viene preservato (anche modificando più volte il post). Boh, poi magari sono fortunato io! :D

Quindi ho subito pensato: “Ah, cazzo, mi sono dimenticato di farlo su più di una riga!” e ho aggiunto la riga nel primo edit, poi salvato, fatto un secondo edit e fatto lo screenshot.

Insomma, qui ho bisogno di conferme.

È stato finalmente risolto il problema del trattino doppio?

Dalle mie prove pare di sì! E un bell'”Alleluja” ci sta tutto!

Quindi senza alcuna formattazione si comporta “male”, con il <code> funziona bene, con il <pre> aggiunge un fastidiosissimo interlinea, mentre con

</strong> è proprio bello.

<hr />
<p align="center"><em><strong><font color="#800000">HTML Fuckup</font></strong></em></p>
Così <strong>noi</strong> <em>(io, Ernesto ed Evaristo)</em> eravamo belli bellini convinti di poter usare sempre il tag <strong></strong>, e <a href="https://sevencapitalsins.wordpress.com/2007/09/10/il-doppio-trattino-proprio-quel-bastardo/">ci abbiamo pure scritto un articolo</a><img src="https://sevencapitalsins.files.wordpress.com/2007/08/link_go.png" alt="linkgo" /> dicendo quanto ci sentivamo imbecilli.

E abbiamo dato degli imbecilli a tutti, come si fa quando si è euforici <font color="#808080"><em>(come quelli che stirano le vecchine che attraversano la strada dopo aver ottenuto una promozione)</em></font>.

Bene, ci sentiamo ora cornuti e mazziati. Oltre che imbecilli, naturalmente! <img src="https://sevencapitalsins.files.wordpress.com/2007/08/emoticon_unhappy.png" alt="(" />

<em>Ma di cosa stiamo parlando?</em> Ma dell'<em><u>eccellente</u></em> interazione tra il codice PHP di salvataggio dell'articolo nel database e il Javascript che sta dietro al tag <strong></strong>!

Provare per credere.
<ol>
	<li>Nessuna formattazione:
&lt;html&gt;
&lt;head&gt;&lt;title&gt;Una prova&lt;/title&gt;&lt;/head&gt;
&lt;body&gt;Tremendo. Sconfortante. Obbrobrioso.&lt;/body&gt;
&lt;/html&gt;</li>
	<li>Tag <strong>&lt;code&gt;</strong>:
<code>&lt;html&gt;
&lt;head&gt;&lt;title&gt;Una prova&lt;/title&gt;&lt;/head&gt;
&lt;body&gt;Tremendo. Sconfortante. Obbrobrioso.&lt;/body&gt;
&lt;/html&gt;</code></li>
	<li>Tag <strong>&lt;pre&gt;</strong>:
<pre>&lt;html&gt;

&lt;head&gt;&lt;title&gt;Una prova&lt;/title&gt;&lt;/head&gt;

&lt;body&gt;Tremendo. Sconfortante. Obbrobrioso.&lt;/body&gt;

&lt;/html&gt;</pre>
</li>
	<li><strong>Sourcecode</strong> language="xml":
&amp;lt;html&amp;gt;
&amp;lt;head&amp;gt;&amp;lt;title&amp;gt;Una prova&amp;lt;/title&amp;gt;&amp;lt;/head&amp;gt;
&amp;lt;body&amp;gt;Tremendo. Sconfortante. Obbrobrioso.&amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;

Ecco come si presenta nell’editor di WordPress:

Ecco come si presenta dopo il salvataggio, prima di qualsiasi edit:

Ecco come si presenta dopo aver fatto un edit:

Conclusioni:

Anche qui il tag <code> si dimostra il migliore.

Senza formattazione alcuna può essere una alternativa, ma manca la comodità dei font monospace.

Il tag <pre> aggiungeva già l’interlinea, ma dopo l’edit è riuscito a simulare il comportamento di una ricevente di segnali morse. Tutto su una linea continua.

Ma la cosa che fa più girare le è il

</strong><em> fraudolento!</em> Dopo il salvataggio sembra tutto sistemato bene, perfetto, limpido e cristallino. Dopo l'edit si può accorgersi che non era il caso di cestinare così in fretta la copia originale del codice sorgente...

E meno male che quel tag era consigliato! <em>I famosi consigli di <strong>Giuda</strong>!</em>
<blockquote><img src="https://sevencapitalsins.files.wordpress.com/2007/08/bomb.png" alt="bomba" /> Qualcuno dica agli sviluppatori di WordPress che quando entro in modalità <em>edit</em> loro devono <em><u>ripristinare</u> le entità html originarie</em> (come "<strong>&lt;</strong>"), <font color="#800000"><u><strong><em>non</em></strong></u></font> stampare a video la "traduzione"(come "<strong>&amp;lt;</strong>") uscita dalla <a href="http://se.php.net/htmlspecialchars" title="Ripasso dei concetti fondamentali!">funzione PHP htmlspecialchars()</a><img src="https://sevencapitalsins.files.wordpress.com/2007/08/link_go.png" alt="linkgo" />! <img src="https://sevencapitalsins.files.wordpress.com/2007/08/bomb.png" alt="bomba" /></blockquote>
<hr />
<p align="center"><em><strong><font color="#800000">Ubi Minor Javascript Cessat</font></strong></em></p>
Eh sì, mica è finita qui. Eh no, proprio no, perché sarebbe troppo facile dire:
<blockquote><font color="#808080"><em>«Va beh fiol, l'HTML dà problemi con tutti quei tag, ma puoi <strong>tranquillamente</strong> usare il tag  con tutti gli altri linguaggi di programmazione che sono più importanti»</em></font></blockquote>
Sì? <em><u>Certo</u>, se non ci si preoccupa troppo che funzionino...</em>

Vediamo un frammento di codice Javascript come si comporta. Per la precisione, vediamo le <em>istruzioni condizionali!</em>
<ol>
	<li>Nessuna formattazione:
if (taglia&gt;=3)  document.write("e' amore vero!");
if (taglia&lt;=1) document.write("e' pianura alluvionale!");</li>
	<li>Tag <strong>&lt;code&gt;</strong>:
<code>if (taglia&gt;=3)  document.write("e' amore vero!");
if (taglia&lt;=1) document.write("e' pianura alluvionale!");</code></li>
	<li>Tag <strong>&lt;pre&gt;</strong>:
<pre>if (taglia&gt;=3)  document.write("e' amore vero!");if (taglia&lt;=1) document.write("e' pianura alluvionale!");</pre>
</li>
	<li><strong>Sourcecode</strong> language="jscript":
if (taglia&amp;gt;=3)  document.write("e' amore vero!");
if (taglia&amp;lt;=1) document.write("e' pianura alluvionale!");

Ecco come si presenta nell’editor di WordPress:

Ecco come si presenta dopo il salvataggio, prima di qualsiasi edit:

Ecco come si presenta dopo aver fatto un edit:

Conclusioni:

Anche qui l’unico tag che si comporta bene è il <code>.

Il <pre> rispetta meticolosamente ogni errore. Che bravo ragazzo.

Per qualche arcano motivo il sostituisce immediatamente il simbolo “<” senza nemmeno aspettare un edit.

Infatti il simbolo “>” viene sostituito solo dopo l’edit, come ci si aspettava.

Questa si chiama

· D I S C R I M I N A Z I O N E ·

Tutti in piazza! Protestiamo contro ogni forma di razzismo! E chi non è d’accordo lo saccagnamo di botte!

---

Conclusioni (per ora)

Se mi fossi svegliato bene direi:

«Dai, almeno il tag <code> funziona, quindi sappiamo cosa usare»

Dato che non mi sono svegliato bene, me ne frego del tag <code>. Ma avete o non avete notato che:

• il tag <code> viene fatto vedere da questo tema (Ocean Mist) con un carattere così piccolo (vedi immagini) che devi cambiare la risoluzione a 800×600 per poterla vedere su uno schermo da 19”?
• il tag <code> non è direttamente accessibile nell’editor visuale di WordPress a meno di andare nell’editor del codice?
• quando passi dall’editor visuale all’editor del codice e l’articolo è lungo devi cercare col lanternino il punto dove stavi correggendo senza metterti a piangere per tutta la formattazione buttata lì a casaccio?
• nell’editor visuale è disponibile solo il tag <pre> che si è rivelato totalmente inutile?

Last but not least: perché danno fiato alle trombe se il tag non riesce a scrivere giusto nemmeno un commento condizionale?

Qui la cosa giusta da fare sarebbe scaricarsi il codice di WordPress, riscrivere tutta la parte che formatta il testo del database per presentarlo all’editor togliendo tutte le conversioni &atestadicazzo; &allaminchia; e finalmente poter condividere i propri codici in maniera cristiana…