Saturday, February 16, 2002

Noscript updated for my Custom archive script generator

My archive script generator adds a bit more complexity to this already complex scheme. Here's an updated version of what you need to comment out in your archive template:

<!--
/*
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title><$BlogTitle$></title>
<style>
body {background:#666666;margin: 0px;font-family: Verdana, Arial, sans-serif;color: black;}
em {color: red; font-style: normal;}
.blogtitle {font-family: Verdana, Arial, sans-serif;color: white;font-size:32px;margin-left:20px;margin-bottom:1px; text-transform:uppercase;}
.links {font-family: Verdana, Arial, sans-serif;font-size:11px;}
A.links:hover{color:white;}
A {font-weight:bold;text-decoration:none;}
A:hover {color:red;}
.date {font-family: Verdana, Arial, sans-serif;color: black;font-size:16px;font-weight:bold;margin:10px;}
.posts {font-family: Verdana, Arial, sans-serif;color: black;font-size:12px;margin:10px;margin-top:0px;}
.byline {font-family: Verdana, Arial, sans-serif;color: #999999;font-size:11px;}
</style>
</head>
<body bgcolor="#666666" marginwidth="0" marginheight="0" link="#336699" vlink="#003366" alink="red">
<div align="center"><br>
<table width="95%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2" bgcolor="#336699" height="65" valign="bottom"><div class="blogtitle"><b><$BlogTitle$></b></div></td>
</tr>
<tr>
<td bgcolor="#cccccc" width="150" valign="top" align="right">
<br>
<div class="posts">
<$BlogDescription$><br>
<br>
<!--
In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page.
Thanks!
-->
<a href="http://www.blogger.com/"><img src="http://buttons.blogger.com/bloggerbutton1.gif" width="88" height="31" border="0" alt="This page is powered by Blogger. Isn't yours?"></a>
</div></td>
<td bgcolor="white">

<!--
*/
// -->
<!--

// Generated by the Blogger Archive Script Generator
// at http://philringnalda.com/scriptgen/
// Based on code by Andy Buchanan from
// http://weblog.cheesephone.co.uk/mytemplate.html

// User data
var currentPageName = "current";
var currentPageLink = "./";
var archivePath = "";
var preLink = "";
var postLink = "";

function ArchivePage_MakeLink(){
var month_name = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
var newName = preLink + month_name[this.StartDate.getMonth()]+" "+this.StartDate.getFullYear() + postLink;
var outString = "";

if ( -1 != location.href.indexOf( this.Link ) ){
outString = "<span class=\"archivelinks\">" + newName + "</span><br>";
}
else{
outString = "<a href=\"" + archivePath + this.Link + "\" class=\"archivelinks\">" + newName + "</a><br>";
}
return outString;
}

function ArchivePage_Compare( rhs ){
if ( this.StartDate == rhs.StartDate )
return 0;
else if ( this.StartDate > rhs.StartDate )
return 1;
else
return -1;
}

function ArchivePage( theLink, theName ){
this.Link = theLink;
this.Name = theName;

this.StartDate = new Date( this.Name.slice(6,10), this.Name.slice(0,2)-1, this.Name.slice(3,5) );
this.EndDate = new Date( this.Name.slice(13+6,13+10), this.Name.slice(13+0,13+2)-1, this.Name.slice(13+3,13+5) );

ArchivePage.prototype.MakeLink = ArchivePage_MakeLink;
ArchivePage.prototype.Compare = ArchivePage_Compare;
}

function bi_comp( a, b ){
return -a.Compare( b );
}


function FindIdx( myURL ){
for ( var n=0; n<BlogInfo.length; n++ ){
if ( -1 != myURL.indexOf( BlogInfo[n].Link ) )
return n;
}
return null;
}

function WriteArchiveSection( BlogInfo ){
BlogInfo.sort( bi_comp );
var start = 0;
var end = BlogInfo.length;
var currentPage = FindIdx(location.href);

if ( null != currentPage ){ document.write( "<a href=\"" + currentPageLink + "\">" + currentPageName + "</a><br>"); }
for ( var n=start; n<end; n++ ){
document.write( BlogInfo[n].MakeLink() );
}


}
var count=0;
var BlogInfo = new Array();
// -->
<Blogger>
<!--
BlogInfo[count++] = new ArchivePage( "<$BlogArchiveLink$>" , "<$BlogArchiveName$>" );
// --> <a href='<$BlogArchiveLink$>'><$BlogArchiveName$></a><br>

</Blogger>
<!--
WriteArchiveSection( BlogInfo );
// --> <a href='./'>current</a>
<!--
/*
// -->

<br></td>
</tr>
</table>
</div>
</body>
</html>
<!--
*/
// -->

posted by Phil Ringnalda at 2/16/2002 05:08:00 PM

Wednesday, November 07, 2001

Making a noscript option for templates with archive links in the main page

If you like using the templates that use JavaScript to include the archive links in the main page, but you want to provide a noscript option for people using browsers that don't support JavaScript, or who have JavaScript turned off, here's how:

First, in your main template, include a <noscript> tag after the archive script tag, something like:

<script type="text/javascript" src="<$BlogArchiveFileName$>"></script>
<noscript><a href="<$BlogArchiveFileName$>">previously...</a></noscript>

Save your changes, then go back and copy the main template, and paste it in below your current archive template code. Find the <Blogger> to </Blogger> section in the template you just pasted in, and delete it. Cut the original archive template section, and paste it in where the <Blogger> to </Blogger> section was. Now, to add the comment codes that will hide the html when it is being used as JavaScript, and hide the JavaScript when it is being used as html:

<!--
/*
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title><$BlogTitle$></title>
<style type="text/css">
<!--
a:hover {
text-decoration: none
}
-->
</style>
</head>
<body bgcolor="#9C5E8A" text="#202020" link="#6C2A4B" vlink="#6C2A4B" alink="#6C2A4B">
<center>
<table border=0 cellpadding=20 cellspacing=0>
<tr>
<td align=right colspan=2 bgcolor="#F4EFF7" height=70>
<span class=title><b><$BlogTitle$></b></span>
</td>
</tr>
<tr>
<td valign=top width=300 bgcolor="#FFFFFF">
<!-- Here is where the posts go.
Please refer to the documentation on the Blogger template editing page for
information on what tags are available here and how they work -->
<!--
*/
// -->

<Blogger>
<!--
document.write("<a href='<$BlogArchiveLink$>'><$BlogArchiveName$></a><br>")
// --> <a href='<$BlogArchiveLink$>'><$BlogArchiveName$></a><br>
</Blogger>
<!--
if (location.href.indexOf("archive") != -1) {
document.write("<a href=\"./\">current</a>")
}
// --> <a href='./'>current</a>
<!--
/*
// -->

<!-- End Posts -->
</td>
<td valign=top width=200 bgcolor="#FFFFFF">
<table border=0 cellpadding=1 cellspacing=0 width="100%">
<tr>
<td bgcolor="#808080">
<table border=0 cellpadding=5 cellspacing=0 width="100%">
<tr>
<!-- Yadda, yadda, you get the point... -->
</body>
</html>
<!--
*/
// -->

posted by Phil Ringnalda at 11/07/2001 10:55:00 PM

Obligatory test post.

posted by Phil Ringnalda at 11/07/2001 10:29:00 PM