profile
Name: klenwell
Home: San Diego, California, United States
About Me: designer, programmer, wordsmith
Sunday, June 17, 2007
beta template released
This is the updated version of the basic bloggerstack template. It is the template upon which the blog for this skin is based. You can find it in the repository here:
beta template
beta template
Saturday, July 08, 2006
New Template Object Model
Aptly termed TOM, the new Template Object Model tries to organize still more neatly the various parts of the Blogger Template. Panels hold stacks which hold blocks which hold block elements. A rough schematic:
Part-by-part analysis to follow.
* Template
* Head Stack
* Blogger Stack
o Entry Stack
+ Entry Block
o Endnote Stack
+ Comment Block
+ Linkback Block
* Profile Stack
* Masthead Panel
* Footer Panel
Part-by-part analysis to follow.
Sunday, March 05, 2006
blogger item container
my revision of the Blogger post array -- css-delineated and commented
keywords: blogger, post array, item container, template
<!-- BLOGGER ITEM CONTAINER -->
<div id="blogger_item_container">
<Blogger>
<!-- BLOGGER ITEM BLOCK -->
<div class="blogger_item_block">
<!-- BLOGGER ITEM TEMPLATE -->
<div class="blogger_item">
<!-- date header -->
<BlogDateHeader>
<div class="date_header"><$BlogDateHeaderDate$></div>
</BlogDateHeader>
<!-- end date header -->
<!-- ITEM title -->
<a name="<$BlogItemNumber$>"> </a>
<BlogItemTitle><div class="item_title">
<BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL><$BlogItemTitle$></a>
</div></BlogItemTitle>
<!-- end ITEM title -->
<!-- ITEM body -->
<div class="item_body">
<$BlogItemBody$>
</div>
<!-- end ITEM body -->
<!-- ITEM footer -->
<div class="item_footer">
» <a href="<$BlogItemPermalinkURL$>" title="permanent link"><$BlogItemDateTime$></a>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled></MainOrArchivePage>
</div>
<!-- end ITEM footer -->
</div>
<!-- end BLOGGER ITEM TEMPLATE -->
<!-- ITEM PAGE BLOCK (displayed only on post's item page) -->
<div id="item_page_block">
<ItemPage>
<!-- ITEM COMMENT CONTAINER -->
<div class="item_comment_container">
<BlogItemCommentsEnabled>
<a name="comments"></a>
<h4>comments:</h4>
<!-- ITEM COMMENT -->
<BlogItemComments>
<div class="item_comment">
<a name="<$BlogCommentNumber$>"></a>
<!-- item comment body -->
<div class="item_comment_body">
<$BlogCommentBody$>
</div>
<!-- end item comment body -->
<!-- item comment footer -->
<div class="item_comment_footer">
<a href="<$BlogCommentPermalinkURL$>" title="comment permanent link">·</a>
posted by <$BlogCommentAuthor$> : <$BlogCommentDateTime$> <$BlogCommentDeleteIcon$>
</div>
<!-- end item comment footer -->
</div>
</BlogItemComments>
<!-- end ITEM COMMENT -->
<!-- javascript token? -->
<$BlogItemCreate$>
</BlogItemCommentsEnabled>
</div>
<!-- end ITEM COMMENT CONTAINER -->
<!-- ITEM BACKLINK BLOCK -->
<BlogItemBacklinksEnabled>
<a name="links"></a>
<h4>links to this post:</h4>
<!-- ITEM BACKLINK CONTAINER -->
<div id="item_backlink_container">
<BlogItemBacklinks>
<!-- backlink title -->
<div class="backlink_title">
<$BlogBacklinkControl$> <a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</div>
<!-- backlink title -->
<!-- backlink snippet -->
<div class="backlink_snippet">
<$BlogBacklinkSnippet$>
</div>
<!-- end backlink snippet -->
<!-- backlink footer -->
<div class="backlink_footer">
posted by <$BlogBacklinkAuthor$> at <$BlogBacklinkDateTime$>
</div>
<!-- end backlink footer -->
</BlogItemBacklinks>
</div>
<!-- end ITEM BACKLINK CONTAINER -->
<!-- backlink timestamp -->
<div class="backlink_timestamp">
<$BlogItemBacklinkCreate$>
</div>
<!-- end backlink timestamp -->
</BlogItemBacklinksEnabled>
<!-- end ITEM BACKLINK BLOCK -->
<!-- ITEM PAGE HOME LINK -->
<div id="item_return_home_link">
<a href="<$BlogURL$>">« home</a>
</div>
<!-- end ITEM PAGE HOME LINK -->
</ItemPage>
</div>
<!-- end ITEM PAGE BLOCK -->
</div>
<!-- end BLOGGER ITEM BLOCK -->
</Blogger>
</div>
<!-- end BLOGGER ITEM CONTAINER -->
<div id="blogger_item_container">
<Blogger>
<!-- BLOGGER ITEM BLOCK -->
<div class="blogger_item_block">
<!-- BLOGGER ITEM TEMPLATE -->
<div class="blogger_item">
<!-- date header -->
<BlogDateHeader>
<div class="date_header"><$BlogDateHeaderDate$></div>
</BlogDateHeader>
<!-- end date header -->
<!-- ITEM title -->
<a name="<$BlogItemNumber$>"> </a>
<BlogItemTitle><div class="item_title">
<BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL><$BlogItemTitle$></a>
</div></BlogItemTitle>
<!-- end ITEM title -->
<!-- ITEM body -->
<div class="item_body">
<$BlogItemBody$>
</div>
<!-- end ITEM body -->
<!-- ITEM footer -->
<div class="item_footer">
» <a href="<$BlogItemPermalinkURL$>" title="permanent link"><$BlogItemDateTime$></a>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled></MainOrArchivePage>
</div>
<!-- end ITEM footer -->
</div>
<!-- end BLOGGER ITEM TEMPLATE -->
<!-- ITEM PAGE BLOCK (displayed only on post's item page) -->
<div id="item_page_block">
<ItemPage>
<!-- ITEM COMMENT CONTAINER -->
<div class="item_comment_container">
<BlogItemCommentsEnabled>
<a name="comments"></a>
<h4>comments:</h4>
<!-- ITEM COMMENT -->
<BlogItemComments>
<div class="item_comment">
<a name="<$BlogCommentNumber$>"></a>
<!-- item comment body -->
<div class="item_comment_body">
<$BlogCommentBody$>
</div>
<!-- end item comment body -->
<!-- item comment footer -->
<div class="item_comment_footer">
<a href="<$BlogCommentPermalinkURL$>" title="comment permanent link">·</a>
posted by <$BlogCommentAuthor$> : <$BlogCommentDateTime$> <$BlogCommentDeleteIcon$>
</div>
<!-- end item comment footer -->
</div>
</BlogItemComments>
<!-- end ITEM COMMENT -->
<!-- javascript token? -->
<$BlogItemCreate$>
</BlogItemCommentsEnabled>
</div>
<!-- end ITEM COMMENT CONTAINER -->
<!-- ITEM BACKLINK BLOCK -->
<BlogItemBacklinksEnabled>
<a name="links"></a>
<h4>links to this post:</h4>
<!-- ITEM BACKLINK CONTAINER -->
<div id="item_backlink_container">
<BlogItemBacklinks>
<!-- backlink title -->
<div class="backlink_title">
<$BlogBacklinkControl$> <a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</div>
<!-- backlink title -->
<!-- backlink snippet -->
<div class="backlink_snippet">
<$BlogBacklinkSnippet$>
</div>
<!-- end backlink snippet -->
<!-- backlink footer -->
<div class="backlink_footer">
posted by <$BlogBacklinkAuthor$> at <$BlogBacklinkDateTime$>
</div>
<!-- end backlink footer -->
</BlogItemBacklinks>
</div>
<!-- end ITEM BACKLINK CONTAINER -->
<!-- backlink timestamp -->
<div class="backlink_timestamp">
<$BlogItemBacklinkCreate$>
</div>
<!-- end backlink timestamp -->
</BlogItemBacklinksEnabled>
<!-- end ITEM BACKLINK BLOCK -->
<!-- ITEM PAGE HOME LINK -->
<div id="item_return_home_link">
<a href="<$BlogURL$>">« home</a>
</div>
<!-- end ITEM PAGE HOME LINK -->
</ItemPage>
</div>
<!-- end ITEM PAGE BLOCK -->
</div>
<!-- end BLOGGER ITEM BLOCK -->
</Blogger>
</div>
<!-- end BLOGGER ITEM CONTAINER -->
keywords: blogger, post array, item container, template
Saturday, March 03, 2007
bloggerstack revived
Now that the Blogger re-beta-tization has settled down and the old Blogger templating system (the "Classic" template) will survive, I've cleaned up the bloggerstack project page and updated the template and stacks.
I've tried to keep the design here simple and functional. It is available in the bloggerstack SVN repository and offers a good foundation from which to expand.
I've tried to keep the design here simple and functional. It is available in the bloggerstack SVN repository and offers a good foundation from which to expand.
Sunday, August 27, 2006
Template Object: updated blogger stack
This updates the previous template by reorganizing the endnote stack into a comment stack and backlink stack and correcting a couple typos. The latest updated templates are always available in the googlecode repository.
Parent Object: none
Child Objects: all
Parent Object: none
Child Objects: all
<$HEAD_STACK$>
<body>
<div id="page">
<$MASTHEAD_STACK$>
<$SIDEBAR_STACK$>
<$BLOGGER_STACK$>
ᆫ <$ENTRY_STACK$>
ᆫ <$ENDNOTE_STACK$>
ᆫ <$COMMENT_STACK$>
ᆫ <$BACKLINK_STACK$>
<$FOOTER_STACK$>
</div>
</body>
</html>
<body>
<div id="page">
<$MASTHEAD_STACK$>
<$SIDEBAR_STACK$>
<$BLOGGER_STACK$>
ᆫ <$ENTRY_STACK$>
ᆫ <$ENDNOTE_STACK$>
ᆫ <$COMMENT_STACK$>
ᆫ <$BACKLINK_STACK$>
<$FOOTER_STACK$>
</div>
</body>
</html>
Thursday, July 27, 2006
Blank Master Style Sheet
This is a blank version master style sheet for use with the Blogger Stack template. I'll create one shortly with what I consider the minimal preliminary settings.
/** Documentation **/
/*______________________________________________________________________________
Blogger Stack Basic Stylesheet
Last Update: Jul 2006
Author: Tom Atwell (klenwell@gmail.com)
a basic style sheet for blogger that provides a simple, clean, vanilla layout
as the basis for more customized skins. for use with the blogger stack template.
for more information, see:
http://bloggerstack.blogspot.com/
______________________________________________________________________________*/
/* BASIC LAYOUT */
/*____________________________________________________________________________*/
html
{
/* height:100% */ /* for page centering, uncomment (see http://www.quirksmode.org/css/centering.html) */
margin:0; padding:0;
}
body
{
/* height:100% */ /* for page centering, uncomment */
margin:0;
padding:0;
font:1em/1.2em Arial, Helvetica, sans-serif;
color:#ccc;
background-color:#ccc;
}
#page
{
width:98%;
margin:40px auto 0;
padding:4px;
background-color:#fff;
}
/* Links */
a
{
color:#ffa500;
text-decoration:underline;
}
a:hover
{
color:#0f0;
text-decoration:none;
}
/*____________________________________________________________________________*/
/* DEFAULT HTML TAGS */
/* credit: http://kurafire.net/lab/initial.css?v21 */
/*____________________________________________________________________________*/
h1, h2, h3, h4, h5, h6 { margin:0 0 .5em; padding:0; }
p, pre, blockquote, ul, ol, dl, address { margin: 1em 0; padding: 0; }
ul li { list-style:none; margin-left:.5em; }
form, fieldset { margin: 0; padding: 0; }
dd, blockquote { margin-left: .5em; }
form label { cursor: pointer; }
fieldset { border: none; }
input, select, textarea { font-size: 100%; }
table { border-collapse:collapse; }
td { vertical-align:top; }
/*____________________________________________________________________________*/
/* SECTIONS */
/*____________________________________________________________________________*/
/* MASTHEAD STACK */
#masthead_stack
{
margin:4px 0;
padding:4px;
}
#metabar_block {}
#masthead_block {}
#masthead_block h1 {}
#masthead_block p {}
/* SIDEBAR STACK */
#sidebar_stack
{
float:right;
width:20%;
margin:0 10px 40px;
padding:4px;
font-size:.9em;
background:#fff;
border-left:1px solid #ccc;
}
.sidebar_block
{
margin-bottom:20px;
}
#sidebar_stack h2 {}
#sidebar_stack h3
{
margin-bottom:6px;
}
#sidebar_stack p
{
margin:0 0 4px;
}
#sidebar_stack a {}
#sidebar_stack a:hover {}
#archive_block {}
#recent_post_block {}
#sidebar_stack #link_block {}
/* PROFILE BLOCK */
#profile_block
{
margin-bottom:20px;
}
#profile_block p {}
#profile_block .profile_label {}
#profile_photo { display:none; }
#profile_full_name {}
#profile_location {}
#profile_about { display:none; }
/* BLOGGER STACK */
#blogger_stack {}
/* ENTRY STACK */
#entry_stack
{
padding:4px;
}
#entry_stack_foreword {}
#entry_stack_afterword {}
/* ENTRY BLOCK */
.entry_block
{
margin-bottom:10px;
padding:8px;
}
.entry_date_header
{
margin:5px 0;
font-size:.8em;
font-weight:bold;
text-transform:uppercase;
letter-spacing:.3em;
}
.entry_title
{
font-size:1.6em;
margin:4px 0 2px;
}
.entry_body {}
.entry_footer
{
margin:4px 0 0px;
padding:4px;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
background-color:#ececec;
}
.entry_footer .permalink {}
.entry_footer .comment_trigger {}
.entry_footer .backlink_link {}
/* ENDNOTE STACK */
#endnote_stack
{}
#endnote_stack_header {}
#endnote_stack_footer {}
#endnote_home_link
{
margin:1em;
}
/* COMMENT BLOCK */
.comment_block
{
margin-bottom:8px;
padding:4px;
font-size:.9em;
}
.comment_body {}
.comment_footer
{
margin:4px 0 0px;
padding:4px;
font-weight:bold;
background-color:#ececec;
}
.comment_footer .author {}
/* BACKLINK BLOCK */
.backlink_block
{
margin-bottom:8px;
padding:4px;
font-size:.9em;
}
.backlink_title
{
margin:0 0 4px;
font-size:1.4em;
}
.backlink_body {}
.backlink_footer
{
margin:4px 0 0px;
padding:4px;
font-weight:bold;
background-color:#ececec;
}
.backlink_footer .backlink_author {}
.backlink_footer .backlink_datetime {}
.backlink_footer .backlink_trigger {}
/* FOOTER STACK */
#footer_stack { clear:both; text-align:center; }
#footer_left { float:left; }
#footer_right { float:right; }
#page_analytics { visibility:hidden; }
/*____________________________________________________________________________*/
/* ETC */
/*____________________________________________________________________________*/
/* CITATION STYLE */
.quote, quote, q, blockquote
{
margin:3px 6px;
padding:8px;
background:#fcfcfc;
border:solid thin #f6f6f6;
font: bold "MS Trebuchet",arial,sans-serif;
color:#c06000;
}
.code
{
margin-bottom:0px;
padding:1em;
font-size:.9em;
font-family:"Lucida Console",Monaco,monospace;
font-weight:normal;
line-height:1.5em;
color:green;
background:#eee;
border: 1px solid #ccc;
white-space: pre-wrap; /* CSS2.1 compliant */
white-space: -moz-pre-wrap; /* Mozilla-based browsers */
white-space: -o-pre-wrap; /* Opera 7+ */
}
.ipod
{
margin-bottom:0px;
padding:1em; line-height:1.5em;
background:#d2e2f2; color:#3c4782;
font-family:"Lucida Console",Monaco,monospace;
font-weight:normal; font-size:11px;
border:1px solid #3c4782;
white-space: pre-wrap; /* CSS2.1 compliant */
white-space: -moz-pre-wrap; /* Mozilla-based browsers */
white-space: -o-pre-wrap; /* Opera 7+ */
}
.schematic
{
margin-bottom:0px;
padding:1em;
font-size:.9em;
font-family:"Lucida Console",Monaco,monospace;
font-weight:normal;
line-height:1.5em;
color:#999;
background:#f0f0f0;
border: 1px solid #999;
white-space: pre-wrap; /* CSS2.1 compliant */
white-space: -moz-pre-wrap; /* Mozilla-based browsers */
white-space: -o-pre-wrap; /* Opera 7+ */
}
.schematic a { color:#666; text-decoration:none; }
.schematic a:hover { color:blue; text-decoration:none; }
.email
{
width:80%;
margin:2px auto;
padding:8px;
border:thin outset #c06000;
color:#333;
font-size:11px;
font-family:"Lucida Console",Monaco,monospace;
background-color:#fffcfc;
}
/*____________________________________________________________________________*/
/** Documentation **/
/*______________________________________________________________________________
Blogger Stack Basic Stylesheet
Last Update: Jul 2006
Author: Tom Atwell (klenwell@gmail.com)
a basic style sheet for blogger that provides a simple, clean, vanilla layout
as the basis for more customized skins. for use with the blogger stack template.
for more information, see:
http://bloggerstack.blogspot.com/
______________________________________________________________________________*/
/* BASIC LAYOUT */
/*____________________________________________________________________________*/
html
{
/* height:100% */ /* for page centering, uncomment (see http://www.quirksmode.org/css/centering.html) */
margin:0; padding:0;
}
body
{
/* height:100% */ /* for page centering, uncomment */
margin:0;
padding:0;
font:1em/1.2em Arial, Helvetica, sans-serif;
color:#ccc;
background-color:#ccc;
}
#page
{
width:98%;
margin:40px auto 0;
padding:4px;
background-color:#fff;
}
/* Links */
a
{
color:#ffa500;
text-decoration:underline;
}
a:hover
{
color:#0f0;
text-decoration:none;
}
/*____________________________________________________________________________*/
/* DEFAULT HTML TAGS */
/* credit: http://kurafire.net/lab/initial.css?v21 */
/*____________________________________________________________________________*/
h1, h2, h3, h4, h5, h6 { margin:0 0 .5em; padding:0; }
p, pre, blockquote, ul, ol, dl, address { margin: 1em 0; padding: 0; }
ul li { list-style:none; margin-left:.5em; }
form, fieldset { margin: 0; padding: 0; }
dd, blockquote { margin-left: .5em; }
form label { cursor: pointer; }
fieldset { border: none; }
input, select, textarea { font-size: 100%; }
table { border-collapse:collapse; }
td { vertical-align:top; }
/*____________________________________________________________________________*/
/* SECTIONS */
/*____________________________________________________________________________*/
/* MASTHEAD STACK */
#masthead_stack
{
margin:4px 0;
padding:4px;
}
#metabar_block {}
#masthead_block {}
#masthead_block h1 {}
#masthead_block p {}
/* SIDEBAR STACK */
#sidebar_stack
{
float:right;
width:20%;
margin:0 10px 40px;
padding:4px;
font-size:.9em;
background:#fff;
border-left:1px solid #ccc;
}
.sidebar_block
{
margin-bottom:20px;
}
#sidebar_stack h2 {}
#sidebar_stack h3
{
margin-bottom:6px;
}
#sidebar_stack p
{
margin:0 0 4px;
}
#sidebar_stack a {}
#sidebar_stack a:hover {}
#archive_block {}
#recent_post_block {}
#sidebar_stack #link_block {}
/* PROFILE BLOCK */
#profile_block
{
margin-bottom:20px;
}
#profile_block p {}
#profile_block .profile_label {}
#profile_photo { display:none; }
#profile_full_name {}
#profile_location {}
#profile_about { display:none; }
/* BLOGGER STACK */
#blogger_stack {}
/* ENTRY STACK */
#entry_stack
{
padding:4px;
}
#entry_stack_foreword {}
#entry_stack_afterword {}
/* ENTRY BLOCK */
.entry_block
{
margin-bottom:10px;
padding:8px;
}
.entry_date_header
{
margin:5px 0;
font-size:.8em;
font-weight:bold;
text-transform:uppercase;
letter-spacing:.3em;
}
.entry_title
{
font-size:1.6em;
margin:4px 0 2px;
}
.entry_body {}
.entry_footer
{
margin:4px 0 0px;
padding:4px;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
background-color:#ececec;
}
.entry_footer .permalink {}
.entry_footer .comment_trigger {}
.entry_footer .backlink_link {}
/* ENDNOTE STACK */
#endnote_stack
{}
#endnote_stack_header {}
#endnote_stack_footer {}
#endnote_home_link
{
margin:1em;
}
/* COMMENT BLOCK */
.comment_block
{
margin-bottom:8px;
padding:4px;
font-size:.9em;
}
.comment_body {}
.comment_footer
{
margin:4px 0 0px;
padding:4px;
font-weight:bold;
background-color:#ececec;
}
.comment_footer .author {}
/* BACKLINK BLOCK */
.backlink_block
{
margin-bottom:8px;
padding:4px;
font-size:.9em;
}
.backlink_title
{
margin:0 0 4px;
font-size:1.4em;
}
.backlink_body {}
.backlink_footer
{
margin:4px 0 0px;
padding:4px;
font-weight:bold;
background-color:#ececec;
}
.backlink_footer .backlink_author {}
.backlink_footer .backlink_datetime {}
.backlink_footer .backlink_trigger {}
/* FOOTER STACK */
#footer_stack { clear:both; text-align:center; }
#footer_left { float:left; }
#footer_right { float:right; }
#page_analytics { visibility:hidden; }
/*____________________________________________________________________________*/
/* ETC */
/*____________________________________________________________________________*/
/* CITATION STYLE */
.quote, quote, q, blockquote
{
margin:3px 6px;
padding:8px;
background:#fcfcfc;
border:solid thin #f6f6f6;
font: bold "MS Trebuchet",arial,sans-serif;
color:#c06000;
}
.code
{
margin-bottom:0px;
padding:1em;
font-size:.9em;
font-family:"Lucida Console",Monaco,monospace;
font-weight:normal;
line-height:1.5em;
color:green;
background:#eee;
border: 1px solid #ccc;
white-space: pre-wrap; /* CSS2.1 compliant */
white-space: -moz-pre-wrap; /* Mozilla-based browsers */
white-space: -o-pre-wrap; /* Opera 7+ */
}
.ipod
{
margin-bottom:0px;
padding:1em; line-height:1.5em;
background:#d2e2f2; color:#3c4782;
font-family:"Lucida Console",Monaco,monospace;
font-weight:normal; font-size:11px;
border:1px solid #3c4782;
white-space: pre-wrap; /* CSS2.1 compliant */
white-space: -moz-pre-wrap; /* Mozilla-based browsers */
white-space: -o-pre-wrap; /* Opera 7+ */
}
.schematic
{
margin-bottom:0px;
padding:1em;
font-size:.9em;
font-family:"Lucida Console",Monaco,monospace;
font-weight:normal;
line-height:1.5em;
color:#999;
background:#f0f0f0;
border: 1px solid #999;
white-space: pre-wrap; /* CSS2.1 compliant */
white-space: -moz-pre-wrap; /* Mozilla-based browsers */
white-space: -o-pre-wrap; /* Opera 7+ */
}
.schematic a { color:#666; text-decoration:none; }
.schematic a:hover { color:blue; text-decoration:none; }
{
width:80%;
margin:2px auto;
padding:8px;
border:thin outset #c06000;
color:#333;
font-size:11px;
font-family:"Lucida Console",Monaco,monospace;
background-color:#fffcfc;
}
/*____________________________________________________________________________*/
Monday, July 31, 2006
Template Object: Blogger Template
Parent Object: none
Child Objects: all
Child Objects: all
<$HEAD_STACK$>
<body>
<div id="page">
<$MASTHEAD_STACK$>
<$SIDEBAR_STACK$>
<$BLOGGER_STACK$>
ᆫ <$ENTRY_STACK$>
ᆫ <$ENDNOTE_STACK$>
<$FOOTER_STACK$>
</div>
</body>
</html>
<body>
<div id="page">
<$MASTHEAD_STACK$>
<$SIDEBAR_STACK$>
<$BLOGGER_STACK$>
ᆫ <$ENTRY_STACK$>
ᆫ <$ENDNOTE_STACK$>
<$FOOTER_STACK$>
</div>
</body>
</html>
Tuesday, July 18, 2006
Template Object: Head Stack
Parent Object: <$BLOGGER_TEMPLATE$>
Child Objects: n/a
Schematic
HTML
References
Template Tags Defined (blogger.com)
Child Objects: n/a
Schematic
<$DOCTYPE$>
<$META_DATA$>
<$LINKS$>
<$LOCAL_JS$>
<$LOCAL_CSS$>
<$META_DATA$>
<$LINKS$>
<$LOCAL_JS$>
<$LOCAL_CSS$>
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- BLOGGER HEAD STACK-->
<head>
<!-- META-DATA -->
<title><$BlogPageTitle$></title>
<meta name="description" content="a blogger blogspot blog" />
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript, Blogger, Skins" />
<!-- AUTO META-TAGS -->
<$BlogMetaData$>
<!-- PAGE ICON (for more info, see http://en.wikipedia.org/wiki/Favicon) -->
<link rel="icon" href="HREF_URL" type="image/x-icon" />
<link rel="shortcut icon" href="HREF_URL" type="image/x-icon" />
<link rel="icon" type="image/FORMAT" href="HREF_URL" />
<!-- EXTERNAL LINKS -->
<!-- LOCAL JAVASCRIPT -->
<script type="text/javascript">
</script>
<!-- end LOCAL JAVASCRIPT -->
<!-- INTERNAL STYLE SHEET -->
<style type="text/css">
</style>
<!-- end INTERNAL STYLE SHEET -->
</head>
<!-- BLOGGER HEAD STACK end -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- BLOGGER HEAD STACK-->
<head>
<!-- META-DATA -->
<title><$BlogPageTitle$></title>
<meta name="description" content="a blogger blogspot blog" />
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript, Blogger, Skins" />
<!-- AUTO META-TAGS -->
<$BlogMetaData$>
<!-- PAGE ICON (for more info, see http://en.wikipedia.org/wiki/Favicon) -->
<link rel="icon" href="HREF_URL" type="image/x-icon" />
<link rel="shortcut icon" href="HREF_URL" type="image/x-icon" />
<link rel="icon" type="image/FORMAT" href="HREF_URL" />
<!-- EXTERNAL LINKS -->
<!-- LOCAL JAVASCRIPT -->
<script type="text/javascript">
</script>
<!-- end LOCAL JAVASCRIPT -->
<!-- INTERNAL STYLE SHEET -->
<style type="text/css">
</style>
<!-- end INTERNAL STYLE SHEET -->
</head>
<!-- BLOGGER HEAD STACK end -->
References
Template Tags Defined (blogger.com)
Monday, July 17, 2006
Template Object: Entry Stack
Parent Object: blogger_stack
Child Objects: entry_block
Schematic
Stylesheet
HTML
References
Blogger Template Walkthrough (blogger.com)
Child Objects: entry_block
Schematic
<!-- ENTRY STACK: #entry_stack -->
<div id="entry_stack">
<!-- Entry Stack Foreword -->
<div id="entry_stack_foreword">
</div>
<!-- Entry Block -->
<$entry_block$>
<!-- Entry Stack Afterword -->
<div id="entry_stack_afterword">
</div>
</div>
<!-- ENTRY STACK end -->
<div id="entry_stack">
<!-- Entry Stack Foreword -->
<div id="entry_stack_foreword">
</div>
<!-- Entry Block -->
<$entry_block$>
<!-- Entry Stack Afterword -->
<div id="entry_stack_afterword">
</div>
</div>
<!-- ENTRY STACK end -->
Stylesheet
/* ENTRY STACK */
#entry_stack {}
#entry_stack_foreword {}
#entry_stack_afterword {}
#entry_stack {}
#entry_stack_foreword {}
#entry_stack_afterword {}
HTML
<!-- ENTRY STACK: #entry_stack -->
<div id="entry_stack">
<!-- Entry Stack Foreword -->
<div id="entry_stack_foreword">
</div>
<!-- Entry Block -->
<!-- Entry Stack Afterword -->
<div id="entry_stack_afterword">
</div>
</div>
<!-- ENTRY STACK end -->
<div id="entry_stack">
<!-- Entry Stack Foreword -->
<div id="entry_stack_foreword">
</div>
<!-- Entry Block -->
<!-- Entry Stack Afterword -->
<div id="entry_stack_afterword">
</div>
</div>
<!-- ENTRY STACK end -->
References
Blogger Template Walkthrough (blogger.com)
Wednesday, July 12, 2006
Template Object: Blogger Stack
Parent Object: core_panel
Child Objects: entry_stack, endnote_stack
Schematic
Stylesheet
HTML
References
Template Tag List (blogger.com)
Child Objects: entry_stack, endnote_stack
Schematic
<!-- BLOGGER STACK: #blogger_stack -->
<!-- NOTE: Anything between Blogger tags will be repeated for every post on page -->
<div id="blogger_stack">
<Blogger>
<$entry_stack$>
<$endnote_stack$>
</Blogger>
</div>
<!-- BLOGGER STACK end -->
<!-- NOTE: Anything between Blogger tags will be repeated for every post on page -->
<div id="blogger_stack">
<Blogger>
<$entry_stack$>
<$endnote_stack$>
</Blogger>
</div>
<!-- BLOGGER STACK end -->
Stylesheet
/* BLOGGER STACK */
#blogger_stack {}
#blogger_stack {}
HTML
<!-- BLOGGER STACK: #blogger_stack -->
<!-- NOTE: Anything between Blogger tags will be repeated for every post on page -->
<div id="blogger_stack">
<Blogger>
<!-- Entry Stack -->
<!-- Endnote Stack -->
</Blogger>
</div>
<!-- BLOGGER STACK end -->
<!-- NOTE: Anything between Blogger tags will be repeated for every post on page -->
<div id="blogger_stack">
<Blogger>
<!-- Entry Stack -->
<!-- Endnote Stack -->
</Blogger>
</div>
<!-- BLOGGER STACK end -->
References
Template Tag List (blogger.com)
Sunday, July 09, 2006
Template Object: Entry Block
Stylesheet
Stylesheet for This Blog
HTML
<!-- ENTRY BLOCK begin : .entry_block -->
<!-- Entry Date -->
<BlogDateHeader>
<div class="entry_date_header"><$BlogDateHeaderDate$></div>
</BlogDateHeader>
<!-- Entry Block -->
<div id="<$BlogItemNumber$>" class="entry_block">
<!-- Entry Title -->
<BlogItemTitle><div class="entry_title">
<BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL>
<$BlogItemTitle$></a>
</div></BlogItemTitle>
<!-- Entry Body -->
<div class="entry_body">
<$BlogItemBody$>
</div>
<!-- Entry Footer -->
<div class="entry_footer">
<!-- Permalink -->
» <a class="permalink" href="<$BlogItemPermalinkURL$>" title="permalink"> <$BlogItemDateTime$></a>
<!-- Comment Trigger -->
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment_trigger" href="<$BlogItemCommentCreate$>"
<$BlogItemCommentFormOnClick$>>
<$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled></MainOrArchivePage>
<!-- Link to Backlinks -->
<MainOrArchivePage><BlogItemBacklinksEnabled>
<a class="backlink_link" href="<$BlogItemPermalinkUrl$>#links">Links to this post</a>
</BlogItemBacklinksEnabled></MainOrArchivePage>
</div>
</div>
<!-- ENTRY BLOCK end -->
References
Blogger Template Walkthrough (blogger.com)
/* entry_block */
.entry_block {}
.entry_date_header {}
.entry_title {}
.entry_body {}
.entry_footer {}
.entry_footer .permalink {}
.entry_footer .comment_trigger {}
.entry_footer .backlink_link {}
.entry_block {}
.entry_date_header {}
.entry_title {}
.entry_body {}
.entry_footer {}
.entry_footer .permalink {}
.entry_footer .comment_trigger {}
.entry_footer .backlink_link {}
Stylesheet for This Blog
/* entry_block */
.entry_block
{
margin-bottom:10px;
font-size:.8em;
}
.entry_date_header
{
margin-bottom:4px;
font-weight:bold;
}
.entry_title
{
margin: 6px 0 4px;
font-family:Trebuchet MS, Helvetica, sans-serif;
font-weight:bold;
font-size:1.2em;
}
.entry_body
{
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}
.entry_footer
{
margin:4px 0 8px;
padding:4px;
font-size:11px;
font-family:verdana,sans-serif;
background:#f9f9fc;
border:1px solid #ccc;
border-width:0 0 1px;
}
.entry_footer .permalink {}
.entry_footer .comment_trigger {}
.entry_footer .backlink_link {}
.entry_block
{
margin-bottom:10px;
font-size:.8em;
}
.entry_date_header
{
margin-bottom:4px;
font-weight:bold;
}
.entry_title
{
margin: 6px 0 4px;
font-family:Trebuchet MS, Helvetica, sans-serif;
font-weight:bold;
font-size:1.2em;
}
.entry_body
{
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}
.entry_footer
{
margin:4px 0 8px;
padding:4px;
font-size:11px;
font-family:verdana,sans-serif;
background:#f9f9fc;
border:1px solid #ccc;
border-width:0 0 1px;
}
.entry_footer .permalink {}
.entry_footer .comment_trigger {}
.entry_footer .backlink_link {}
HTML
<!-- ENTRY BLOCK begin : .entry_block -->
<!-- Entry Date -->
<BlogDateHeader>
<div class="entry_date_header"><$BlogDateHeaderDate$></div>
</BlogDateHeader>
<!-- Entry Block -->
<div id="<$BlogItemNumber$>" class="entry_block">
<!-- Entry Title -->
<BlogItemTitle><div class="entry_title">
<BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL>
<$BlogItemTitle$></a>
</div></BlogItemTitle>
<!-- Entry Body -->
<div class="entry_body">
<$BlogItemBody$>
</div>
<!-- Entry Footer -->
<div class="entry_footer">
<!-- Permalink -->
» <a class="permalink" href="<$BlogItemPermalinkURL$>" title="permalink"> <$BlogItemDateTime$></a>
<!-- Comment Trigger -->
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment_trigger" href="<$BlogItemCommentCreate$>"
<$BlogItemCommentFormOnClick$>>
<$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled></MainOrArchivePage>
<!-- Link to Backlinks -->
<MainOrArchivePage><BlogItemBacklinksEnabled>
<a class="backlink_link" href="<$BlogItemPermalinkUrl$>#links">Links to this post</a>
</BlogItemBacklinksEnabled></MainOrArchivePage>
</div>
</div>
<!-- ENTRY BLOCK end -->
References
Blogger Template Walkthrough (blogger.com)
Friday, July 28, 2006
Blank Master Template
Here's the template fully assembled:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- BLOGGER HEAD STACK-->
<head>
<!-- META-DATA -->
<title><$BlogPageTitle$></title>
<meta name="description" content="a blogger blogspot blog" />
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript, Blogger, Skins" />
<!-- AUTO META-TAGS -->
<$BlogMetaData$>
<!-- PAGE ICON (for more info, see http://en.wikipedia.org/wiki/Favicon) -->
<link rel="icon" href="ICON_HREF" type="image/x-icon" />
<link rel="shortcut icon" href="ICON_HREF" type="image/x-icon" />
<link rel="icon" type="image/ico" href="ICON_HREF" />
<!-- SITE FEED -->
<BlogSiteFeed><$BlogSiteFeedUrl$></BlogSiteFeed>
<!-- EXTERNAL LINKS -->
<!-- LOCAL JAVASCRIPT -->
<script type="text/javascript">
</script>
<!-- end LOCAL JAVASCRIPT -->
<!-- INTERNAL STYLE SHEET -->
<style type="text/css">
</style>
<!-- end INTERNAL STYLE SHEET -->
</head>
<!-- BLOGGER HEAD STACK end -->
<body>
<div id="page">
<!-- MASTHEAD STACK: #masthead_stack-->
<div id="masthead_stack">
<!-- METABAR BLOCK -->
<div id="metabar_block">
</div>
<!-- MASTHEAD BLOCK -->
<div id="masthead_block">
<h1><$BlogTitle$></h1>
<p><$BlogDescription$></p>
</div>
</div>
<!-- MASTHEAD STACK end -->
<!-- SIDEBAR_STACK: #sidebar_stack-->
<div id="sidebar_stack">
<!-- PROFILE BLOCK -->
<div id="profile_block">
<h3>profile</h3>
<div id="profile_photo"><img src="<$BlogOwnerPhotoUrl$>"></div>
<p id="profile_full_name"><span class="profile_label">Name:</span> <$BlogOwnerFullName$></p>
<p id="profile_location"><span class="profile_label">Home:</span> <$BlogOwnerLocation$></p>
<p id="profile_about"><span class="profile_label">About Me:</span> <$BlogOwnerAboutMe$></p>
<p id="profile_link"><a href="<$BlogOwnerProfileUrl$>">view complete profile</a></p>
</div>
<!-- ARCHIVE BLOCK -->
<div id="archive_block" class="sidebar_block">
<h3>archives</h3>
<BloggerArchives>
<p><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></p>
</BloggerArchives>
</div>
<!-- RECENT POST BLOCK -->
<div id="recent_post_block" class="sidebar_block">
<h3>recent posts</h3>
<BloggerPreviousItems>
<p><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></p>
</BloggerPreviousItems>
</div>
<!-- LINK BLOCK -->
<div id="link_block" class="sidebar_block">
<h3>links of interest</h3>
<p><a href="http://www.blogger.com/">blogger home</a></p>
<p><a href="http://bloggerstack.blogspot.com/">blogger stack</a></p>
<p><a href="http://www.mushpup.org/">mushpup</a></p>
</div>
</div>
<!-- SIDEBAR STACK end -->
<!-- BLOGGER STACK: #blogger_stack -->
<!-- NOTE: Anything between Blogger tags will be repeated for every post on page -->
<div id="blogger_stack">
<Blogger>
<!-- ENTRY STACK: #entry_stack -->
<div id="entry_stack">
<!-- Entry Stack Foreword -->
<div id="entry_stack_foreword">
</div>
<!-- ENTRY BLOCK begin : .entry_block -->
<!-- Entry Date -->
<BlogDateHeader>
<div class="entry_date_header"><$BlogDateHeaderDate$></div>
</BlogDateHeader>
<!-- Entry Block -->
<div id="<$BlogItemNumber$>" class="entry_block">
<!-- Entry Title -->
<BlogItemTitle><div class="entry_title">
<BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL>
<$BlogItemTitle$></a>
</div></BlogItemTitle>
<!-- Entry Body -->
<div class="entry_body">
<$BlogItemBody$>
</div>
<!-- Entry Footer -->
<div class="entry_footer">
<!-- Permalink -->
» <a class="permalink" href="<$BlogItemPermalinkURL$>" title="permalink"> <$BlogItemDateTime$></a>
<!-- Comment Trigger -->
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment_trigger" href="<$BlogItemCommentCreate$>"
<$BlogItemCommentFormOnClick$>>
<$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled></MainOrArchivePage>
<!-- Link to Backlinks -->
<MainOrArchivePage><BlogItemBacklinksEnabled>
<a class="backlink_link" href="<$BlogItemPermalinkUrl$>#links">Links to this post</a>
</BlogItemBacklinksEnabled></MainOrArchivePage>
</div>
</div>
<!-- ENTRY BLOCK end -->
<!-- Entry Stack Afterword -->
<div id="entry_stack_afterword">
</div>
</div>
<!-- ENTRY STACK end -->
<!-- ENDNOTE STACK: #endnote_stack -->
<ItemPage>
<div id="endnote_stack">
<!-- Endnote Stack Header -->
<div id="endnote_stack_header">
</div>
<!-- COMMENT BLOCK begin : .comment_block -->
<BlogItemCommentsEnabled>
<div class="comment_block" id="<$BlogCommentNumber$>">
<BlogItemComments>
<div class="comment_body">
<$BlogCommentBody$>
</div>
<div class="comment_footer">
comment by <span class="comment_author><$BlogCommentAuthor$></span> at <a href="#<$BlogCommentNumber$>"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</div>
</BlogItemComments>
</div>
</BlogItemCommentsEnabled>
<!-- COMMENT BLOCK end -->
<!-- BACKLINK BLOCK begin : .backlink_block -->
<BlogItemBacklinksEnabled>
<div class="backlink_block">
<BlogItemBacklinks>
<div class="backlink_title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</div>
<div class="backlink_body">
<$BlogBacklinkSnippet$>
</div>
<div class="backlink_footer">
<span class="backlink_author">posted by <$BlogBacklinkAuthor$></span>
at <span class="backlink_datetime"><$BlogBacklinkDateTime$></span>
</div>
</BlogItemBacklinks>
<div class="backlink_trigger"><$BlogItemBacklinkCreate$></div>
</div>
</BlogItemBacklinksEnabled>
<!-- BACKLINK BLOCK end -->
<!-- Endnote Stack Footer-->
<div id="endnote_stack_footer">
<!-- Home Link -->
<div id="endnote_home_link">
<a href="<$BlogURL$>">« home</a>
</div>
</div>
</div>
</ItemPage>
<!-- ENDNOTE STACK end -->
</Blogger>
</div>
<!-- BLOGGER STACK end -->
<!-- FOOTER STACK: #footer_stack-->
<div id="footer_stack">
<!-- FOOTER LEFT -->
<div id="footer_left">
</div>
<!-- FOOTER RIGHT (firefox label) -->
<div id="footer_right">
<a href="http://www.spreadfirefox.com/?q=affiliates&id=151890&t=85"><img border="0" alt="Get Firefox!" title="Get Firefox!" src="http://sfx-images.mozilla.org/affiliates/Buttons/80x15/firefox_80x15.png"/></a>
</div>
<!-- FOOTER CENTER -->
</div>
<!-- FOOTER STACK end -->
<!-- PAGE ANALYTICS -->
<div id="page_analytics">
</div>
<!-- end PAGE ANALYTICS -->
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- BLOGGER HEAD STACK-->
<head>
<!-- META-DATA -->
<title><$BlogPageTitle$></title>
<meta name="description" content="a blogger blogspot blog" />
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript, Blogger, Skins" />
<!-- AUTO META-TAGS -->
<$BlogMetaData$>
<!-- PAGE ICON (for more info, see http://en.wikipedia.org/wiki/Favicon) -->
<link rel="icon" href="ICON_HREF" type="image/x-icon" />
<link rel="shortcut icon" href="ICON_HREF" type="image/x-icon" />
<link rel="icon" type="image/ico" href="ICON_HREF" />
<!-- SITE FEED -->
<BlogSiteFeed><$BlogSiteFeedUrl$></BlogSiteFeed>
<!-- EXTERNAL LINKS -->
<!-- LOCAL JAVASCRIPT -->
<script type="text/javascript">
</script>
<!-- end LOCAL JAVASCRIPT -->
<!-- INTERNAL STYLE SHEET -->
<style type="text/css">
</style>
<!-- end INTERNAL STYLE SHEET -->
</head>
<!-- BLOGGER HEAD STACK end -->
<body>
<div id="page">
<!-- MASTHEAD STACK: #masthead_stack-->
<div id="masthead_stack">
<!-- METABAR BLOCK -->
<div id="metabar_block">
</div>
<!-- MASTHEAD BLOCK -->
<div id="masthead_block">
<h1><$BlogTitle$></h1>
<p><$BlogDescription$></p>
</div>
</div>
<!-- MASTHEAD STACK end -->
<!-- SIDEBAR_STACK: #sidebar_stack-->
<div id="sidebar_stack">
<!-- PROFILE BLOCK -->
<div id="profile_block">
<h3>profile</h3>
<div id="profile_photo"><img src="<$BlogOwnerPhotoUrl$>"></div>
<p id="profile_full_name"><span class="profile_label">Name:</span> <$BlogOwnerFullName$></p>
<p id="profile_location"><span class="profile_label">Home:</span> <$BlogOwnerLocation$></p>
<p id="profile_about"><span class="profile_label">About Me:</span> <$BlogOwnerAboutMe$></p>
<p id="profile_link"><a href="<$BlogOwnerProfileUrl$>">view complete profile</a></p>
</div>
<!-- ARCHIVE BLOCK -->
<div id="archive_block" class="sidebar_block">
<h3>archives</h3>
<BloggerArchives>
<p><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></p>
</BloggerArchives>
</div>
<!-- RECENT POST BLOCK -->
<div id="recent_post_block" class="sidebar_block">
<h3>recent posts</h3>
<BloggerPreviousItems>
<p><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></p>
</BloggerPreviousItems>
</div>
<!-- LINK BLOCK -->
<div id="link_block" class="sidebar_block">
<h3>links of interest</h3>
<p><a href="http://www.blogger.com/">blogger home</a></p>
<p><a href="http://bloggerstack.blogspot.com/">blogger stack</a></p>
<p><a href="http://www.mushpup.org/">mushpup</a></p>
</div>
</div>
<!-- SIDEBAR STACK end -->
<!-- BLOGGER STACK: #blogger_stack -->
<!-- NOTE: Anything between Blogger tags will be repeated for every post on page -->
<div id="blogger_stack">
<Blogger>
<!-- ENTRY STACK: #entry_stack -->
<div id="entry_stack">
<!-- Entry Stack Foreword -->
<div id="entry_stack_foreword">
</div>
<!-- ENTRY BLOCK begin : .entry_block -->
<!-- Entry Date -->
<BlogDateHeader>
<div class="entry_date_header"><$BlogDateHeaderDate$></div>
</BlogDateHeader>
<!-- Entry Block -->
<div id="<$BlogItemNumber$>" class="entry_block">
<!-- Entry Title -->
<BlogItemTitle><div class="entry_title">
<BlogItemURL><a href="<$BlogItemURL$>"></BlogItemURL>
<$BlogItemTitle$></a>
</div></BlogItemTitle>
<!-- Entry Body -->
<div class="entry_body">
<$BlogItemBody$>
</div>
<!-- Entry Footer -->
<div class="entry_footer">
<!-- Permalink -->
» <a class="permalink" href="<$BlogItemPermalinkURL$>" title="permalink"> <$BlogItemDateTime$></a>
<!-- Comment Trigger -->
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment_trigger" href="<$BlogItemCommentCreate$>"
<$BlogItemCommentFormOnClick$>>
<$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled></MainOrArchivePage>
<!-- Link to Backlinks -->
<MainOrArchivePage><BlogItemBacklinksEnabled>
<a class="backlink_link" href="<$BlogItemPermalinkUrl$>#links">Links to this post</a>
</BlogItemBacklinksEnabled></MainOrArchivePage>
</div>
</div>
<!-- ENTRY BLOCK end -->
<!-- Entry Stack Afterword -->
<div id="entry_stack_afterword">
</div>
</div>
<!-- ENTRY STACK end -->
<!-- ENDNOTE STACK: #endnote_stack -->
<ItemPage>
<div id="endnote_stack">
<!-- Endnote Stack Header -->
<div id="endnote_stack_header">
</div>
<!-- COMMENT BLOCK begin : .comment_block -->
<BlogItemCommentsEnabled>
<div class="comment_block" id="<$BlogCommentNumber$>">
<BlogItemComments>
<div class="comment_body">
<$BlogCommentBody$>
</div>
<div class="comment_footer">
comment by <span class="comment_author><$BlogCommentAuthor$></span> at <a href="#<$BlogCommentNumber$>"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</div>
</BlogItemComments>
</div>
</BlogItemCommentsEnabled>
<!-- COMMENT BLOCK end -->
<!-- BACKLINK BLOCK begin : .backlink_block -->
<BlogItemBacklinksEnabled>
<div class="backlink_block">
<BlogItemBacklinks>
<div class="backlink_title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</div>
<div class="backlink_body">
<$BlogBacklinkSnippet$>
</div>
<div class="backlink_footer">
<span class="backlink_author">posted by <$BlogBacklinkAuthor$></span>
at <span class="backlink_datetime"><$BlogBacklinkDateTime$></span>
</div>
</BlogItemBacklinks>
<div class="backlink_trigger"><$BlogItemBacklinkCreate$></div>
</div>
</BlogItemBacklinksEnabled>
<!-- BACKLINK BLOCK end -->
<!-- Endnote Stack Footer-->
<div id="endnote_stack_footer">
<!-- Home Link -->
<div id="endnote_home_link">
<a href="<$BlogURL$>">« home</a>
</div>
</div>
</div>
</ItemPage>
<!-- ENDNOTE STACK end -->
</Blogger>
</div>
<!-- BLOGGER STACK end -->
<!-- FOOTER STACK: #footer_stack-->
<div id="footer_stack">
<!-- FOOTER LEFT -->
<div id="footer_left">
</div>
<!-- FOOTER RIGHT (firefox label) -->
<div id="footer_right">
<a href="http://www.spreadfirefox.com/?q=affiliates&id=151890&t=85"><img border="0" alt="Get Firefox!" title="Get Firefox!" src="http://sfx-images.mozilla.org/affiliates/Buttons/80x15/firefox_80x15.png"/></a>
</div>
<!-- FOOTER CENTER -->
</div>
<!-- FOOTER STACK end -->
<!-- PAGE ANALYTICS -->
<div id="page_analytics">
</div>
<!-- end PAGE ANALYTICS -->
</div>
</body>
</html>
Thursday, June 14, 2007
bloggerstack 1.0 tagged
Plan to spend a little time bringing this up to speed now that the Blogger re-release seems to have settled and the classic template will be hanging around. Toward that end, I've tagged the current trunk of the SVN repository: version 1.0 tag.
The project will be significantly reorganized, in the hopes as always of making things simpler and easier to use and maintain.
And, of course, the layout of this blog should be changing shortly.
The project will be significantly reorganized, in the hopes as always of making things simpler and easier to use and maintain.
And, of course, the layout of this blog should be changing shortly.
Sunday, June 17, 2007
new bloggerstack skin
Putting the finishing touches on the new bloggerstack template. The results now on display here. Guess where I got the inspiration of the theme.
Along the way, discovered IE has some issues with clear:both settings. What's new?
Code for this skin available in the project repository.
Along the way, discovered IE has some issues with clear:both settings. What's new?
Code for this skin available in the project repository.
Monday, July 31, 2006
This blog applies the blogger stack template explored here. For a more customized application, see my phosphorus and lime blog.
Monday, July 24, 2006
Template Object: Sidebar Stack
Parent Object: <$BLOGGER_TEMPLATE$>
Child Objects: <$PROFILE_BLOCK$>, <$ARCHIVE_BLOCK$>, <$RECENT_POST_BLOCK$>, <$LINK_BLOCK$>
Stylesheet
HTML
References
Profile Tags (blogger.com)
Child Objects: <$PROFILE_BLOCK$>, <$ARCHIVE_BLOCK$>, <$RECENT_POST_BLOCK$>, <$LINK_BLOCK$>
<$PROFILE_BLOCK$>
<$LINK_BLOCK$>
<$ARCHIVE_BLOCK$>
<$RECENT_POST_BLOCK$>
<$LINK_BLOCK$>
<$ARCHIVE_BLOCK$>
<$RECENT_POST_BLOCK$>
Stylesheet
/* SIDEBAR STACK */
#sidebar_stack_parent {}
#sidebar_stack {}
#sidebar_stack h2 {}
#sidebar_stack h3 {}
#sidebar_stack p {}
#sidebar_stack a {}
#sidebar_stack a:hover {}
.sidebar_block {}
#archive_block {}
#recent_post_block {}
#sidebar_stack #link_block {}
/* PROFILE BLOCK */
#profile_block {}
#profile_block p {}
#profile_block .profile_label {}
#profile_photo {}
#profile_full_name {}
#profile_location {}
#profile_about {}
#sidebar_stack_parent {}
#sidebar_stack {}
#sidebar_stack h2 {}
#sidebar_stack h3 {}
#sidebar_stack p {}
#sidebar_stack a {}
#sidebar_stack a:hover {}
.sidebar_block {}
#archive_block {}
#recent_post_block {}
#sidebar_stack #link_block {}
/* PROFILE BLOCK */
#profile_block {}
#profile_block p {}
#profile_block .profile_label {}
#profile_photo {}
#profile_full_name {}
#profile_location {}
#profile_about {}
HTML
<!-- SIDEBAR_STACK: #sidebar_stack-->
<div id="sidebar_stack_parent">
<div id="sidebar_stack">
<!-- PROFILE BLOCK -->
<div id="profile_block">
<h3>profile</h3>
<div id="profile_photo"><img src="<$BlogOwnerPhotoUrl$>"></div>
<p id="profile_full_name"><span class="profile_label">Name:</span> <$BlogOwnerFullName$></p>
<p id="profile_location"><span class="profile_label">Home:</span> <$BlogOwnerLocation$></p>
<p id="profile_about"><span class="profile_label">About Me:</span> <$BlogOwnerAboutMe$></p>
<p id="profile_link"><a href="<$BlogOwnerProfileUrl$>">view complete profile</a></p>
</div>
<!-- end PROFILE BLOCK -->
<!-- LINK BLOCK -->
<div id="link_block" class="sidebar_block">
<h3>links of interest</h3>
<p><a href="http://www.blogger.com/">blogger home</a></p>
<p><a href="http://bloggerstack.blogspot.com/">blogger stack</a></p>
<p><a href="http://www.mushpup.org/">mushpup</a></p>
</div>
<!-- end LINK BLOCK -->
<!-- ARCHIVE BLOCK -->
<div id="archive_block" class="sidebar_block">
<h3>archives</h3>
<BloggerArchives>
<p><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></p>
</BloggerArchives>
</div>
<!-- end ARCHIVE BLOCK -->
<!-- RECENT POST BLOCK -->
<div id="recent_post_block" class="sidebar_block">
<h3>recent posts</h3>
<BloggerPreviousItems>
<p><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></p>
</BloggerPreviousItems>
</div>
<!-- end RECENT POST BLOCK -->
</div>
</div>
<!-- SIDEBAR STACK end -->
<div id="sidebar_stack_parent">
<div id="sidebar_stack">
<!-- PROFILE BLOCK -->
<div id="profile_block">
<h3>profile</h3>
<div id="profile_photo"><img src="<$BlogOwnerPhotoUrl$>"></div>
<p id="profile_full_name"><span class="profile_label">Name:</span> <$BlogOwnerFullName$></p>
<p id="profile_location"><span class="profile_label">Home:</span> <$BlogOwnerLocation$></p>
<p id="profile_about"><span class="profile_label">About Me:</span> <$BlogOwnerAboutMe$></p>
<p id="profile_link"><a href="<$BlogOwnerProfileUrl$>">view complete profile</a></p>
</div>
<!-- end PROFILE BLOCK -->
<!-- LINK BLOCK -->
<div id="link_block" class="sidebar_block">
<h3>links of interest</h3>
<p><a href="http://www.blogger.com/">blogger home</a></p>
<p><a href="http://bloggerstack.blogspot.com/">blogger stack</a></p>
<p><a href="http://www.mushpup.org/">mushpup</a></p>
</div>
<!-- end LINK BLOCK -->
<!-- ARCHIVE BLOCK -->
<div id="archive_block" class="sidebar_block">
<h3>archives</h3>
<BloggerArchives>
<p><a href='<$BlogArchiveURL$>'><$BlogArchiveName$></a></p>
</BloggerArchives>
</div>
<!-- end ARCHIVE BLOCK -->
<!-- RECENT POST BLOCK -->
<div id="recent_post_block" class="sidebar_block">
<h3>recent posts</h3>
<BloggerPreviousItems>
<p><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></p>
</BloggerPreviousItems>
</div>
<!-- end RECENT POST BLOCK -->
</div>
</div>
<!-- SIDEBAR STACK end -->
References
Profile Tags (blogger.com)
Thursday, July 20, 2006
Template Object: Footer Stack
Parent Object: <$BLOGGER_TEMPLATE$>
Child Objects: n/a
Stylesheet
HTML
References
Google Analytics
Spread Firefox
Measure Map
Child Objects: n/a
<$FOOTER_LEFT$>
<$FOOTER_RIGHT$>
<$FOOTER_CENTER$>
<$PAGE_ANALYTICS$>
<$FOOTER_RIGHT$>
<$FOOTER_CENTER$>
<$PAGE_ANALYTICS$>
Stylesheet
/* FOOTER STACK */
#footer_stack { clear:both; text-align:center; }
#footer_left { float:left; }
#footer_right { float:right; }
#page_analytics { visibility:hidden; }
#footer_stack { clear:both; text-align:center; }
#footer_left { float:left; }
#footer_right { float:right; }
#page_analytics { visibility:hidden; }
HTML
<!-- FOOTER STACK: #footer_stack-->
<div id="footer_stack">
<!-- FOOTER LEFT -->
<div id="footer_left">
</div>
<!-- FOOTER RIGHT (firefox label) -->
<div id="footer_right">
<a href="http://www.spreadfirefox.com/?q=affiliates&id=151890&t=85"><img border="0" alt="Get Firefox!" title="Get Firefox!" src="http://sfx-images.mozilla.org/affiliates/Buttons/80x15/firefox_80x15.png"/></a>
</div>
<!-- FOOTER CENTER -->
</div>
<!-- FOOTER STACK end -->
<!-- PAGE ANALYTICS -->
<div id="page_analytics">
</div>
<!-- end PAGE ANALYTICS -->
<div id="footer_stack">
<!-- FOOTER LEFT -->
<div id="footer_left">
</div>
<!-- FOOTER RIGHT (firefox label) -->
<div id="footer_right">
<a href="http://www.spreadfirefox.com/?q=affiliates&id=151890&t=85"><img border="0" alt="Get Firefox!" title="Get Firefox!" src="http://sfx-images.mozilla.org/affiliates/Buttons/80x15/firefox_80x15.png"/></a>
</div>
<!-- FOOTER CENTER -->
</div>
<!-- FOOTER STACK end -->
<!-- PAGE ANALYTICS -->
<div id="page_analytics">
</div>
<!-- end PAGE ANALYTICS -->
References
Google Analytics
Spread Firefox
Measure Map
Wednesday, July 19, 2006
Template Object: Masthead Stack
Parent Object: <$BLOGGER_TEMPLATE$>
Child Objects: n/a
Schematic
Stylesheet
HTML
References
none
Child Objects: n/a
Schematic
<$METABAR_BLOCK$>
<$MASTHEAD_BLOCK$>
<$MASTHEAD_BLOCK$>
Stylesheet
/* MASTHEAD STACK */
#masthead_stack {}
#metabar_block {}
#masthead_block {}
#masthead_block h1 {}
#masthead_block p {}
#masthead_stack {}
#metabar_block {}
#masthead_block {}
#masthead_block h1 {}
#masthead_block p {}
HTML
<!-- MASTHEAD STACK: #masthead_stack-->
<div id="masthead_stack">
<!-- METABAR BLOCK -->
<div id="metabar_block">
</div>
<!-- MASTHEAD BLOCK -->
<div id="masthead_block">
<h1><$BlogTitle$></h1>
<p><$BlogDescription$></p>
</div>
</div>
<!-- MASTHEAD STACK end -->
<div id="masthead_stack">
<!-- METABAR BLOCK -->
<div id="metabar_block">
</div>
<!-- MASTHEAD BLOCK -->
<div id="masthead_block">
<h1><$BlogTitle$></h1>
<p><$BlogDescription$></p>
</div>
</div>
<!-- MASTHEAD STACK end -->
References
none
Monday, July 17, 2006
Template Object: Endnote Stack
Parent Object: blogger_stack
Child Objects: comment_block, linkback_block
Schematic
Stylesheet
HTML
References
Conditional Tags (blogger.com)
Child Objects: comment_block, linkback_block
Schematic
<$ENDNOTE_STACK_HEADER$>
<$COMMENT_TRIGGER$>
<$COMMENT_BLOCK$>
<$LINKBACK_BLOCK$>
<$HOME_LINK$>
<$ENDNOTE_STACK_FOOTER$>
<$COMMENT_TRIGGER$>
<$COMMENT_BLOCK$>
<$LINKBACK_BLOCK$>
<$HOME_LINK$>
<$ENDNOTE_STACK_FOOTER$>
Stylesheet
/* ENDNOTE STACK */
#endnote_stack {}
#endnote_comment_trigger {}
#endnote_stack_header {}
#endnote_stack_footer {}
#endnote_home_link {}
#endnote_stack {}
#endnote_comment_trigger {}
#endnote_stack_header {}
#endnote_stack_footer {}
#endnote_home_link {}
HTML
<!-- ENDNOTE STACK: #endnote_stack -->
<ItemPage>
<div id="endnote_stack">
<!-- Endnote Stack Header -->
<div id="endnote_stack_header">
</div>
<!-- Comment Trigger -->
<BlogItemCommentsEnabled>
<a class="comment_trigger" href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>>
post a comment
</a>
</BlogItemCommentsEnabled>
<!-- Comment Block -->
<!-- Linkback Block -->
<!-- Endnote Stack Footer-->
<div id="endnote_stack_footer">
<!-- Home Link -->
<div id="endnote_home_link">
<a href="<$BlogURL$>">« home</a>
</div>
</div>
</div>
</ItemPage>
<!-- ENDNOTE STACK end -->
<ItemPage>
<div id="endnote_stack">
<!-- Endnote Stack Header -->
<div id="endnote_stack_header">
</div>
<!-- Comment Trigger -->
<BlogItemCommentsEnabled>
<a class="comment_trigger" href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>>
post a comment
</a>
</BlogItemCommentsEnabled>
<!-- Comment Block -->
<!-- Linkback Block -->
<!-- Endnote Stack Footer-->
<div id="endnote_stack_footer">
<!-- Home Link -->
<div id="endnote_home_link">
<a href="<$BlogURL$>">« home</a>
</div>
</div>
</div>
</ItemPage>
<!-- ENDNOTE STACK end -->
References
Conditional Tags (blogger.com)
Monday, July 10, 2006
Sub-Template: Backlink Block
Stylesheet
HTML
References
Blogger Backlink Tags (blogger.com)
/* BACKLINK BLOCK */
.backlink_block {}
.backlink_title {}
.backlink_body {}
.backlink_footer {}
.backlink_footer .backlink_author {}
.backlink_footer .backlink_datetime {}
.backlink_footer .backlink_trigger {}
.backlink_block {}
.backlink_title {}
.backlink_body {}
.backlink_footer {}
.backlink_footer .backlink_author {}
.backlink_footer .backlink_datetime {}
.backlink_footer .backlink_trigger {}
HTML
<!-- BACKLINK BLOCK begin : .backlink_block -->
<BlogItemBacklinksEnabled>
<div class="backlink_block">
<BlogItemBacklinks>
<div class="backlink_title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</div>
<div class="backlink_body">
<$BlogBacklinkSnippet$>
</div>
<div class="backlink_footer">
<span class="backlink_author">posted by <$BlogBacklinkAuthor$></span>
at <span class="backlink_datetime"><$BlogBacklinkDateTime$></span>
</div>
</BlogItemBacklinks>
<div class="backlink_trigger"><$BlogItemBacklinkCreate$></div>
</div>
</BlogItemBacklinksEnabled>
<!-- BACKLINK BLOCK end -->
<BlogItemBacklinksEnabled>
<div class="backlink_block">
<BlogItemBacklinks>
<div class="backlink_title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</div>
<div class="backlink_body">
<$BlogBacklinkSnippet$>
</div>
<div class="backlink_footer">
<span class="backlink_author">posted by <$BlogBacklinkAuthor$></span>
at <span class="backlink_datetime"><$BlogBacklinkDateTime$></span>
</div>
</BlogItemBacklinks>
<div class="backlink_trigger"><$BlogItemBacklinkCreate$></div>
</div>
</BlogItemBacklinksEnabled>
<!-- BACKLINK BLOCK end -->
References
Blogger Backlink Tags (blogger.com)
a bloggerstack template
