« Having Blog Spam Problems? Let us know! | Main | Hide Your Email Address Using Javascript »
July 15, 2005
Want Random Entry Excerpts on the Side?
Want to add random entry excerpts on the side of your blog to entice readers to dig deeper into your archives? Ben Huffine has crafted some code that'll do just that -- check out the box on the right side of this blog's main page.
You'll need to stick some CSS in your stylesheet -- all of they way at the bottom would be fine. Here's some that should suffice (it may be a bit clunky, but it works -- edit it however you like):
.archivedig {
font-size: 11px;
font-family: Arial, Helvetica, sans-serif;
line-height: 110%;
color: #9F998B;
text-align: left;
margin-bottom: 15px;
background-color: #FFFFFF;
padding:8px;
letter-spacing: none;
border: 1px solid #0052C2;
overflow: hidden;
}
.archivedig a, .archivedig a:link, .archivedig a:visited {
text-decoration: underline;
color: #0052C2;
overflow: hidden;
}
.archivedig a:active, .archivedig a:hover {
color: #999999;
overflow: hidden;
}
.archivedig h1, .archivedig h2, .archivedig h3 {
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;
color: #8F8774;
border: none;
background-color: transparent;
margin-bottom: 4px;
text-align: left;
overflow: hidden;
}
.archivedig h1 a, .archivedig h1 a:link, .archivedig h1 a:visited, .archivedig h2 a, .archivedig h2 a:link, .archivedig h2 a:visited, .archivedig h3 a, .archivedig h3 a:link, .archivedig h3 a:visited {
text-decoration: none;
color: #0052C2;
overflow: hidden;
}
.archivedig h1 a, .archivedig h1 a:link, .archivedig h1 a:visited, .archivedig h2 a, .archivedig h2 a:link, .archivedig h2 a:visited, .archivedig h3 a, .archivedig h3 a:link, .archivedig h3 a:visited {
color: #999999;
overflow: hidden;
}
.archivedig b {
text-decoration: none;
overflow: hidden;
}
You'll also need to create a module. Go to to your template editing menu and scroll down to the bottom. Click "Create new template module." Name the new module ARCHIVEDIG. Now, put the code below in the Module Body:
<script language="javascript">
<!--
var i = 0;
var entries = new Array();
<MTEntries category="">
var year = '<$MTEntryDate format="%Y"$>';
var day = '<$MTEntryDate format="%j"$>';
var link = '<$MTEntryPermalink valid_html="yes"$>';
var title = '<$MTEntryTitle excerpt_words="5" encode_js="1" $>';
var body = '<$MTEntryExcerpt remove_html="1" encode_js="1" $>';
entries[i++] = new Array(year,day,link,title,body);
</MTEntries>
var index = Math.round(Math.random() * (<MTBlogEntryCount>-1));
var entry = entries[index];
year = entry[0];
day = entry[1];
link = entry[2];
title = entry[3];
body = entry[4];
document.write('<div class="archivedig">');
document.write('<h2>' + year + ' DAY ' + day + '</h2>');
document.write('<div style="padding-bottom:3px;"><a href="' + link + '"><b>' + title + '</b></a></div>');
document.write(body);
document.write('<br/>');
document.write('<div style="padding-top:3px;"><a href="' + link + '">Read More...</a></div>');
document.write('</div>');
//-->
</script>
Now, name this module STYLE-TOP and click save. Go to your Main Index and stick this somewhere in your template (wherever you want the module to be displayed): <$MTInclude module="STYLE-TOP"$>
Next, rebuild your entire blog and then check it out to make sure it's working. Enjoy!
Want Some Code? | By Hugo Fitch | 05:52 PM
Trackback Pings
TrackBack URL for this entry:
http://chattablogs.com/mt/mt-tb.cgi/23241
Listed below are links to weblogs that reference Want Random Entry Excerpts on the Side?:
Comments
this looks too tempting, thanks ron!
Posted by: katiek at July 17, 2005 04:08 PM
Got an error message saying it couldn't find module STYLE-TOP, also how do you put in exactly what you want the side excerpt to say?
Posted by: katiek at July 17, 2005 04:18 PM
Katie: I know exactly what that error is that you're having. I'll fix it.
Beneath your entries is a field for writing an entry excerpt. You can specify what each excerpt will say there or you can dig around in your weblog configuration and specify the length of the excerpts (40 words or whatever).
Posted by: Ron (HF) at July 17, 2005 08:38 PM
Why do we have to user MT 2.x stylesheet templates? Why can't we use 3.x?
Posted by: mrscrumley at July 18, 2005 09:59 AM
Because they're not compatible. There's really no simple, copy-and-paste solution for changing your blog's style. However, you can style your blog however you want -- provided that you know how to use CSS.
Posted by: Ron at July 18, 2005 10:09 AM
If you pull up my blog, it sometimes shows my entries or if you highlight them, it changes it to orange; however, How can I make the entire page; but the banner, orange? Also, it's not changing my font size of my entries when I try to change the font. Please HELP!!! Also, how do I set up to where my latest comments show on the side bar like the other titles? Thanks alot.
Posted by: Sabrina at July 20, 2005 12:53 PM
Sabrina: Before I attempt to answer your questions, I should start by saying that you've replaced your stylesheet with CSS code that is not supported by the default ChattaBlogs templates. Probably, the reason you're having a hard time is because you've replaced your stylesheet instead of altering the existing one.
If you pull up my blog, it sometimes shows my entries or if you highlight them, it changes it to orange;
I'm not sure I understand what you mean...
however, How can I make the entire page; but the banner, orange?
Er, this is done in the CSS. What do you mean by the "entire page?"
it's not changing my font size of my entries when I try to change the font
Are you trying to change this in the CSS?
Also, how do I set up to where my latest comments show on the side bar like the other titles?
I'll have to post the code you need in an entry on this site sometime soon. The default templates came with the code for displaying the comments on the side, but it looks like you may have inadvertantly slain that.
Posted by: Ron at July 21, 2005 02:40 PM
