How To Display Codes Inside Blogger Post As An Illustration

There is a way every blogger gives or make an illustration clear for
his readers and that can attract more confidence on them. I was
experimenting different methods to help bloggers write codes as an
illustration in their blog post. Have you noticed that when an HTML
code/tags is written maybe just to explain what you mean or where you
want to drive the point home, it will not display why? It is due to it
has the same formatting area with that of a blogger and when it is
included on a blogger post, it hides every part of that code.

Today, am giving you a simplier way to display your codes inside
blog post as an illustration. As a blogger, never you underestimate
the powers of 'Mobile and Email' option under your blog settings,
why? It is because, it enhances blog post formatting,
Imports articles with their Original formatting mode and so many other
benefits that improves you blog post experience.
For this Method Am about reviewing to you to work perfectly follow
the below steps:

* Steps

. Goto your Dashboard, scrol down and click on Settings>>> Setting
Basic Posts, then 'Mobile and Email' open the option, make sure you
create a unique email id for your blog and keep it Confidential.
Remeber to check the option ' Save emails as draft Post' then Save
Settings.
. Goto Your main email and Create a new post, include whatever you
wish and Enter Blog Title as the Subject, After that send it to your
newly created blogger mail.

. Now login to blogger Dashboard, Edit the post as Draft, goto where
you want those code to appear, Mark from
< and stop at > Save it somewhere as it will be useful again.

. Lastly, If you like Create A new post then paste what you copied
exactly the paragraph you want those codes to appear.

Examples: I want to show my readers codes to add pages on top blogger
Menu, it will be as below

<div id='wrapper'>
<div id='top-nav'>
<ul>
<li><a href='#'>About Us</a></li>
<li><a href='#'>Write For Us</a></li>
<li><a href='#'>Sitemap</a></li>
Then Add as Many as you wish and space them </ul></div>

From the above, you will find out that those HTML codes was
transparent and very clear to my reader to comprehend. You too can do
it when you follow each steps droped here.

* Important Tips:
There are some major formatting symbols visible when editing and can
confuse you on what to do, so let me show you the functions briefly.

1. ' = (')
2. ' = (') open and close symbols
3. &#lt; = ( <)
4. > = ( >)
for instance,
<li class='current'>
becomes
<li class='current'>

The four Tips mentioned above, bears your code format but due to it
was imported from another place, its now showing you those codes the
way it is.
You should familiarize yourself with the symbol in order to help you
get what exactly you want.
Read How To Add Pages To Top Menu Of Blogger Template

I hope This short article have help you now? reach to other bloggers
via the share buttons.

HAPPY BLOGGING!