How to:
*~ Make your own blog button.
*~ Take someone else's button home.
1.) Taking a Blog Button Home
Just highlight "code" below the button picture,
then right click to copy.
(Be sure to scroll down to get the complete code)
Then go to your dashboard... and then click on "design".
Now click on the "get gadget" button on you side bar.
When the google gadget page comes up,
just scroll down to the HTML gadget.
Put the copied code in the white box and don't forget
to fill in the title and other information.
After you click "save" it will show up on your side bar.
Then "grab" it and move to where you want it on your sidebar.
Did you know?
You can resize the button to fit your side bar?
Did you know?
You can resize the button to fit your side bar?
You can make it smaller but if you try to
make it bigger it will become blurry.
After entering the "code" into the widget,
make it bigger it will become blurry.
After entering the "code" into the widget,
click on "rich text" (upper right) so you can view
the actual button and not just the HTML.
Then left click and you will see the resizing tool.
(However, this does not work for me when using Chrome.)
the actual button and not just the HTML.
Then left click and you will see the resizing tool.
(However, this does not work for me when using Chrome.)
You can move it to the <center>, <left>, or <right>
of your sidebar if you want all pictures and buttons
to line up uniformly on your sidebar.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
2.) Making your own Blog Button
Copy ALL of the following (sample) "html code" below:
<div align="center"> <a href="http://cactusflowerdesigns.blogspot.com/" target="_blank"><img alt="CactusFlowerDesigns" src="http://i567.photobucket.com/albums/ss115/BunnyJean678/inspirationsbutton-4-3.jpg"/></a> </div> <div align="center"> <form><textarea rows="6" cols="20"><center><a href="http://cactusflowerdesigns.blogspot.com/" target="_blank"><img alt="CactusFlowerDesigns" src="http://i567.photobucket.com/albums/ss115/BunnyJean678/inspirationsbutton-4-3.jpg"/></a></center></textarea></form> </div>
You will now have to edit this code
with YOUR information.
I have highlighted all the areas
that you will be editing.
I have highlighted all the areas
that you will be editing.
- open your blogger account and choose "design"
- click "add a gadget"
- choose "html" and you'll get a blank box
- paste the code you have copied in the box
- change "http://cactusflowerdesigns.blogspot.com/" to your url
- (or the post or page you want to link to.)
- change "CactusFlowerDesigns" to your actual blogs name.
This next part is a bit harder.
First you will need to make a button image.
I use Photobucket.
Here is an example of what a Photobucket code looks like:
Here is an example of what a Photobucket code looks like:
<a href="http://photobucket.com" target="_blank"><img src="http://i567.photobucket.com/albums/ss115/BunnyJean678/inspirationsbutton-4-3.jpg" border="0" alt="Photobucket"></a>
- ONLY copy the highlighted area of this code!
- Then go to the two places where you see the link to the image in the sample code above:
- "http://i567.photobucket.com/albums/ss115/BunnyJean678/inspirationsbutton-4-3.jpg". I just remove what is between the two sets of " " and insert the photobucket HTML code for the blog button I want.
- click save!
- BE SURE TO TEST OUT THE CODE!
