RSS Awareness Day

RSS definition: (Really Simple Syndication) is a format used to deliver information from websites and pages that get updated regularly.

May 1st is the first official RSS Awareness Day. Many, many people don't know or understand what RSS is, nor do they know it can benefit them.





I have done a few posts concerning RSS feeds, from explaining what an RSS feed is, to how to set up your own...worth checking out.

RSS in Simple Terms
Setting up a RSS Feed
Comment Feed Tutorial
Redirect Your Feed
RMail - Subscribe by Email to Any RSS Feed

To make it simple most bloggers put their feed icon in a prominent spot for you to see. At the present time, mine is near the top of the page in the right hand corner. If you click on it, and have a reader such as Google Reader, then you have subscribed to my RSS feed! Now, every time I post, it will be delivered to your reader, and you can read it there or click on the link and read it from my blog. How sweet is that?!

A New Look for BlogU

I felt my header has seen better days, so I fired up GIMP and went to work. I do have PhotoShop CS3, but I'm not that proficient with it yet. A few minor changes were made here and there to pull it all together.

Credits to:

1. Creative Blogging and signature font: RedstarBold
2. BlogU font; Fontin
3. Dashed swirly line: Moargh.de

It was such fun, and needed so badly. I hope everyone likes it!

Remove - Subscribe to: Posts (Atom)

Hi annie,I was just just wondering if there is a code on how to remove the feed link at the bottom of a post, the one which says Post (Atom). Without affecting anything.

1. Go to dashboard/ template/ edit HTML
2. Click the 'Expand Widgets Templates' box
3. Find:

<b:if cond='data:blog.pageType != "item"'> <!-- Blog feed links -->
<b:if cond='data:feedLinks'>
<div class='blog-feeds'>
<b:include data='feedLinks' name='feedLinksBody'/>
</div>
</b:if>

Remove this line:

<b:include data='feedLinks' name='feedLinksBody'/>

That should remove Posts (Atom).

Unique Background Images for Widgets

I also wanna know, is it possible to assign a different background image to each widget?



Gelo, yes, it is possible! As you can see in the images below. Top is the normal widgets. Bottom is the same widgets with background images in place.

Widget without background image

Widget with background image

To achieve this takes a little sleuth work. Each widget has a unique name. In this example, I have three widgets:

1. LinkList1
   
2. Text1
   
3. BlogArchive1

You can find the unique names of your widgets by searching your template for <b:widget id=

My search turned up: <b:widget id='LinkList1' locked='false' title='link widget' type='LinkList'/> So, my unique ID here is LinkList1.

After you find and identify each widget's unique ID, you will do a little work in the CSS Style Sheet. It doesn't make any difference where you actually place this code, but for neatness sake you can make a new group called Widgets.

/* Widgets
----------------------------------------------- */

Of course, you could have LinkList2, LinkList2, Text2, HTML1, etc.

For each widget that you want to add an image to, add the code as I have below to the CSS Style Sheet.

#LinkList1{
background: #fff url(IMAGE URL) no-repeat;
}
#Text1{
background: #fff url(IMAGE URL) no-repeat;
}
#BlogArchive1{
background: #fff url(IMAGE URL) no-repeat;
}

And, that is that.

Add a Widget Beside Your Header

Hey Annie!

Thanks for the tutorials on this blog. They're a big help.

I would like to know, is there a way to add content to the right of my header? Sort of like another sidebar? My blog is HERE. Please take the time to visit. It's still under construction though.

Thank you and more power.



There is a way, and it can be done with creating a widget. First you will make a couple of changes to your CSS style sheet. You will want to find the Header section. Look for something like this:

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

Basically what we are doing is dividing the header up. I'm going to make each side equal, but you can use any proportion you want allowing for the margins. So, replace that code with this:

#header {
width: 300px;
float: left;
margin: 5px;
text-align: center;
color:$pagetitlecolor;
}
#header-right {
width: 300px;
float: right;
color: $pagetitlecolor;
margin: 5px;
padding: 5px;
}

You can adjust these values to fit your template. (It should not equal more than your outer-wrapper.) Almost done! Find this code in your template:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='YOUR BLOG TITLE (Header)' type='Header'/>
</b:section>
</div>

And replace it with this:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='YOUR BLOG TITLE (Header)' type='Header'/>
</b:section>
<b:section class='header' id='header-right' showaddelement='yes'>
</b:section>
</div>

Take a look at your page element page and you will see your new widget.

Click for larger image

You can now add content to that widget. For my example, I added my profile. Here is a screen shot before:

Click for larger image

and here is after:

Click for larger image

You don't have to do anything where it says YOUR BLOG TITLE. Your title will automatically fill in. Now you can add whatever you like in that widget, from your profile to a picture!