Tuesday, February 12, 2008

Adding A LinkList To Your Blog

Blogging is all about ourselves, and our friends. We write about ourselves, and we refer to our friends, as they write about themselves. One of the most popular accessories on our blogs - the blogroll, or linklist - is simply a collection of links to our friends blogs. We typically position a linklist in the sidebar, so it's available to our readers as they peruse our blog.

With a Layouts template, adding a linklist, like many other accessories, is done with the Page Elements GUI wizard. Once we have a LinkList GUI wizard open, it's just a matter of pasting or typing the names and addresses of our friends blogs, one by one, into the linklist.

Look at the list to the right, under the Help Links picture. I just added a link to my Networking blog, PChuck's Network, as an example.
  • New Site URL http://networking.nitecruzr.net/
  • New Site Name PChuck's Network
  • Hit "Add Link".
  • Repeat with more of your friends web sites - or various posts in your blog.
  • If you need to change any entry in the list, now or in the future, click on the "Edit" link to the left of the entry in question.
  • Any linklist can be displayed in any of three orders.
    • Alphabetically.
    • Reverse alphabetically.
    • Manually or un sorted. If you select "Don't Sort" for "Sorting", you can re order the list as you like. To move any entry up or down in the list, click on the up or down arrow next to the "Edit" and "Delete" links. Be careful, and don't click on "Delete" unless you mean to.
  • When you're done adding and editing your list of friends web sites, hit "Save Changes". Hit "Cancel", if you mess up too badly, and want to start over.
  • As with any Page Elements object, reposition the new linklist on the page, as it pleases you.
  • Hit Save.
  • Admire, and test, your new blog accessory.


After you have your linklist setup, adding an entry to the list is simply a matter of editing the list. You can do this from the Page Elements GUI wizard, or, if you have QuickEdit enabled, by clicking on the QuickEdit icon (aka "DragonFly") at the lower right corner of the linklist in question.

You can have, theoretically, as many linklists in your blog as you like. And, you can have as many items in a list as you like. So, get started. You're welcome to add a link to this blog, to start your linklist off right.
  • New Site URL http://blogging.nitecruzr.net/
  • New Site Name The Real Blogger Status
  • Hit "Add Link".


After you have your new linklist working, if you decide that it takes up too much room on the page, you can hide your linklist, with a bit of effort. Or look at the new page element - the BlogList. And now, we have Following, a two way BlogList, which is still more fun.

The LinkList gadget, though, has one major deficiency - it lacks the ability to open linked pages in a new tab / window. My policy, and I'll bet I'm not alone, is to open a new browser tab / window whenever I link out of my blog to another blog or web site. This is a convenience to my readers, and I know other folks do the same. But you can't do that, with a Blogger LinkList.

If you want a linklist with targets opening in a new window, you have to code it as raw HTML, and install it as an HTML / JavaScript gadget.

See the linklist in the top of my sidebar? ">> Home" etc? That's a native Blogger linklist.

<ul>
<li><a href="http://blogging.nitecruzr.net/">&gt;&gt; Home</a></li>
<li><a href="http://blogging.nitecruzr.net/search/label/About%20Us?max-results=100">&gt;&gt; About Us</a></li>

<li><a href="http://www.nitecruzr.net/">Nitecruzr Dot Net</a></li>
<li><a href="http://test-draft.nitecruzr.net/">Draft Test</a></li>
<li><a href="http://www.ultraguest.com/?id=1138394596&sign=1">Please Sign My Guestbook</a></li>
<li><a href="http://www.ultraguest.com/">Get A FREE Guestbook</a></li>
<li><a href="http://blogging.nitecruzr.net/2005/06/leave-comments-here.html">Leave General Comments Here</a></li>
</ul>

None of those links create a new tab / window, when you click on them. To make that happen, I'll have to code native HTML, in an HTML gadget.

<ul>
<li><a href="http://blogging.nitecruzr.net/" target="_blank">
&gt;&gt; Home</a></li>
<li><a href="http://blogging.nitecruzr.net/search/label/About%20Us?
max-results=100" target="_blank">&gt;&gt; About Us</a></li>
<li><a href="http://www.nitecruzr.net/" target="_blank">
Nitecruzr Dot Net</a></li>
<li><a href="http://test-draft.nitecruzr.net/" target="_blank">
Draft Test</a></li>
<li><a href="http://www.ultraguest.com/?id=1138394596&sign=1" target="_blank">
Please Sign My Guestbook</a></li>
<li><a href="http://www.ultraguest.com/" target="_blank">
Get A FREE Guestbook</a></li>
<li><a href="http://blogging.nitecruzr.net/2005/06/leave-comments-here.html" target="_blank">
Leave General Comments Here</a></li>
</ul>

Right now, I appreciate the convenience of the linklist, so I can't add " target="_blank"". And you have to open your own new window. Sorry.

>> Top

9 comments:

Linda said...

I am a first grader(not really) but you will think that I am and I need some help with links. I have read your blog, google etc but for some reason it does not click. Is there a 1st grade, step by step level somewhere that I can get the basics and then go from there. I have never done links before and I we fear what we have never done! Question, on the view blog, where it says links to this post, can I add my other pages to this??? OR is this something for outsiders? BUT, I need the step/step to learn what I am doing. I saw on instructions you put it in the set up, but I am so confused. HELP! Linda

Chuck said...

Linda,

You're going to have to post in Blogger Help Forum: How Do I?, and ask interactively.

Blogging is a complex subject, and everything won't be written in a checklist. You're going to have to state your problem, listen to the advice, and learn occasionally by doing new stuff.

Troy said...

Hi. I just tried this, and it worked except for one thing...the text in the bottom of the gadget gets cut off. How can I fix this?

~Nikki~ said...

Thanks so much! This is exactly what I was looking for.

Doris said...

Hi Chuck,
All I can see is how I found you I do not KNOW! BUT glad I did just want you to know that there are still people who appreciate the help. Like Linda I love to learn even if I'm "Older" just now getting where I can enjoy making the time for it. My Blog still needs lots of work but the learning is enjoyable so when I seen this post and Linda's question you had this "Blogger Help Forum: HOW DO I? link going there now to start learning more. Just wanted to say "THANKS"!

Have a great day I did!,
Doris Price

jillian :: cornflake dreams. said...

great tutorial. i like the link list but you're right i might want to edit mine so links open in a new page. One question tho-- is it possible to edit the appearance of the link list (when it is applied as a horizontal bar under the blog header)? i want to change the justification and remove the border. (i have found codes to do this to the pages gadgets in ccs but it doesn't work for the link list). any suggestions would be appreciated! -- jillian:: cornflake dreams

Sim said...

Thanks alot Chuck. Very simple explanation. I would like my label list to show on top horizontally and highlighted differently for each label so that newbies like me know that there is an option to select individual labels and just have togo through the whole static page.

So if i have link list in my template where you suggested I put it , how do I add a "LABEL LIST "

thanks

Chuck said...

Sim,

Start with a linklist installed in place of the Pages gadget. The details of several of your questions really should be discussed in Blogger Help Forum: How Do I?, though.

http://blogging.nitecruzr.net/2010/04/static-pages-and-custom-pages-index.html

Martaaa said...

thank you for this post! I've been struggling with my Link List and opening it in a new tab for so long and all I needed was simple li.../li code...

An Interesting Distraction