the design blog: 'Tis the Season

Because the last few I've done haven't been Diaryland and because after all, 'tis the season, here's a Diaryland Christmas design!! Just to be nice I've also made a version for Diaryland weblog-style users. If that's what you are scroll down.

How your entry pages will look

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>'tis the season</title>
<style type="text/css">
Body	{ background-image: url(http://design.lookingatstars.com/archives/ornaments.jpg);
background-position: top left;
background-color:#FFF;
background-repeat:no-repeat;
margin:5px;
	}

a:link 		{text-decoration: none; color: #396;}
a:visited   	{text-decoration: none; color: #396;}
a:active	{text-decoration: none; color: #396;}
a:hover 	{text-decoration: none; color: #396;}

#menu	{	
float:left;
width:20%;
font-size:small;
margin-top:250px;
margin-left:10px;
		}

#content {	
  float:right;
		width:70%;
 margin:10px;
 padding:20px;
		}

.title	{	
		font-family: trebuchet ms, verdana, arial, sans-serif;
	font-size: small;
	color: #903;
	font-weight:bold;
	margin-top:5px;
margin-bottom:5px;
	}

.entry	{	
		font-family: verdana, arial, sans-serif;
		font-size: x-small;
		color: #333;
		font-weight:normal;
		text-align:left;
	}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div id="content">
   <div class="title">%%date%% : %%short_description%%</div>
<div class="entry">%%entry%%</div>
<div class="title"><A HREF="%%prev%%">last christmas</A> * <A HREF="%%next%%">next christmas</A>
<br />
</div></div>
<div id="menu">
<div class="title">
<a href="/index.html">christmas present</a><br /><a href="/older.html">christmas past</a><br /><a href="http://%%username%%.signmyguestbook.com">christmas cards</a><br /><a target="_blank" href="http://design.lookingatstars.com">wrapped by</a><br /><a target="_blank" href="http://diaryland.com">hosted by</a><br />

</div></div>
    </body>
</html>

How your older.html page will look

a:link 		{text-decoration: none; color: #396;}
a:visited   	{text-decoration: none; color: #396;}
a:active	{text-decoration: none; color: #396;}
a:hover 	{text-decoration: none; color: #396;}

#menu	{	
float:left;
width:20%;
font-size:small;
margin-top:250px;
margin-left:10px;
		}

#content {	
  float:right;
		width:70%;
 margin:10px;
		}

.title	{	
		font-family: trebuchet ms, verdana, arial, sans-serif;
	font-size: small;
	color: #903;
	font-weight:bold;
	margin-top:5px;
margin-bottom:5px;
	}

.entry	{	
		font-family: verdana, arial, sans-serif;
		font-size: xx-small;
		color: #333;
		font-weight:normal;
		text-align:left;
	}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div id="content">
   <div class="title">Archives</div>
 <div class="entry">%%older_entries%%</div>
<br />
</div></div>
<div id="menu">
<div class="title">
<a href="/index.html">christmas present</a><br /><a href="/older.html">christmas past</a><br /><a href="http://%%username%%.signmyguestbook.com">christmas cards</a><br /><a target="_blank" href="http://design.lookingatstars.com">wrapped by</a><br /><a target="_blank" href="http://diaryland.com">hosted by</a><br />

</div></div>
    </body>
</html>

How each entry on your older.html page looks

So for most of you, you're done here. For those of you who have weblog style diaries, you have to change these two templates.

Use this for 'How each of your entries will look' template.

a:link 		{text-decoration: none; color: #396;}
a:visited   	{text-decoration: none; color: #396;}
a:active	{text-decoration: none; color: #396;}
a:hover 	{text-decoration: none; color: #396;}

#menu	{	
float:left;
width:20%;
font-size:small;
margin-top:250px;
margin-left:10px;
		}

#content {	
  float:right;
		width:70%;
 margin:10px;
 padding:20px;
		}

.title	{	
		font-family: trebuchet ms, verdana, arial, sans-serif;
	font-size: small;
	color: #903;
	font-weight:bold;
	margin-top:5px;
margin-bottom:5px;
	}

.entry	{	
		font-family: verdana, arial, sans-serif;
		font-size: x-small;
		color: #333;
		font-weight:normal;
		text-align:left;
	}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div id="content">
%%entries%%
<br />
</div>
<div id="menu">
<div class="title">
<a href="/index.html">christmas present</a><br /><a href="/older.html">christmas past</a><br /><a href="http://%%username%%.signmyguestbook.com">christmas cards</a><br /><a target="_blank" href="http://design.lookingatstars.com">wrapped by</a><br /><a target="_blank" href="http://diaryland.com">hosted by</a><br />

</div></div>
    </body>
</html>

This part is for to change how each of your individual entries looks if you're using the weblog-style diary (huh?)

Comments

cool layout..not sure if im gonna use it yet

Posted by: marsha marsha marshmallow | June 1, 2005 07:53 AM

Hi. Just leaving my note to say I used the design (and love it!). I altered it a bit as well (just added bullets). thanks so much.

Posted by: amy | November 1, 2004 01:39 PM

Sure, thats right!

Posted by: CumFiesta | July 10, 2004 10:03 PM

Excellent work! I modified the 'tis the season template for my blog. I hope you don't mind, and if you do, let me know. I kept the linkback intact and thank you for your help.

Posted by: hennepin | July 9, 2004 02:20 AM

Using it for my archives page. Thank you!

Posted by: Judy | December 23, 2003 07:33 PM

hey thank you for doing this cool work! i got this design for my just made blog. thanks

Posted by: meg | December 20, 2003 03:20 AM

hi! just wanted to let you know that i'm currently using this design (with a few changes). i like it because it is simple and perfect for the holidays. ^_^

Posted by: katheowyn | December 10, 2003 11:08 PM

the design blog

Freeware templates and styles for Movable Type and Diaryland blogs, diaries, journals et cetera.

'Tis the Season

TrackBack

Comments

Post a comment