Newbie Tips: Blogrolls and the Space under the Calendar

May 12, 2003 Comments Off on Newbie Tips: Blogrolls and the Space under the Calendar

I finally figured out how to use the blank space under my calendar for phrases, other links, mysubscriptions(and anything else that I didn’t want to put or couldn’t figure out how to put into my navigator links) and how to align/center the text and change the font size of mysubscriptions.opml with a little help from the discussion boards and a friend at radio.

How to create a Blogroll with Radio’s outliner has some good information about blogrolls and how to use Radio’s outliner to create them however it can be quite confusing for a newbie and was a little confusing to me but its a good reference point.

Description of Blogrolls: Blogrolls are a collection of links on the home page of a weblog that point to sites that are somehow related to yours. They serve several purposes, they direct readers to the sites that are important to you, and serve as a set of bookmarks for you. They also help build page rank in search engines for sites you wish to bestow page rank on.

Two things you will be doing is editing your home page template which can be found under PREFS and then TEMPLATES

Adding CSS Style Items to the Home Page Template (for Blogrolls): You will want to add .blogrollText and .blogrollLinkedText items to the CSS Style Sheet section at the top of the home page template especially if you want the blogrolls to align the way you want them too.

Open the home page template
Scroll down til you find the following section

.small {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;
}

   a:hover {
    text-decoration: none;
    }

In between these two items you want to add the following:

.blogrollText {
        font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold;
        padding: 0px 0px;
        padding-top: 2ex;
        }
.blogrollLinkedText {text-align: left;
        font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;
        padding: 0px 0px;
        }

so it will look like this when you are done

.small {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;
}

 .blogrollText {
        font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold;
        padding: 0px 0px;
        padding-top: 2ex;
        }
.blogrollLinkedText {text-align: left;
        font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px;
        padding: 0px 0px;
        }

  a:hover {
    text-decoration: none;
    }

Submit your changes
…..personally I like to do a small section, submit my changes and make sure I haven’t screwed up anything 🙂 by going back to my HOME, posting a test post, and upstream my changes to make sure everything still looks alright.

Inside the .blogrollLinkedText  – I have text-align: left; – this means that my blogrolls will be aligned to the left (thanks to Roger Cadenhead who answered my question on the discussion board – I got this to work this morning). I suppose if you want everything to align to the center you would just substitue center for left or right if you want right aligned text.

Finding the blank space under the calendar for text, other links and/or blogrolls and mysubscriptions:  Next you will need to find the section under my calendar in your home page template which looks like this (which is the radio calendar macro)

</td>
          <td valign=”top” width=”1″>
            <%radio.weblog.drawcalendar ()%>
            <br>
             <br>

its here between the <br> and the </td> that you can add different things such as other links, text, blogrolls, mysubscriptions blogroll, etc to the space under the calendar

    </td>

 </tr>
      </table>

Adding Text Only: Start with something simple such as a phrase “is this working” or anything you like. I added the text  “To see my recent posts, scroll to the bottom of the page” Here is what it looks like as the code in the home page template

</td>
          <td valign=”top” width=”1″>
            <%radio.weblog.drawcalendar ()%>
            <br>
             <br>

<p align=left>                 
<i>
<font color=”#3366CC”><b>To see my recent posts </b></font><b>
<font color=”#669999″>scroll to the bottom </font></b>
<font color=”#D988DB”><b>of the this page</b></font></i></font><br></p>
<p>   
</td>

 </tr>
      </table>

Explanation of some of the code:
<p align=left> I wanted my text to align to the left
<i> I wanted my text italized  <b> and bolded
<p> means paragraph (I wanted it separate from the next item and not right next to it)
<br> means a break in the line but not a new paragraph

Adding other links: I added some other links such as blogshares, ring links, and centered them. Also made the font small. After the calendar section, I added the following first:

             </div>
                  <hr size=”1″>
                  <br>
                  <center>
                    <div style=”width: 148; height: 319″><p> 

which them looks like this under the calendar:

</td>
          <td valign=”top” width=”1″>
            <%radio.weblog.drawcalendar ()%>
            <br>
             <br>

 </div>
                  <hr size=”1″>
                  <br>
                  <center>
                    <div style=”width: 148; height: 319″><p> 

You are more than welcome to just copy the code from </div>…<p> section and then add your links also if that helps

then my links

then <p> after my links

which then looks like this:

</td>
          <td valign=”top” width=”1″>
            <%radio.weblog.drawcalendar ()%>
            <br>
             <br>

 </div>
                  <hr size=”1″>
                  <br>
                  <center>
                    <div style=”width: 148; height: 319″><p> 

<b><font size=”1″ color=”#336699″>My</font></b><font size=”1″ color=”#0066FF”>
</font><font size=”1″> <b> <a href=”http://bloginality.love-productions.com“>
<font color=”#0066FF”>Bloginality</font></a></b><font color=”#336699″>
  <b>is </b></font>
<b> <a href=”http://bloginality.love-productions.com/intp.php“>
<font color=”#0066FF”>INTP</font></a></b></font><font size=”1″ color=”#0066FF”>!!!</font>

<p>

then I submited the changes, and again when to my home, edited my test post and upstreamed the changes once again to make sure I didn’t screw up anything.

Some of the links I added include javascript, just paste them under the <div class=…>section and also put a <p> at the end of the link which denotes next paragraph section

Explanations of the code:

</div> I think this has something to do with CSS style sheets (like a separate division or table)
<hr size=”1″> font size 
<br> next line
<center> center the table
<div style=”width: 148; height: 319″>the size of the table under the calendar table
<p>  next paragraph

Adding Blogrolls and/or MySubscriptions: mysubscriptions is a blogroll essentially, I think its the same concept in radio – just a different macro but it uses the CSS item called .blogrollLinkedText for font style, padding and text alignment which is why you first added the CSS items to the CSS style sheet at the top of your home page template.

This is actually pretty easy to just add the blogroll macro or the mysubscriptions macro into the space below the calendar. Find the calendar macro

</td>
          <td valign=”top” width=”1″>
            <%radio.weblog.drawcalendar ()%>
            <br>
             <br>

add the “mysubscriptions” macro

<%radio.macros.blogroll (“http://radio.weblogs.com/0119318/gems/mySubscriptions.opml“)%>
<p>

and your done..it will align it left – all the coffee mugs in a row

Submit your changes, post something and upstream to see your changes to your home page template and your added blogrolls.

If you want to add a different blogroll that you have created just enter the macro called:          <%radio.macros.blogroll %> in the same section above where you added the “mysubscriptions” macro

Adding a title to the Blogroll: If you want to add a title before the “mysubscriptions” macro, enter the following (see green text) 

</td>
          <td valign=”top” width=”1″>
            <%radio.weblog.drawcalendar ()%>
            <br>
             <br>

My Subscriptions<br>

<%radio.macros.blogroll (“http://radio.weblogs.com/0119318/gems/mySubscriptions.opml“)%>
<p>

if you want the title also aligned to the left, enter <p align=left> before the text

There are some references in this newbie tip that you may not understand such as CSS style sheets..its ok not to understand them..just as long as you get the desired results on your home page..

Changing the font size of the blogroll: this I did inside Radio and I think I’ll start another newbie tip on how to acheive this..its actually pretty easy but this was enough info for today..plus I need to go fix something on my blogroll that I messed with last night. Also its goregous outside today and time to get off the computer and be out in the sun before it rains again.

Categories : Radio Userland