Code: My First Template Attempt: the Alien Template Series
Since this base template can be used with any color, I have created the Alien Template Series!!!
Bookmark this post, it will be updated with new templates free of charge! (why would you spend money on one of these, anyway?).
The following code is for my first template (that actually worked) called the Alien Green Template because of the green background. View a fully working blog using this template here. View the code here:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title><$BlogTitle$></title>
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<style type="text/css">
.commenthidden {display:none} .commentshown {display:inline}
body{margin:0px;padding:0px;background:#33FF00;color:#111111;font-family:Lucida Grande,MS Sans Serif,Lucida Sans Unicode,Verdana,Geneva,Lucida,Arial,Helvetica,Sans-Serif;}
a:link{color:#0033FF;}
a:visited{color:#000099;}
a:active{color:#00CC00;}
a:hover{color:#CC0000; text-decoration:none;}
pre {
text-align: left;
font-size: 1.5em;
width:100%;
border:1px solid #3366FF;
overflow:scroll;
}
</style>
<$BlogMetaData$>
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
</head>
<br></br>
<br></br>
<body bgcolor="#ffffff">
<p><font size="6" face="Verdana, Arial, Helvetica, sans-serif"><$BlogTitle$></font></p>
<p><$BlogDescription$></p>
<p><font color="#000000"><a aiotitle="click to expand" href="javascript:togglecomments('tem1about')">about</a>
<div class="commenthidden" id="tem1about"><$BlogMemberProfile$></div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1links')">links</a>
<div class="commenthidden" id="tem1links"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1archives')">archives</a>
<div class="commenthidden" id="tem1archives"><BloggerArchives><li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li></BloggerArchives>
<!-- Link to the front page, from your archives -->
<script type="text/javascript">if (location.href.indexOf("archive")!=-1) document.write("<li><strong><a href=\"<$BlogURL$>\">Current Posts</a></strong></li>");</script>
</div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1blogroll')">blogroll</a>
<div class="commenthidden" id="tem1blogroll"><ul>
<li><a href=http://journalofasuburbanobserver.blogspot.com>Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1meta')">meta</a>
<div class="commenthidden" id="tem1meta"><ul>
<li><a href=http://blogger.com">Blogger Dot Com</a></li></div></font></p>
<p></p>
<!-- Begin #content -->
<div id="content">
<!-- Begin #main -->
<div id="main"><div id="main2">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$BlogItemCommentCount$> Comments:</h4>
<dl id="comments-block">
<BlogItemComments>
<dt class="comment-poster" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<p class="comment-timestamp">
<a href="<$BlogURL$>"><< Home</a>
</p>
</div>
</ItemPage>
<!-- End #comments -->
</Blogger>
</div></div>
<!-- End #main -->
<p></p>
<p></p>
<p></p>
<!-- In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page! -->
<p id="bloggerBug"><a href="http://www.blogger.com"><img width="88" height="31" src="http://buttons.blogger.com/bloggerbutton1.gif" border="0" alt="This page is powered by Blogger. Isn't yours?" /></a></p>
Alien Green Template created by <a href="http://journalofasuburbanobserver.blogspot.com">Noah Bulgaria</a>.
</body>
</html>
Changing the favicon
Find this:
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
Replace it the FAVICON IMAGE URL GOES HERE with the code for the icon. Some pix to icon converters:
chami.com
Terms:
1. Please leave "Alien Green Template created by Noah Bulgaria" or "Alien Template's created by Noah Bulgaria" on the blog's main and archive pages
2. You must keep the Blogger button on the blog.
Simple.
Here are some other examples, with different backgrounds:
Alien Orange Template
The code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title><$BlogTitle$></title>
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<style type="text/css">
.commenthidden {display:none} .commentshown {display:inline}
body{margin:0px;padding:0px;background:#FF9900;color:#111111;font-family:Lucida Grande,MS Sans Serif,Lucida Sans Unicode,Verdana,Geneva,Lucida,Arial,Helvetica,Sans-Serif;}
a:link{color:#0033FF;}
a:visited{color:#000099;}
a:active{color:#00CC00;}
a:hover{color:#CC0000; text-decoration:none;}
pre {
text-align: left;
font-size: 1.5em;
width:100%;
border:1px solid #3366FF;
overflow:scroll;
}
</style>
<$BlogMetaData$>
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
</head>
<br></br>
<br></br>
<body bgcolor="#ffffff">
<p><font size="6" face="Verdana, Arial, Helvetica, sans-serif"><$BlogTitle$></font></p>
<p><$BlogDescription$></p>
<p><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1about')">about</a>
<div class="commenthidden" id="tem1about"><$BlogMemberProfile$></div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1links')">links</a>
<div class="commenthidden" id="tem1links"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1archives')">archives</a>
<div class="commenthidden" id="tem1archives"><BloggerArchives><li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li></BloggerArchives>
<!-- Link to the front page, from your archives -->
<script type="text/javascript">if (location.href.indexOf("archive")!=-1) document.write("<li><strong><a href=\"<$BlogURL$>\">Current Posts</a></strong></li>");</script>
</div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1blogroll')">blogroll</a>
<div class="commenthidden" id="tem1blogroll"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1meta')">meta</a>
<div class="commenthidden" id="tem1meta"><ul>
<li><a href=http://blogger.com">Blogger Dot Com</a></li></div></font></p>
<p></p>
<!-- Begin #content -->
<div id="content">
<!-- Begin #main -->
<div id="main"><div id="main2">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$BlogItemCommentCount$> Comments:</h4>
<dl id="comments-block">
<BlogItemComments>
<dt class="comment-poster" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<p class="comment-timestamp">
<a href="<$BlogURL$>"><< Home</a>
</p>
</div>
</ItemPage>
<!-- End #comments -->
</Blogger>
</div></div>
<!-- End #main -->
<p></p>
<p></p>
<p></p>
<!-- In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page! -->
<p id="bloggerBug"><a href="http://www.blogger.com"><img width="88" height="31" src="http://buttons.blogger.com/bloggerbutton1.gif" border="0" alt="This page is powered by Blogger. Isn't yours?" /></a></p>
Alien Template's created by <a href="http://journalofasuburbanobserver.blogspot.com">Noah Bulgaria</a>.
</body>
</html>
Here's a new one:
Alien Purple Template
The code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title><$BlogTitle$></title>
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<style type="text/css">
.commenthidden {display:none} .commentshown {display:inline}
body{margin:0px;padding:0px;background:#FF33FF;color:#111111;font-family:Lucida Grande,MS Sans Serif,Lucida Sans Unicode,Verdana,Geneva,Lucida,Arial,Helvetica,Sans-Serif;}
a:link{color:#0033FF;}
a:visited{color:#000099;}
a:active{color:#00CC00;}
a:hover{color:#CC0000; text-decoration:none;}
pre {
text-align: left;
font-size: 1.5em;
width:100%;
border:1px solid #3366FF;
overflow:scroll;
}
</style>
<$BlogMetaData$>
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
</head>
<br></br>
<br></br>
<body bgcolor="#ffffff">
<p><font size="6" face="Verdana, Arial, Helvetica, sans-serif"><$BlogTitle$></font></p>
<p><$BlogDescription$></p>
<p><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1about')">about</a>
<div class="commenthidden" id="tem1about"><$BlogMemberProfile$></div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1links')">links</a>
<div class="commenthidden" id="tem1links"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1archives')">archives</a>
<div class="commenthidden" id="tem1archives"><BloggerArchives><li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li></BloggerArchives>
<!-- Link to the front page, from your archives -->
<script type="text/javascript">if (location.href.indexOf("archive")!=-1) document.write("<li><strong><a href=\"<$BlogURL$>\">Current Posts</a></strong></li>");</script>
</div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1blogroll')">blogroll</a>
<div class="commenthidden" id="tem1blogroll"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1meta')">meta</a>
<div class="commenthidden" id="tem1meta"><ul>
<li><a href=http://blogger.com">Blogger Dot Com</a></li></div></font></p>
<p></p>
<!-- Begin #content -->
<div id="content">
<!-- Begin #main -->
<div id="main"><div id="main2">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$BlogItemCommentCount$> Comments:</h4>
<dl id="comments-block">
<BlogItemComments>
<dt class="comment-poster" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<p class="comment-timestamp">
<a href="<$BlogURL$>"><< Home</a>
</p>
</div>
</ItemPage>
<!-- End #comments -->
</Blogger>
</div></div>
<!-- End #main -->
<p></p>
<p></p>
<p></p>
<!-- In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page! -->
<p id="bloggerBug"><a href="http://www.blogger.com"><img width="88" height="31" src="http://buttons.blogger.com/bloggerbutton1.gif" border="0" alt="This page is powered by Blogger. Isn't yours?" /></a></p>
Alien Template's created by <a href="http://journalofasuburbanobserver.blogspot.com">Noah Bulgaria</a>.
</body>
</html>
More coming soon.
If you are using this template, you could leave a comment linking to your blog.
Bookmark this post, it will be updated with new templates free of charge! (why would you spend money on one of these, anyway?).
The following code is for my first template (that actually worked) called the Alien Green Template because of the green background. View a fully working blog using this template here. View the code here:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title><$BlogTitle$></title>
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<style type="text/css">
.commenthidden {display:none} .commentshown {display:inline}
body{margin:0px;padding:0px;background:#33FF00;color:#111111;font-family:Lucida Grande,MS Sans Serif,Lucida Sans Unicode,Verdana,Geneva,Lucida,Arial,Helvetica,Sans-Serif;}
a:link{color:#0033FF;}
a:visited{color:#000099;}
a:active{color:#00CC00;}
a:hover{color:#CC0000; text-decoration:none;}
pre {
text-align: left;
font-size: 1.5em;
width:100%;
border:1px solid #3366FF;
overflow:scroll;
}
</style>
<$BlogMetaData$>
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
</head>
<br></br>
<br></br>
<body bgcolor="#ffffff">
<p><font size="6" face="Verdana, Arial, Helvetica, sans-serif"><$BlogTitle$></font></p>
<p><$BlogDescription$></p>
<p><font color="#000000"><a aiotitle="click to expand" href="javascript:togglecomments('tem1about')">about</a>
<div class="commenthidden" id="tem1about"><$BlogMemberProfile$></div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1links')">links</a>
<div class="commenthidden" id="tem1links"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1archives')">archives</a>
<div class="commenthidden" id="tem1archives"><BloggerArchives><li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li></BloggerArchives>
<!-- Link to the front page, from your archives -->
<script type="text/javascript">if (location.href.indexOf("archive")!=-1) document.write("<li><strong><a href=\"<$BlogURL$>\">Current Posts</a></strong></li>");</script>
</div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1blogroll')">blogroll</a>
<div class="commenthidden" id="tem1blogroll"><ul>
<li><a href=http://journalofasuburbanobserver.blogspot.com>Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1meta')">meta</a>
<div class="commenthidden" id="tem1meta"><ul>
<li><a href=http://blogger.com">Blogger Dot Com</a></li></div></font></p>
<p></p>
<!-- Begin #content -->
<div id="content">
<!-- Begin #main -->
<div id="main"><div id="main2">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$BlogItemCommentCount$> Comments:</h4>
<dl id="comments-block">
<BlogItemComments>
<dt class="comment-poster" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<p class="comment-timestamp">
<a href="<$BlogURL$>"><< Home</a>
</p>
</div>
</ItemPage>
<!-- End #comments -->
</Blogger>
</div></div>
<!-- End #main -->
<p></p>
<p></p>
<p></p>
<!-- In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page! -->
<p id="bloggerBug"><a href="http://www.blogger.com"><img width="88" height="31" src="http://buttons.blogger.com/bloggerbutton1.gif" border="0" alt="This page is powered by Blogger. Isn't yours?" /></a></p>
Alien Green Template created by <a href="http://journalofasuburbanobserver.blogspot.com">Noah Bulgaria</a>.
</body>
</html>
Changing the favicon
Find this:
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
Replace it the FAVICON IMAGE URL GOES HERE with the code for the icon. Some pix to icon converters:
chami.com
Terms:
1. Please leave "Alien Green Template created by Noah Bulgaria" or "Alien Template's created by Noah Bulgaria" on the blog's main and archive pages
2. You must keep the Blogger button on the blog.
Simple.
Here are some other examples, with different backgrounds:
Alien Orange Template
The code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title><$BlogTitle$></title>
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<style type="text/css">
.commenthidden {display:none} .commentshown {display:inline}
body{margin:0px;padding:0px;background:#FF9900;color:#111111;font-family:Lucida Grande,MS Sans Serif,Lucida Sans Unicode,Verdana,Geneva,Lucida,Arial,Helvetica,Sans-Serif;}
a:link{color:#0033FF;}
a:visited{color:#000099;}
a:active{color:#00CC00;}
a:hover{color:#CC0000; text-decoration:none;}
pre {
text-align: left;
font-size: 1.5em;
width:100%;
border:1px solid #3366FF;
overflow:scroll;
}
</style>
<$BlogMetaData$>
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
</head>
<br></br>
<br></br>
<body bgcolor="#ffffff">
<p><font size="6" face="Verdana, Arial, Helvetica, sans-serif"><$BlogTitle$></font></p>
<p><$BlogDescription$></p>
<p><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1about')">about</a>
<div class="commenthidden" id="tem1about"><$BlogMemberProfile$></div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1links')">links</a>
<div class="commenthidden" id="tem1links"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1archives')">archives</a>
<div class="commenthidden" id="tem1archives"><BloggerArchives><li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li></BloggerArchives>
<!-- Link to the front page, from your archives -->
<script type="text/javascript">if (location.href.indexOf("archive")!=-1) document.write("<li><strong><a href=\"<$BlogURL$>\">Current Posts</a></strong></li>");</script>
</div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1blogroll')">blogroll</a>
<div class="commenthidden" id="tem1blogroll"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1meta')">meta</a>
<div class="commenthidden" id="tem1meta"><ul>
<li><a href=http://blogger.com">Blogger Dot Com</a></li></div></font></p>
<p></p>
<!-- Begin #content -->
<div id="content">
<!-- Begin #main -->
<div id="main"><div id="main2">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$BlogItemCommentCount$> Comments:</h4>
<dl id="comments-block">
<BlogItemComments>
<dt class="comment-poster" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<p class="comment-timestamp">
<a href="<$BlogURL$>"><< Home</a>
</p>
</div>
</ItemPage>
<!-- End #comments -->
</Blogger>
</div></div>
<!-- End #main -->
<p></p>
<p></p>
<p></p>
<!-- In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page! -->
<p id="bloggerBug"><a href="http://www.blogger.com"><img width="88" height="31" src="http://buttons.blogger.com/bloggerbutton1.gif" border="0" alt="This page is powered by Blogger. Isn't yours?" /></a></p>
Alien Template's created by <a href="http://journalofasuburbanobserver.blogspot.com">Noah Bulgaria</a>.
</body>
</html>
Here's a new one:
Alien Purple Template
The code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title><$BlogTitle$></title>
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<style type="text/css">
.commenthidden {display:none} .commentshown {display:inline}
body{margin:0px;padding:0px;background:#FF33FF;color:#111111;font-family:Lucida Grande,MS Sans Serif,Lucida Sans Unicode,Verdana,Geneva,Lucida,Arial,Helvetica,Sans-Serif;}
a:link{color:#0033FF;}
a:visited{color:#000099;}
a:active{color:#00CC00;}
a:hover{color:#CC0000; text-decoration:none;}
pre {
text-align: left;
font-size: 1.5em;
width:100%;
border:1px solid #3366FF;
overflow:scroll;
}
</style>
<$BlogMetaData$>
<link rel="shortcut icon" href="FAVICON IMAGE URL GOES HERE" type="image/x-icon" />
</head>
<br></br>
<br></br>
<body bgcolor="#ffffff">
<p><font size="6" face="Verdana, Arial, Helvetica, sans-serif"><$BlogTitle$></font></p>
<p><$BlogDescription$></p>
<p><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1about')">about</a>
<div class="commenthidden" id="tem1about"><$BlogMemberProfile$></div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1links')">links</a>
<div class="commenthidden" id="tem1links"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1archives')">archives</a>
<div class="commenthidden" id="tem1archives"><BloggerArchives><li><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></li></BloggerArchives>
<!-- Link to the front page, from your archives -->
<script type="text/javascript">if (location.href.indexOf("archive")!=-1) document.write("<li><strong><a href=\"<$BlogURL$>\">Current Posts</a></strong></li>");</script>
</div></font><font color="#a0a0a0"><a aiotitle="click to expand" href="javascript:togglecomments('tem1blogroll')">blogroll</a>
<div class="commenthidden" id="tem1blogroll"><ul>
<li><a href="http://journalofasuburbanobserver.blogspot.com">Journal of a Suburban Observer</a></li>
<li><a href="EDIT-ME!">EDIT-ME!</a></li>
</ul></div></font><font color="#d1d1d1"><a aiotitle="click to expand" href="javascript:togglecomments('tem1meta')">meta</a>
<div class="commenthidden" id="tem1meta"><ul>
<li><a href=http://blogger.com">Blogger Dot Com</a></li></div></font></p>
<p></p>
<!-- Begin #content -->
<div id="content">
<!-- Begin #main -->
<div id="main"><div id="main2">
<Blogger>
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
<!-- Begin .post -->
<div class="post"><a name="<$BlogItemNumber$>"></a>
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
<div class="post-body">
<div>
<$BlogItemBody$>
</div>
</div>
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
</div>
<!-- End .post -->
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$BlogItemCommentCount$> Comments:</h4>
<dl id="comments-block">
<BlogItemComments>
<dt class="comment-poster" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="#<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>
<p class="comment-timestamp">
<a href="<$BlogURL$>"><< Home</a>
</p>
</div>
</ItemPage>
<!-- End #comments -->
</Blogger>
</div></div>
<!-- End #main -->
<p></p>
<p></p>
<p></p>
<!-- In accordance to the Blogger terms of service, please leave this button somewhere on your blogger-powered page! -->
<p id="bloggerBug"><a href="http://www.blogger.com"><img width="88" height="31" src="http://buttons.blogger.com/bloggerbutton1.gif" border="0" alt="This page is powered by Blogger. Isn't yours?" /></a></p>
Alien Template's created by <a href="http://journalofasuburbanobserver.blogspot.com">Noah Bulgaria</a>.
</body>
</html>
More coming soon.
If you are using this template, you could leave a comment linking to your blog.
posted by The Prophecy at
11:50 AM
0 Comments:
Post a Comment
Subscribe to Post Comments [Atom]
<< Home