How to add HTML codes to Blog Post?

Here's a short discussion on how HTML codes will appear on your blog post. As you notice that if you directly write HTML codes on your blog post, it will not appear on your post.

You need to replace some special characters. Here's how we gonna do some tweak:

< replace with &lt;
> replace with &gt;
& replace with &amp;
" replace with &quot;
space replace with &nbsp;

Another important thing you should not forget is to add <pre><p> from the beginning of codes in order to determine that you are writing an HTML code. Add also </p></pre> at the end of your HTML codes.

In order to move to the next line add <br/> before each line of the codes. And lastly, you make sure to select EDIT HTML mode and not COMPOSE MODE.

Still Confuse? To illustrate more, here's a sample on how the tweak will work. Below is the sample of HTML codes you want to post.

<b:includable id='post' var='post'>
<div class='post uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>

If you want to post the above code, it will look like this: Make sure that you are on EDIT HTML mode.

<pre><p>&lt;b:includable id='post' var='post'&gt;
<br/>&lt;div class='post uncustomized-post-template'&gt;
<br/>&lt;a expr:name='data:post.id'/&gt;
<br/>&lt;b:if cond='data:post.title'&gt;
<br/>&lt;h3 class='post-title'&gt;
<br/>&lt;b:if cond='data:post.link'&gt;</p></pre>

Cheers! Very Easy. Leave a comment or any questions on my post.

Another simple way and hassle free, Go to Simplebits and just copy and paste the HTML.

Adsense Section Targeting for Bloggers

The purpose of adsense section targeting is to suggest sections of your text and HTML content that you'd like Adsense to emphasize what matching ads to your site's content. It will direct to the relevant ads to be displayed on your website or blog.

You need to add a set of special HTML comment tags to your code in order to take effect. These tags will mark the beginning and end of whichever section you'd like to emphasize or de-emphasize for ad targeting.

You need to insert the code before and after post titles and post content to get relevant ads. See sample below and take note the inserted code mark in red:

ADD THE CODE TO POST TITLE

<b:includable id='post' var='post'>
<div class='post uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><!-- google_ad_section_start --><data:post.title/><!-- google_ad_section_end --></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><!-- google_ad_section_start --><data:post.title/><!-- google_ad_section_end --></a>
<b:else/>
<!-- google_ad_section_start --><data:post.title/><!-- google_ad_section_end -->
</b:if>
</b:if>
</h3>
</b:if>

ADD THE CODE TO POST CONTENT

<div class='post-body'>
<p><!-- google_ad_section_start --><data:post.body/><!-- google_ad_section_end --></p>
<div style='clear: both;'/>:<!-- clear for photos floats -->
</div>


Leave a comment if you think this post is helpful.