Bloggers' Paradise Forum Index Bloggers' Paradise
The forum for personal bloggers to get help and share knowledge on all aspects of blogging.
 
 FAQFAQ   SearchSearch   MemberlistMemberlist   UsergroupsUsergroups   Join! (free) Join! (free)
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 

Announcements
Bloggers' Paradise Closing Down
July's Theme is Independence
June's Theme is Favourite Recipe
May's Theme is Childhood Sweets
April's theme is Three Wishes
Blog-a-long for March - My Best Holiday Ever!
Congratulations to Ruthjen!
PLEASE UPDATE ANY LINKS YOU HAVE TO THE OLD FORUM!
The idea of the Blogalong
Sticky Articles
The Button
Important Links
Blog-a-long
Welcome Pack
Latest Posts
Sweet HTML Morsels Progress Bars
Adding images to blogger
Bloggers' Paradise Closing Down
adding a new item to sidebar
got a bit of a problem...
Hi from Cinders
Displaying a button link
July's Theme is Independence
June's Theme is Favourite Recipe
can't find the right bit in my template...

Adding a Personalised banner to your Blogger template

 
Post new topic   Reply to topic    Bloggers' Paradise Forum Index -> Setting Up a Blog
View previous topic :: View next topic  
Author Message
jacquie
Site Admin


Joined: 31 Jan 2007
Posts: 102


Location: Salt Lake City, Utah, USA

PostPosted: Sun Feb 18, 2007 12:39 am    Post subject: Adding a Personalised banner to your Blogger template Reply with quote

If you want to change the banner at the top from the plain coloured one to an image of your own in Blogger here is what to do:

    1 Find the image you want to display. Make sure it is wide enough to go across the banner space and the interesting part is at the top. upload it to your picture host.

    2 Go to the Template tag and click on the HTML option.

    3 Find the bit of code that looks something like this (the h1 at the beginning is the important thing to look for):
    Code:
    h1 {
      padding: 18px 0px 10px 5%;
      margin: 0px 0px 8px 0px;
      border-top: solid 9px $sidebarTitleColor;
      border-bottom: solid 1px $descriptionColor;
      color: $titleColor;
      background: $titleBgColor;
      font: $titleFont;
    }


    4 Type // in front of the line ' background: $titleBgColor;' (This makes it ignored and is safer than deleting it in case you want to change it back at any time.)
    5 Underneath that line add the following

    Code:
      background-image: url('http://i5.photobucket.com/albums/y181/ferryfax/puppyface-1.jpg');
    background-repeat: no-repeat;

    6 Unless you want a picture of our dog, change the 'http...jpg' to the link for your picture that you uploaded in step 1
    7. Click on the preview button to see of it has turned out how you wanted.
    8 If it hasn't then ask here as it will be easier to deal with individual examples rather than go through all the possibilities. If it's OK save your template and you are done




_________________
Jacquie

Jacquie's Journal
Crafty Threads 'n' Yarns
Back to top
View user's profile Send private message Send e-mail Visit poster's website
Display posts from previous:   
Post new topic   Reply to topic    Bloggers' Paradise Forum Index -> Setting Up a Blog All times are GMT
Page 1 of 1
  

Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum

Card File  Gallery  Forum Archive
Powered by phpBB © 2001, 2005 phpBB Group
Create your own free forum | Buy a domain to use with your forum
Debt Consolidation|Debt Consolidation|Self Improvement Articles Directory|100% Cars|Lockers