Koodi postitamine Wordpressis

Oled leidnud kasuliku koodijupi ja tahad seda oma blogis jagada. Aga my bad, sinu postitusest kopeeritud kood ei tööta. Tuleb tuttav ette? Worpress kipub oma tarkusega oletama, mida sa tegelikult tahtsid ning moonutab koodis kasutatud jutumärgid, ridade vahed vm elemendid. Kuidas postitada kood selliselt, et ta ka töötab?

Appi tuleb html <pre> (preformatted) märgend. Kopeeri kood postitusse kujul <pre>”koodijupp”, mida kõik saavad kasutada</pre> ning ta hakkab välja nägema nii

"koodijupp", mida kõik saavad kasutada

Selliselt ütled Wordpressile ja brauseritele, et koodi pole tarvis mingil moel ilustada, see on juba eelnevalt formaaditud. Kood töötab ka peale seda, kui keegi ta sinu Worpressi postitusest omale kopeerib.  Siiski üks probleem on veel lahendada, nimelt ei tunnusta preformatted tekst muuhulgas ka su veebi kujundust ja pikad koodiread jooksevad leheküljelt välja. Lahenduseks sobib märgendi ohjamine CSS abil. Näiteks võid oma saidi CSS-le lisada järgmised kirjed:

pre {
overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
/* width: 99%; */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}

Nüüd peaks töötav kood kenasti ka su postituse leheküljele ära mahtuma. Kui Notepadiga sarnane MonoSpace kirjatüüp ei meeldi, võid siia lisada täiendavaid stiilielemente fondi, taustavärvi jne kujundamiseks oma maitse järgi.

Kirjutatud: 08. November 2009
Teema: hea teada
Silt: CMS, sisuhaldus, WordPress
Telli RSS uudisvoog, kirjuta oma kommentaar või lisa viide (trackback) enda kodulehelt.