Create Your Own Linkbar

Linkbar with simple text links:

1) From your Blogger dashboard, click "Layout". You should now be at the "Page Elements" page. What we want to do is create a link under your navbar that says "add a Gadget". The first thing you will need to do is to manually change the HTML in your blog to increase the places where you can add page elements. If you have page elements at the top, skip to step 6.

2) Click on your Layout tab and then click 'Edit HTML', Once there hit 'Ctrl + F' to search your HTML template and type in showaddelement to locate the proper place in your HTML code to make changes. Now look for a place in the code that says:  

Change the max widgets to 3 and the showaddelement to yes - You will now have two extra places where you can add page elements.

3) Scroll down a little further and find the place in the code reading: 

Change the showaddelement to yes. You should now see options in your template to add page elements before and after your Blog Title.  

4) One final place to change the code: Scroll down to where you see the code reading:

Change showaddelement to yes

5) You should now have an 'Add a Gadget' option between the Blog Title (header) and the blog post section. This is the place where you would select 'Add a Gadget' to add a horizontal navigation or menu bar. Once these changes have been made, click 'preview' to make sure that the changes are appearing correctly. Once you have verified that the changes appear correct, click 'save template'. You are now ready to add your links.

6) Write a new post for each page you want to link on your menu bar. The most common are Home, About, Favorites, Contact, but you could do anything. The links you use will be the URL for each specific post.

• For Home, it will be your blog URL.
  
• For Contact, it will be mailto:youraddress@email.com
• For an individual post, right click the post title, and "copy link location"
• For a label category, right click the label name, and "copy link location"

7) On your Template/Layout, once at your Page Elements, click the rectangle under your 'Header', which says 'Add a Gadget'. Now in your gadgets select 'HTML/JAVASCRIPT'.  Now add this code- click on the text to download.

you can add as many lines as you like, you can add spaces between them to space the text out a bit.

8) Then move (click and drag) the new page element just under your header. 'Preview' to see if you want to change anything, if everything looks good then click 'save'. Now you should have a linkbar- if you are having problems go back and review the steps or send me an email. 

How to Make a Custom Signature

For those who know how to use Photoshop/Gimp heres the instructions on making a custom signature:

1. Make your signature with Gimp/photoshop in the form of an image.

2. Upload your image into a wed host (Photobucket , Flickr or whichever you use).

3. Click on download and copy this code: DOWNLOAD

4. Open your Dashboard/ Settings/ Formatting/ Post Template. Put the code in the Post Template box

5. Once your code is in the Post Template Box grab your signature URL from your web host and copy it into the specified spot in your code (where it says "SIGNATURE URL")

6. Now scroll to the bottom of the page and click on "save settings"

Now you should have your own custom signature!

The signature will only show up on new posts, it will not show up on your past posts.

For those who want a basic signature without the work- go to My Live Signature and follow their instructions, it is very simple to use.

How To Make Blog Buttons You Can Share

Want to be able to share your blog easily with fellow bloggers? Here is how you make a blogger button you can share!

To Download Hit the download link below and fill in the specified spaces (like blog URL and Image URL). Then Go to your page elements page and upload it under HTML/JAVASCRIPT. It's that simple!

DOWNLOAD

How To Add your own Text/photo To Your Header

To add your own text/photos embedded into your header- heres how you do it. Go to your HTML code and look for the following code: (located Under header)


#header {
height: 514px;
width: 930px;
background-image: url(http://farm3.static.flickr.com/2286/2248013622_00ed1be0e0_o.jpg);
color:$pagetitlecolor;
}


The address highlighted in red is your header image URL- copy it into your browser and your header will appear. Then right click on the image and "save image as" which will copy it on your computer. They you can edit it adding any text/photo you like using photoshop. Once you are finished editing it upload it again with Flickr or Photobucket and copy the url back in from the place you took it.


To erase the default words on your header- go to this code: (again located under header)

#header h1 {
font: $pagetitlefont;
color: #800000;
font-size: 500%;
text-decoration: none;
font-weight: bold;
text-align: left;
margin: 0px 0px 0px 50px;
max-width: 800px;
}


The code that is highlighted in red you just change the percentage to 0%. That will make any text you have dissapear so that only the new text you added shows. So there you have it how to add your own text/photos to your header. Happy blogging!!

Changing Margin for your header & header description

Want to change your header & header description to a different location on your header? Heres how you do it. Take a look at the code below- you will notice two sets of numbers circled in red. The top one is to change your header and the one below that is to change your header description.

To change the location you need to change the numbers- heres how it works:
There are 4 sets of numbers for the the header and 3 sets for header description each (this again may vary from blog to blog).


Each number has a different function- the function varies between the blog you choose. The best way to learn is to play around with those numbers- to do it without messing up your blog change a number and hit preview and from that you can see what it changes. Keep doing it till you get the desired look.


This can be done for either the header or the header description. Not every template will have the heading perfectly centered because different amount of text looks different on every blog- thats why it's up to you to play with the margins to make it look how you want it to.

Removing & Replacing your Navbar

- Log in to blogger

- On your Dashboard, select Layout. This will take you to the Template tab. Click Edit HTML. Under the Edit Template section you will see you blog's HTML.

- paste the CSS definition in the top of the template code: As shown below (as Outlined in Red)

-Remove the code to show it again.

How To Change Your Template

It's actually quite simple to change your template in blogger. Here's how to do it step by step!

1) Go to your Blogger Account dashboard and click on Layout it will bring you to your page elements page

2) Now copy/paste all your page elements in notepad (or any work processing program). Your page elements are your Pictures, widgets, links, HTML, & Text- which are located in your sidebar. You will need to go into each page element individually to save them, this is done in case your page elements do not make it through the transition of the layout change (which often happens).

3) Now go to your desired layout and click on the download link below the picture. This will bring you to the 4Shared page, where you will need to click on download now.

4) Once the text file is downloaded onto your computer- you are ready for the next step.

5) Now go to your Blogger Account dashboard and click on Layout

6) Then click the link at the top of your page named Edit HTML

7) Once at the Edit HTML page, you will need to upload the text file (that you just downloaded) you can do this under the title labelled backup/restore template. You do this by clicking browse, and selecting the text file which is your new layout. Once the file is selected, click on upload.

8) now your new template is installed, go to view blog and you will have a new layout!

9) Now you can re-add your page elements (copy and paste from notepad)

Additional info: All layouts on this site are for the new Blogger (XML) if you have the classic blogger Template then you will need to revert to the new blogger- in order to use these templates.