Q-A As promised, here is the latest Blogs By Heather Q&A. Every week I would like to try and recap all the questions and answers as I feel many would benefit from the answers and appreciate the questions.


Discussion This Week: 

  1. Dropdown menu code questions
  2. Sidebar moved beneath posting area
  3. How to use a watermark
  4. How to make a button point to a specific URL/address
  5. How to add the Live Traffic Feed (Feedjit)
  6. Tiny URL – what is the difference between that and a hyperlink

Dropdown Menu Coding Questions

In my last Q&A I mentioned how to create a dropdown menu and the code I used (as a base, to get started), here are a few follow up questions:

  1. How to create a link to a post from the dropdown menu
  2. How to link it to a category (of posts instead of individual posts)

How to create a link to different posts in the dropdown menu

It would be the same as if you were linking to a page or external site.
For example….this is a part of a dropdown menu for Recent Posts…..
            <li id="main">
            <a href="#">Recent Posts</a>
                <ul id="subnav">
                      <li><a href="https://www.blogsbyheather.com/2011/06/papers-pixels-june-2011-issue-are-you-using-google-places.html">Are you listed on Google Places?</a></li>
                      <li><a href="https://www.blogsbyheather.com/2011/06/blogs-by-heather-weekly-qa-1.html">Weekly Q&A</a></li>
                      <li><a href="https://www.blogsbyheather.com/2011/06/printer-friendly-blogs.html">Printer Friendly Blogs</a></li>
                      <li><a href="https://www.blogsbyheather.com/2011/06/using-a-store-page-template.html">Using a Store Page Template</a></li>

How to create a dropdown for certain categories

It would be the same but the HREF is to your category (which you can get by displaying the categories list in your sidebar and then right-clicking on a specific one and choosing Copy Shortcut (Copy Link Location)).
For example….this is a part of a dropdown menu for some of mine…..
            <li id="main">
            <a href="#">Categories</a>
                <ul id="subnav">
                      <li><a href="https://www.blogsbyheather.com/seo-tips/">SEO Tips</a></li>
                      <li><a href="https://www.blogsbyheather.com/weekly-qa/">Weekly Q&A</a></li>
                      <li><a href="https://www.blogsbyheather.com/did_you_know/">Did You Know</a></li>

Sidebar Moved To Bottom

When your sidebar seems to disappear or moves under the main post area, that means there is an HTML error on your site – normally in a post you just created or in a new sidebar gadget you've added.

So whatever new HTML you may have added, such as installing a new blog template or a badge from another site; there may be something wrong with the HTML code provided. Therefore try removing the recently added gadget or revert back to an old template and see if that solves the problem.

On many occasions I have had to go to each individual "post" and set it to draft, view the blog, see if the problem is there or fixed. If it is fixed, then you know there is something wrong in that specific post and its easiest just to redo your post rather than trying to figure out where the error is.

How To Use a Watermark

Okay, so you've been given a watermark to use on your artwork (by your blog designer) or have created one yourself…but how do you get it on, how do you use it? You want to use a watermark to help protect your artwork, creations, images on the web.  I have these sources and tutorials for you:

Creating images:

Tutorial on creating a watermark in Photoshop:

FREE program for PC to resize images, crop images and add watermark and more:

FREE iWatermark program tutorial for the Mac.

Another FREE program, GIMP for PC and Mac tutorials:


How to make an image/button point to a specific URL

This again refers back to my last Q&A post in adding a sidebar gadget and having it link to a location (Typepad).

However, here are additional tutorials on how to upload an image in your blog's sidebar and have it link to a specific URL/location:

Click for Blogger

Click for TypePad

Click for WordPress

Add a Live Feed – FeedJit

Go to www.FeedJit.com

Click the button "Choose Your FeedJit".

On the left, click Sign Up under FeedJit, Completely Free.

CM Capture 12

Enter your information and click the Get Your Traffic Feed.

CM Capture 13

Choose a color scheme (in this sample you see White Ice).

Adjust the size. In this sample I set it to 180 as most sidebars are 200px wide by default and this will fit best for most.

Adjust the length. Default was 10 but then that takes up a lot of sidebar space. So in this sample I set it to 5.

Then click on the bottom to install the gadget, where you see "Blogger Blog" as a default. If you click that dropdown you will see Blogger, WordPress, TypePad and other.

Click your blog platform, click GO and it will do the rest (adding a gadget to your blog).


What is the difference between Tiny URL and a Hyperlink

They are the same in that they are both hyperlinks.  Tiny URL is a service that simply turns a URL that is very, very long, into a smaller one.

You can see an example on their site: http://tinyurl.com/


I hope you enjoyed this Q&A – great questions!!!!!!

Until next time….

Happy Blogging!

Heather Wright-Porto

Pin It on Pinterest