Happy Kids, Inc: Must Have Blog Resource: HTML Tricks
Wednesday, May 8, 2013

Must Have Blog Resource: HTML Tricks


Most bloggers have a basic understanding and working knowledge of HTML, but would not consider themselves programmers or actually be able to write code.  But as a blogger, we deal with HTML almost everyday.  We add widgets to our blog.  We create posts and need to input HTML or edit it.  We upload images via an image URL.  

I am bringing you two HTML tips today that have been lifesavers for me!  They are quick, easy fixes and you will love them.
1. Clickable Link In A Comment Box.  I've shared this important tip before.  But it's such a great tip that I had to share it again, in case anyone missed it.  While some comment boxes on blogs offer the option to include your website information as a link, most do not.  If you manually type in your blog address within the comment box, it won't be a clickable link.  So, it's a little tougher for readers to copy and paste your site into a new search box to open.  The problem is solved with the code below:

<a href="YOUR LINK HERE">YOUR TITLE HERE</a>

Replace YOUR LINK HERE With your Link
 Replace YOUR TITLE HERE With your Link title (this is what will show up as the clickable text)

Example:
<a href="http://www.happykidsincblog.com">Happy Kids, Inc</a>

Once you copy and paste this code with your link and title, it should thus look like this:


2. Code To Center Images & Widgets.  For a long time, I have struggled with getting images & widgets to line up correctly on my blog.  In most cases, I would want these items to be centered within my side bar or across the top of my blog.  I would upload and try to tweak them to no avail.  Maybe they would be centered in my menu bar, maybe they wouldn't.  Well, the problem has been solved.  Simply enter the short code below BEFORE the HTML code of an image or widget you are trying to center:

<div align="center">

You can enter this code before any HTML code that you want to center.  I primarily use it on:  images, sponsor ads placed on my blog from a third party, widgets like ones for Instagram, Facebook, etc., affiliate ads, and social icons.  

For example, on my blog currently, I added this code to my advertiser HTML under my Happy Sponsor heading so that it would be nice and centered and not pushed to the left.  I also added it to my Bloglovin widget below my social icons, so it would be nice and centered.  

Play around with it!  It's easily added and if for some reason, you don't like the results, simply delete that line of code that you added.  

                               
If you like what you're reading, I invite you to follow my blog.  Cheers!
Meg on Pinterest!

submit to reddit

5 comments:

  1. I have been wanting to add my link to new blogs I visit when I comment!

    Kate
    Another Clean Slate

    ReplyDelete
  2. Thanks for the great tips. I am a new blogger and I am now following you. Found you through the Blog Hop Thursday.

    ReplyDelete
  3. I've used this code several times and it works perfectly! Thanks so much!!
    Carrie This Home

    ReplyDelete

09 10 11 12
Blogging tips