Follow these steps:
- Create the graphic that you want to use. It must be no larger than 20 pixels by 20 pixels saved as a .png, .gif, or .jpg file.
- Upload it to a graphics host such as Photobucket.
- Log into your Blogger account.
- From your dashboard, click “Layout”
- Click “edit html”
- Back up your template if you haven’t done so already.
- Do a search (Ctrl + S) for “h2″
- You are looking for a code that looks like this -
/* Headings
———————————————– */h2 {
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;} - Add code so that it now looks like this-
h2 {
background-image: url(http://i146.photobucket.com/albums/r278/splitdecisionz/sidebar.png);
background-repeat:no-repeat;
background-color: #ffffff;
border: 0px double #FFFFFF;
margin-bottom: 5px;
padding: 2px 3px 2px 28px;
font:$headerfont;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
} - Preview then save.
That’s it!
