3.7 Building a Blogroll
Okay, this might be the trickiest page in the entire module. Just follow the steps, and everything should work pretty smoothly.
Go back to your Blogger account (it should still be open in another browser window) and click the Template tab/link at the top of the page. Remember how I described the Blogger template as a dynamic HTML document? Well, this is it. And you're about to customize yours:
Scroll about 90% of the way down through the template until you find a chunk of code that looks like this:
<h2 class="sidebar-title">Links</h2>
<ul>
<li><a href="http://news.google.com">Google News</a></li>
<li><a href="http://help.blogger.com">Edit-Me</a></li>
<li><a href="http://help.blogger.com">Edit-Me</a></li>
</ul>
Change the word "Links" to "Blogroll." Then begin adding links. Here's how you do it:
Open the site that you want to link to in another browser window.
Copy the URL from the address bar of that window by selecting the URL and using either Edit>Copy or Ctrl+C.
Highlight "http://news.google.com" in the Blogger template and paste (Edit>Paste or Ctrl+V) the new URL.
Replace "Google News" with "New York Times."
And, finally, add this bit of code between the last quotation mark in the URL and the closing bracket (>): target="_blank" This will make the New York Times website open in a new window.
If you've done everything correctly, the old line looked like this:
<li><a href="http://news.google.com">Google News</a></li>
And the new line looks like this:
<li><a href="http://www.nytimes.com" target="_blank">New York
Times </a></li>
You build your blogroll by repeating this line again and again, changing the URL and link name each time. I've organized my blogroll alphabetically by the name of the link. Within the Blogger template, my blogroll code looks like this.
When you have finished building your blogroll, click the "Save Template Changes" button. Blogger will save the new, customized template, but in order to see those changes on your actual blog, you will need to "Republish" your blog. Do so now, then refresh your blog to see the blogroll in action.
Click next to complete the Lesson 3 activity.
Menu
1. history of blogs
2. anatomy of a blog
3. how-to
4. active learning
5. professional development
table of contents
A Little Tip
HTML is picky. If you accidentally forget a quotation mark or forward slash, your link might not work.
If something goes wrong, you can always return to the Template tab, scroll down, and start all over again.