Sunday, March 22, 2009

Using the "Read More" Function

Ok guys, here's a cool tip that will help you make your blog look a lot cleaner and more inviting.

See how you had to click that link that said "Read More" so you could see what the tip is? Well... using that link is the tip!

I agree that I may have used it a little too soon, but, in this case, I was using it to illustrate a point. A good rule-of-thumb is to use it at the end of your second paragraph (or maybe even at the end of the first, if you tend to write longer paragraphs).

As to why you should use it at all, it's been proven that most readers won't stay on a page too long if they feel that the page is too "wordy". Let's face it, we're a society that's in a rush, and readers are no exception. By using this function, you will allow your readers to skim your page and choose just the topics they want to read, as opposed to forcing them to scroll past what they don't want to see. If you create a place that feels inviting, you will create a place readers wish to return to... and that's the whole goal, right?

So how do you do it?

*This is going to seem daunting, but I promise you it isn't that hard... just do it step by step and you should be fine*

First, you have to make sure your blog template is ready to use "expandable posts". If you have never uploaded a template, and you're using one of the templates provided by Blogger, then you will have to do these steps. If you have uploaded a template, you may or may not need to do this part. If you don't know what sort of template you uploaded, I would recommend not doing this until you check with someone, as you run the risk of losing your widgets. (You can also send me the code (if you still have it) and I will check it for you!) For those of you who are sure you are safe, follow these steps:

* If you are using an uploaded template, and you are sure you can use expandable posts, please skip ahead to step #8 *

1. Go to your dashboard and click "Layout", then click the "Edit HTML" tab.

2.THIS IS SUPER IMPORTANT!!! You need to back up your template before you do anything else. To do that, look for this part of the screen:

and hit "Download Full Template". Then just follow the directions on the screen. (If you have ANY problems here, please do NOT proceed until you talk to me!) Once you are sure you've done this part, go to step three.

3. In the section that says "Edit Template" you will see a box that you can click to "Expand Widget Templates". Make sure there is a check mark in that box.

4. Scroll through all that crazy looking code till you find this:

<data:post.body/>

(This is the hardest part. It should be almost midway down the page of code, and I promise it's in there! LOL)

5. Copy and paste the code below directly above the part you just found:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>


6. Copy and paste the code below directly below the part you found:

<b:if cond='data:blog.pageType != "item"'><br />
<a expr:href='data:post.url'>Read more...</a>
</b:if>
</b:if>


If you've done it right, it should look like this:


7. Hit "Save Template".

8. Go to your blogger dashboard and click "Settings". Next, click the third tab from the left, the one that says "Formatting". Scroll down to the bottom of the page till you see this:


9. Now just copy and paste this code in the box:

<span id="fullpost"></span>

It should look like this:


10. Hit save!

What will happen now is that whenever you hit "New Post" you will see those tags you just typed already waiting on you. Start your post before the tags, and when you get to the place you want to "break" your page, skip over the first tag and continue typing. For example, if you type this:

"The quick brown fox <span id="fullpost"> jumps over the lazy dog. </span>"

you will see "The quick brown fox" on the main page (with a "Read More" link) and then you will see the entire sentence on the second page. You can feel free to try this sentence in a test post to get a feel for what I mean, but just be warned that you won't be able to see the link in preview mode. You will actually have to publish the post in order for it to show up.

I really hope all that made sense. Let me know if you have any questions!



p.s. If you don't want to add a page break to one of your posts, just delete those tags. ;0)

11 comments:

Diana March 22, 2009 at 1:52 PM  

Hi! Your blog is really very helpful!! Love the tricks and tips that you are offering!!

Thank you so much for puttin in the time to set this up!!

Regards
Diana
http://djstoreroom.blogspot.com

Janet March 22, 2009 at 6:10 PM  

Hey, cool! Been wondering how to do that, as I'm definitely pretty verbose. ;) Thanks again for a really helpful tip!

Ninja Jenn™ March 23, 2009 at 4:19 AM  

hi! glad you guys have found it useful! let me know if there's something you want to see here! and thanks for reading!

<3

Karrie March 23, 2009 at 10:08 PM  

Ok Jenn, I am going to try putting this to the test right now. I am printing to follow! God help me...LOL! Hey, you have been missed over the past few days :)

Janet March 24, 2009 at 1:36 AM  

I'd like to know how to get something I post on one of my blogs to magically appear on another blog as well. Is that possible?

Ninja Jenn™ March 24, 2009 at 2:07 AM  

hi janet! that's TOTALLY possible! i'll add "cross posting" to my list of upcoming topics!

thanks for the idea!

<3

Janet March 24, 2009 at 2:42 AM  

Wow, that'd be SO great. The sooner the better, not that I'm totally impatient and chomping at the bit and really excited and anxious or anything. Oh, no. Not me. :P

Ninja Jenn™ March 24, 2009 at 2:57 AM  

LOL

i will do my best to get it up by the end of next week... are you trying to cross post between two blogger blogs? or are you using to different platforms?

if you let me know soon, i will try to use those sites in my tutorial!

;0)

<3

Janet March 24, 2009 at 3:17 AM  

Well, *I'm* cross posting between Blogger blogs so I'm particularly interested in that angle.

That being said, I'm also curious how to synch my Blogger blog with e.g. my Artfire blog or my Facebook page.

Jen March 26, 2009 at 1:15 PM  

Jenn, I swear if you were here I'd kiss you square of the mouth. ;)

I have been worrying about my personal blog (where my posts are sometimes huge). With your instructions, I was able to add that cute lil "read more" links to all my posts.

Thank you soooooo much. You're a life saver.

Jen

Ninja Jenn™ March 26, 2009 at 2:52 PM  

LOL!

I'm happy you could use this tip!

if there is anything else you want to learn, just let me know! i'll do what i can to help!

<3

Label Cloud


Powered By:Blogger Widgets

  © Blogger templates ProBlogger Template by Ourblogtemplates.com 2008

Back to TOP