Wednesday, December 12, 2012

New Blog Button - And a Short HTML Lesson.

I've been needing one of these for a while.  Finally got one!  Now, if you want to link to Waco Mom with a graphic, you can.  Just grab the link code in my sidebar or copy paste the code below!

Thought I'd color code it and take some time to let you know a little bit more about the code below so you can customize it if you want.


<a href="http://wacomom.blogspot.com"><img border="0" src="http://2.bp.blogspot.com/-S6IybzjSh0I/UOiQNeOZ4RI/AAAAAAAABuQ/gg1AdAsGcAg/s1600/WacoMom200.jpg" width="150" /></a>


OK, the red part is the part that makes it link to Waco Mom.  The green part is what makes the image show up.  The bolded parts are the URLS...the URL for Waco Mom in red bold, and the URL for the image in green bold.  The blue part is something you can use to change the size of the graphic.   You can change the number there to change the width.  The graphic by itself is 200 pixels wide...I don't suggest sizing it bigger than that since that could make it look bad (pixelized...like old computer graphics).  If you do need a larger graphic, you are welcomed to use the one below.  It's URL is listed right above it.  Just replace the image URL above (the one in green) with that one, and then use the width attribute to size it how you like.


 http://1.bp.blogspot.com/-phMa1sq8fvk/UOiSnB0U1qI/AAAAAAAABuk/zF7e2woWM8Y/s1600/WacoMomB.jpg




Why didn't I just use that one in the button code?  Bandwidth...and it takes longer to load. 


If you want to make it centered, just add center tags (in bold black).

<CENTER><a href="http://wacomom.blogspot.com"><img border="0" src="http://2.bp.blogspot.com/-S6IybzjSh0I/UOiQNeOZ4RI/AAAAAAAABuQ/gg1AdAsGcAg/s1600/WacoMom200.jpg" width="150" /></a></CENTER>


Not sure where or how to add  this code?  In blogger, you can make a HTML/Java Script section in your sidebar, and then just copy paste this here.  :-)

I am storing some other buttons from this blog, which you are also welcomed to share, here:


If you want to add that...here's the code (centered):

<CENTER><a href="http://wacomom.blogspot.com/2015/08/dining-deals-waco.html"><img border="0" src="http://3.bp.blogspot.com/-uFqJmCIIDN0/VfG_1MMDDNI/AAAAAAAAEI0/s1e4tW9x42A/s1600/WacoDiningDeals.jpg" width="150" /></a></CENTER>





If you want to add that...here's the code (centered):

<CENTER><a href="http://wacomom.blogspot.com/search/label/VBS%20Directory"><img border="0" src="http://1.bp.blogspot.com/-C1NtanHTgwk/U62cVrsqSrI/AAAAAAAAC2g/39M0_X99uoQ/s1600/WacoVBSguide.png" width="150" /></a></CENTER>








No comments:

Post a Comment