- You need to be careful while changing your template.
- Before you make any changes, Back up your template and save it at safe
place.
alot of people download new and beautiful blogger templates with top menu added
bet they can't edit, modfy, or even remove it, and today we'll learn how to edit
any blogger template top horizontal menu, what ever the template, we'll seE how
to defined the top menu codes and edit it. editing the top menu links dependes on
finding the menu codes in our template so the first step is to find the menu codes,
actually finding the menu code is the hardest part. so log in to your blogger account,
then click LAYOUT > EDIT HTML . now you are at EDIT HTML page, and here you can
see all you template code. open your blog in a new window and read your top menu
links titles, and see the next picture, i'll use here nice template called : integral
made by blogandweb.com and you can seeit's demo here.
YOU MUST READ THE INSTRUCTIONS ON THE LAST IMAGE. at our tutorial we'll copy the link title "contact us" and now go yo your blogger account page " Edit html" then
if you use FireFox or Internet Explorer or any another Browser click "CTRL + F"
and past the link title that you copied it, and here it our example we'll past the
title " contact us " and click Enter or Clikc Find. the browser must find text match
the title in your template code. please Zoom the next image and read the instructions,
if you selected word like " home " to defined your menu code place in your template
code, let us tell you that it's bad choice because it's too popular word and you'll
find it more than 3 or 4 times in your code, and here we aim to find the menu titles
just to defined the menu code location in our template code, and here is some menu
codes will help you to know the menu code once you see it,
<ul id='menu'> <li><a accesskey='1' href='#' title=''>Home</a></li> <li><a accesskey='2' href='#' title=''>Contact us</a></li> <li><a accesskey='3' href='#' title=''>About Us</a></li> <li><a accesskey='5' href='#' title=''>Edit</a></li> <li><a accesskey='5' href='#' title=''>Edit</a></li> </ul> |
<div id='menu'> <ul> <li><a href='#'>Home</a></li> <li><a href='#'>Blog</a></li> <li><a href='#'>Photos</a></li> <li><a href='#'>About</a></li> <li><a href='#'>Contact Us</a></li> </ul> </div> |
this, then you found your menu code and this is was the hardest part, now lets talk
about how to edit your top navigation menu, so please see the next tables to see
how to edit your top menu and follow the instructions,
<ul id='menu'> <li><a accesskey='1' href='Title 1 link URL' title=''>Tittle 1</a></li> <li><a accesskey='2' href='Title 2 link URL' title=''>Tittle 2</a></li> <li><a accesskey='3' href='Title 3 link URL' title=''>Tittle 3</a></li> <li><a accesskey='5' href='Title 4 link URL' title=''>Tittle 4</a></li> <li><a accesskey='5' href='Title 5 link URL' title=''>Tittle 5</a></li> </ul> |
<div id='menu'> <ul> <li><a href='Home page link URL'>Home</a></li> <li><a href='Blog page link URL'>Blog</a></li> <li><a href='Photos page link URL'>Photos</a></li> <li><a href='About page link URL'>About</a></li> <li><a href='Contact us page link URL'>Contact Us</a></li> </ul> </div> |
horizontal navigation menu, and here is a trick you may need to make your contact
us page
Add contact us form to blogger witch going to help you creat contact us page
to your blogger blogspot blogs.
0 comments:
Post a Comment