サンプルブログはこちら
デザイン -> HTML で新しいテンプレートを作成します
※ blog.css の詳細
記事の属性によって、画面の見栄え変更を可能にする為の構成です。
( 右サイドは自由です )
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<!-- キャラクタセット -->
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<!-- タイトル部分 -->
<% if:extra_title -%>
<title><% extra_title %> :<% blog.title %></title>
<% else -%>
<title><% blog.title %></title>
<% /if -%>
<!-- ブログ説明 -->
<meta name="description" content="<% blog.description | nl2br | tag_strip %>" />
<!-- ブログキーワード -->
<meta name="keywords" content="<% blog.keywords | oneline | tag_strip | __or__ | blog.title | oneline | remove_emoji | tag_strip %> <% extra_keywords | oneline | tag_strip %>" />
<!-- その他(なくても良い) -->
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<!-- メイン CSS -->
<link rel="stylesheet" href="http://yourdomain/blog.css" type="text/css" />
<!-- ブログで変更する追加 CSS -->
<link rel="stylesheet" href="<% css.page_url(page) %>" type="text/css" />
<!-- RSS の URL -->
<link rel="alternate" href="<% blog.page_url %>index.rdf" type="application/rss+xml" title="RSS" />
<% if:blog.has_foaf -%>
<link rel="meta" type="application/rdf+xml" title="FOAF" href="<% blog.page_url %>foaf.rdf" />
<% /if -%>
<!-- JavaScript用ページ変数の作成 -->
<script type="text/javascript">
var $page_name = '<% page_name %>';
if ( $page_name == 'index' ) {
str="";
str+="<style type=\"text/css\"> \n";
str+=".date,.title { display:none; } \n";
str+="</style> ";
document.write( str );
}
</script>
</head>
<body>
<!-- ページ変数で見栄え変更できるように、記事コンテンツで全てを記述 -->
<% content_main %>
<!-- 右サイドバー -->
<% if:have_content_right -%>
<div id="links">
<% content_right %>
</div>
<% /if -%>
<!-- フッター -->
<div id="footer">
<% content_footer -%>
</div>
<!-- 対応する DIV は content_main 内 -->
</div>
</body>
</html>
記事部分のテンプレートです
<!-- content_main のトップ -->
<div id="container">
<!-- 一番上の帯 -->
<div id="top_1"></div>
<!-- タイトル部分 -->
<div id="banner">
<% content.header -%>
<h1><a href="<% blog.page_url %>" accesskey="1"><% blog.title %></a></h1>
<% content.footer -%>
</div >
<div id="content">
<!-- 実際のコンテンツの開始位置 -->
<% content.header -%>
<!-- トップページの場合のみ改行を2つ -->
<% if:page_name eq 'index' -%>
<br><br>
<% /if -%>
<!-- 記事の場合の CSS による調整 -->
<% if:page_name eq 'article' -%>
<style type="text/css">
.text {
margin-top:20px;
}
</style>
<% /if -%>
<!-- 1つ以上の記事の繰り返し -->
<!-- 一般サイト型にするには、ブログ設定で1記事表示にする -->
<!-- 常にトップに持って来るエントランスは、当分来ない未来日付にする -->
<!-- index ページのタイトルは メインテンプレートで非表示になるよう設定 -->
<% loop:list_article -%>
<!-- 記事部分 -->
<div class="blog">
<!--
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:Trackback="http://madskills.com/public/xml/rss/module/Trackback/"
xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description
rdf:about="<% article.page_url | xml %>"
trackback:ping="<% article.tb_url | xml %>"
dc:title="<% article.subject | nl2br | tag_strip | xml | inside_comment %>"
dc:identifier="<% article.page_url | xml %>"
dc:description="<% article.get_excerpt | nl2br | tag_strip | xml | inside_comment | text_summary(240) %>"
dc:creator="<% article.nickname | nl2br | tag_strip | xml | inside_comment %>"
dc:subject="<% article_category.name | nl2br | tag_strip | xml | inside_comment %>"
dc:date="<% article.createstamp | date_format("%Y-%m-%dT%H:%M:%S+09:00") %>"
/>
</rdf:RDF>
-->
<% if:with_date %><h2 class="date"><% article.createstamp | date_format("%Y年%m月%d日") %></h2><% /if %>
<div class="blogbody">
<h3 class="title"><a href="<% article.page_url %>" class="title"><% article.subject %></a></h3>
<% if:page_name eq 'article' -%>
<div class="text"><% article.entire_body | bodyfilter(article_info,blog) %><% if:list_tag %><div class="tag-word">タグ:<% loop:list_tag %><a href="<% blog.tag_url(tag) %>"><% tag.word %></a> <% /loop %></div><% /if %>
<% else -%>
<div class="text"><% article.first_body | bodyfilter(article_info,blog) %><% if:list_tag %><div class="tag-word">タグ:<% loop:list_tag %><a href="<% blog.tag_url(tag) %>"><% tag.word %></a> <% /loop %></div><% /if %>
<% /if -%>
<% if:list_category_article -%>
<div class="listCategoryArticle">
【<% article_category.name %>の最新記事】<br />
<ul>
<% loop:list_category_article %>
<li><a href="<% article.page_url %>"><% article.subject | text_summary(20) %></a></li>
<% /loop %>
</ul>
</div>
<% /if %>
</div>
<!--class=text-->
</div>
<!--class=blogbody-->
</div>
<!--class=blog-->
<% /loop -%>
<!-- /Content -->
<% content.footer -%>
<!--id=content-->
</div>