Ciao, in genere per normali documenti html un modo è quello di sostituire prima di tutto le parentesi angolari < e > con le rispettive entità html &lt e &gt. Puoi farlo manualmente oppure usare un qualsiasi servizio online che lo faccia in automatico. Già questo fa in modo che il codice non sia elaborato come markup dal browser.

A quel punto potresti inserire il codice dentro i tag <pre> e <code> per ottenere una specifica formattazione e una corretta semantica. Ad esempio, potrebbe essere una cosa del genere:
codice:
<pre><code>&lt;a href="javascript:;"
onClick="window.open('http://...',
'titolo', 'width=800, height=1000, resizable, status, scrollbars=1, location');"&gt;
&lt;img class="alignnone wp-image-13" src="http://..." alt="" width="110" height="22" /&gt;&lt;/a&gt;</code></pre>


Se stai usando WordPress (come intuisco dai riferimenti nel tuo codice) puoi adoperare lo stesso sistema oppure utilizzare degli specifici plugin.

Qui qualche articolo di riferimento:
Display Code Snippets in WordPress Without Using Plugin
How to Display Code Snippets in WordPress Post or Page {WPDIY Guide}
Posting Code Blocks on a WordPress Site
How to Display Code in WordPress Posts