無料ブログ作成ならJUGEM(ジュゲム)

ホーム

テンプレートHTML・CSSについて: 公開されているテンプレートのHTMLに{ad}タグがないものありますので、エラーが表示された場合は{ad}タグを追加してご利用ください。
テンプレートの利用について: 弊社が著作権を所有する画像等以外のテンプレートに関する著作権は制作者にあります。弊社提供以外のブログサービスで利用した場合は、その都度制作者の方にご確認ください。

テンプレート名 : life of ...

HTML・CSSをコピーして使う

HTML

<?XML version="1.0" encoding="{site_encoding}"?>
<!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" lang="ja" xml:lang="ja">
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset={site_encoding}" />
<META http-equiv="Content-Style-Type" content="text/css" />
<META http-equiv="Content-Script-Type" content="text/javascript" />
<TITLE>{site_title}</TITLE>
<LINK rel="stylesheet" href="{site_css}" type="text/css" />
<LINK rel="alternate" type="application/rss+xml" title="RSS" href="{site_rss}" />
<LINK rel="alternate" type="application/atom+xml" href="{site_atom}" />
<SCRIPT type="text/javascript" src="./template/js/cookie.js"></SCRIPT>
</HEAD>

<DIV id="blog_title">

<DIV class="border">
<DIV class="blog_name">ё {blog_name}</DIV>
<DIV class="description">ё {blog_description}</DIV>
</DIV>

</DIV>

<DIV id="admin">

<DIV class="border">
<DIV class="list_title">ё admin</DIV>
<DIV class="list_text">
<UL>
	<LI><a href="./admin/" target="_top">Admin</a></LI>
	<LI><a href="./?mode=rss" target="_top">RSS1.0</a> / <a href="./?mode=atom" target="_top">Atom0.3</a></LI>
	<LI>Powered by <a href="http://jugem.jp/" target="_blank">jugem</a></LI>
	<LI>Powered by <a href="http://lolipop.jp/" target="_blank">lolipop</a></LI>
</UL>
</DIV>
</DIV>

</DIV>

</TD></TR>
<TR><TD colspan="2">

<DIV class="border">
<DIV class="list_title">ё CALENDAR</DIV>
<DIV class="calendar_month"><A href="?month={calendar_prev_yearmonth}">＜＜</A> {calendar_str_yearmonth} <A href="?month={calendar_next_yearmonth}">＞＞</A></DIV>
<DIV class="calendar">{calendar_horizontal_only}</DIV>
</DIV>

</TD></TR>
<TR valign="top"><TD id="side">

<DIV class="border">
<DIV class="list_title" id="archivename">ё archives</DIV>
<DIV class="list_text" id="archivelist">{archives_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="categoryname">ё categories</DIV>
<DIV class="list_text" id="categorylist">{category_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="newentryname">ё latest entries</DIV>
<DIV class="list_text" id="newentrylist">{latest_entry_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="entryname">ё selected entries</DIV>
<DIV class="list_text" id="entrylist">{selected_entry_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="commentname">ё recent comments</DIV>
<DIV class="list_text" id="commentlist">{recent_comment_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="tbname">ё recent trackback</DIV>
<DIV class="list_text" id="tblist">{recent_trackback_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="linkname">ё links</DIV>
<DIV class="list_text" id="linklist">{link_list}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title" id="searchname">ё search & profile</DIV>
	<DIV class="list_text" id="searchlist">

<DIV class="border">
		<DIV class="list_title">ё profile</DIV>
		<DIV class="list_text">{user_list}</DIV>
		</DIV>

<DIV class="border">
		<DIV class="list_title">ё Search this site.</DIV>
			<DIV class="commnet_form">
				<FORM method="get" action="">
				<INPUT name="search" id="search" size="20" style="width:100px" />
				<INPUT type="submit" value="submit" />
				</FORM>
			</DIV>
		</DIV>

<DIV class="border">
		<DIV class="list_title">ё mobile</DIV>
		<DIV class="mobile">{site_qrcode}</DIV>
		</DIV>

</DIV>
</DIV>

<DIV class="border">
<DIV class="free_title" id="fs1name">ё {freespace_title1}</DIV>
<DIV class="free_text" id="fs1list">{freespace_contents1}</DIV>
</DIV>

<DIV class="border">
<DIV class="free_title" id="fs2name">ё {freespace_title2}</DIV>
<DIV class="free_text" id="fs2list">{freespace_contents2}</DIV>
</DIV>

<DIV class="border">
<DIV class="free_title" id="fs3name">ё {freespace_title3}</DIV>
<DIV class="free_text" id="fs3list">{freespace_contents3}</DIV>
</DIV>

<DIV class="border">
<DIV class="free_title" id="fs4name">ё {freespace_title4}</DIV>
<DIV class="free_text" id="fs4list">{freespace_contents4}</DIV>
</DIV>

<DIV class="border">
<DIV class="free_title" id="fs5name">ё {freespace_title5}</DIV>
<DIV class="free_text" id="fs5list">{freespace_contents5}</DIV>
</DIV>

<DIV class="border">
<DIV class="list_title">ё recommend</DIV>
{amazon_item}
</DIV>

<DIV class="border">
<DIV class="list_title">ё sponsored links</DIV>
{ad}
</DIV>

</TD>
<TD id="contents">

<DIV class="border">
<DIV class="page_navi">{prev_entry} | <A href="./">main</A> | {next_entry}</DIV>
</DIV>

<DIV class="entry">
<DIV class="entry_title"><a href="{entry_permalink}">ё</a> {entry_title}</DIV>
<DIV class="entry_date">{entry_date} | {entry_time}</DIV>
<DIV class="entry_text">{entry_description}</DIV>
<a name="sequel"></a>
<DIV class="entry_more">{entry_sequel}</DIV>
<DIV class="entry_state">by {user_name} | {category_name} | {comment_num} | {trackback_num}</DIV>
</DIV>
{trackback_auto_discovery}
<DIV class="entry_state"><A href="#top" title="page top">↑page top</A></DIV>

<A name="comments"></A>
<DIV class="entry">
<DIV class="tb">COMMENTS</DIV>

<DIV class="tb_text">{comment_description}</DIV>
<DIV class="entry_date">by {comment_name} | {comment_time}</DIV>

<DIV class="commnet_form">
	<FORM name="comment_area" id="comment_area" action="./?mode=comment" method="post">
	<INPUT type="hidden" name="entry_id" value="{entry_id}" />
	<LABEL for="name">name </LABEL>
	<INPUT type="text" tabindex="1" name="name" id="name" value="{cookie_name}" style="width:250px;" /><BR />
	<LABEL for="email">email </LABEL>
	<INPUT type="text" tabindex="2" name="email" id="email" value="{cookie_email}" style="width:250px;" /><BR />
	<LABEL for="url">url </LABEL>
	<INPUT type="text" tabindex="3" name="url" id="url" value="{cookie_url}" style="width:250px;" /><BR />
	<LABEL for="description">comments </LABEL>
	<TEXTAREA tabindex="4" id="description" name="description" rows="8" cols="50" style="width:250px;" /></TEXTAREA><BR />
	<LABEL for="set_cookie">cookie:</LABEL>
	<INPUT type="checkbox" name="set_cookie" value="1" id="set_cookie" />
	<INPUT tabindex="5" type="submit" value="submit" onclick="javascript:setval();" />
	</FORM>
</DIV>
</DIV>
<DIV class="entry_state"><A href="#top" title="page top">↑page top</A></DIV>

<A name="trackback"></A>
<DIV class="entry">
<DIV class="tb">TRACKBACK URL</DIV>
<DIV class="tb_url">{trackback_url}</DIV>
</DIV>

<DIV class="entry">
<DIV class="tb">TRACKBACK</DIV>
<DIV class="tb_title">ё {trackback_title}</DIV>
<DIV class="tb_text">{trackback_excerpt}</DIV>
<DIV class="entry_state">by {trackback_blog_name} | {trackback_time}</DIV>
</DIV>
<DIV class="entry_state"><A href="#top" title="page top">↑page top</A></DIV>

<DIV class="entry">
<DIV class="tb">PROFILE</DIV>
<DIV class="prof_name">{profile_name}</DIV>
<DIV class="entry_text">{profile_description}</DIV>
</DIV>
<DIV class="entry_state"><A href="#top" title="page top">↑page top</A></DIV>

<DIV class="border">
<DIV class="page_navi" id="pagenavi">{prev_page_link} {page_now}/{page_num} {next_page_link}</DIV>
</DIV>
<script type="text/javascript">
<!--
// ページなび？
// by http://melrose.jugem.cc/?eid=23
var pageNow = {page_now};
var pageNum = {page_num};
var difPageNum = 0;

function writeGoogleNavi(page, type) {

var maxLinkNum = 5;         // 最大ページリンク数
var prevStr = '←prev';     // 前のリンクを表示する文字
var nextStr = 'next→';     // 次のリンクを表示する文字
var leftParenthesis = '[';  // ページリンクを囲む文字（左）
var rightParenthesis = ']'; // ページリンクを囲む文字（右）

var nextPageNum = 0;
var nextNavi = true;
var linkHtmlTag = '';
var eName = 'pagenavi';
var element = null;

if (document.all) {
element = document.all[eName];
} else if (document.getElementById(eName)) {
element = document.getElementById(eName);
} else {
return;
}

if (maxLinkNum > pageNum) maxLinkNum = pageNum;
if (type == 'next') difPageNum++;
if (type == 'prev') difPageNum--;
if (type == 'init' && page > maxLinkNum) difPageNum = page - maxLinkNum;

if (difPageNum > 0) {
linkHtmlTag = '<a href="javascript:writeGoogleNavi(\'' + difPageNum + '\', \'prev\')">' + prevStr + '</a>';
}

for(i = difPageNum; i < (maxLinkNum + difPageNum); i ++) {
if (pageNow != 0 && (i + 1) != pageNow) {
linkHtmlTag += ' <a href="' + window.location.pathname + '?page=' + i + '">' + leftParenthesis + (i + 1) + rightParenthesis + '</a> ';
} else {
linkHtmlTag += ' <b>' + leftParenthesis + (i + 1) + rightParenthesis + '</b> ';
}
}

if (pageNum > (maxLinkNum + difPageNum)) {
linkHtmlTag += '<a href="javascript:writeGoogleNavi(\'' + (maxLinkNum + difPageNum - 1) + '\', \'next\')"> ' + nextStr + '</a>';
}

element.innerHTML = linkHtmlTag;
}
writeGoogleNavi(pageNow, 'init');
-->
</script>

</TD></TR>
<TR><TD colspan="2">

<DIV class="border">
<DIV id="footer">{copyright}</DIV>

</TD></TR>
</TABLE>

<SCRIPT type="text/javascript">

</SCRIPT>

<SCRIPT type="text/javascript">

</SCRIPT>

</BODY>
</HTML>

CSS

/* 全体的な設定 ---------------------------------- */
body {text-align:center;}
* {
    font-family:Comic Sans MS,Lucida Sans,Arial,ＭＳ Ｐゴシック;
    font-size:12px;
    color:#8F8F3D;
    background-color:#EEEEDE;
    overflow:auto;
    margin:0px;
    padding:0px;
}
* {
    scrollbar-3dlight-color:#E19951;
    scrollbar-arrow-color:#E19951;
    scrollbar-darkshadow-color:#E19951;
    scrollbar-face-color:#EEEEDE;
    scrollbar-highlight-color:#EEEEDE;
    scrollbar-shadow-color:#EEEEDE;
    scrollbar-track-color:#EEEEDE;
}
a {text-decoration:none;}
a link,
a visited,
a active {}
a hover {}
ul {
    list-style-type:none;
}
img {}
/***************************************************/
/* 入力フォームに関する設定 ---------------------- */
form {margin:0px; padding:0px;}
label {vertical-align:top;}
input,
textarea {border:1px solid #E19951;}
/* (コメント入力部分全体の設定) */
.commnet_form {text-align:right; padding:5px 5px;}
/***************************************************/
/* タイトル、説明に関する設定 -------------------- */
.blog_name,
.blog_name a {
    font-size:24px;
    padding:5px;
}
.description {
    padding:5px;
}
/***************************************************/
/* カレンダーに関する設定 ------------------------ */
/* (枠の部分) */
.calendar {
    text-align:center;
    padding:2px;
}
.calendar a {
    font-weight:bold;
    color:#E19951;
}
.calendar_month {
    text-align:center;
    padding:2px;
}
.calendar_month a {
    font-weight:bold;
    color:#E19951;
}
/***************************************************/
/* (ブログタイトルの部分) */
#blog_title {
    float:left;
    width:450px;
}
/* (adminの部分) */
#admin {
    float:right;
    width:150px;
}
/* (メニュー部分) */
#side {
    width:200px;
}
/* (記事部分) */
#contents {
    width:415px;
}
/***************************************************/
/* 枠に関する設定 -------------------------------- */
/* (枠なし) */
.border {
    margin:3px;
}
/* (枠あり、直線) */
.entry {
    margin:3px;
    border:1px solid #E19951;
}
/***************************************************/
/* メイン部分の設定 ------------------------------ */
/* (タイトル部分) */
.entry_title {
    text-align:left;
    padding:2px;
}
.entry_title a {
    font-weight:bold;
}
/* (テキスト部分) */
.entry_text {
    text-align:left;
    padding:5px;
}
.entry_text a {
    font-weight:bold;
}
/* (テキスト内部｢続き｣の部分) */
.entry_more {
    text-align:left;
    padding:5px;
}
.entry_more a {
    font-weight:bold;
}
/* (データ部分、下線あり) */
.entry_date {
    font-size:9px;
    text-align:right;
    padding:2px;
    border-bottom:1px dashed #E19951;
}
.entry_date a {
    font-size:9px;
}
/* (データ部分、下線なし) */
.entry_state {
    font-size:9px;
    text-align:right;
    padding:2px;
}
.entry_state a {
    font-size:9px;
}
/* (ナビゲーションに関する設定) */
.page_navi {
    text-align:center;
    padding:2px;
}
/* (画像に関する設定) */
img.pict {
    display:block;
    text-align:center;
    margin-left:auto;
    margin-right:auto;
    border:0px none #fff;
}
/* (引用表示に関する設定)  */
blockquote {
    margin-top:5px;
    padding:5px;
    border:1px dashed #E19951;
}
/* (スプリクト矢印に関する設定)  */
.foldmark{margin:3px;}
/***************************************************/
/* コメント・トラックバック ---------------------- */
.tb {
    padding:2px;
    border-bottom:1px dashed #E19951;
    border-left:5px solid #E19951;
}
/* (タイトル部分) */
.tb_title {
    text-align:left;
    padding:2px;
}
.tb_title a {
    font-weight:bold;
}
/* (テキスト部分) */
.tb_text {
    text-align:left;
    padding:5px;
}
.tb_text a {
    font-weight:bold;
}
/* (URLの表示に関する設定) */
.tb_url {
    text-align:center;
    padding:2px;
}
/***************************************************/
/* プロフィール ---------------------------------- */
/* (名前の部分) */
.prof_name {
    text-align:center;
    padding:2px;
}
/***************************************************/
/* メニューリスト部分の設定 ---------------------- */
/* (タイトル部分) */
.list_title {
    padding:2px;
    border-left:5px solid #E19951;
}
.list_title a {}
/* (テキスト部分) */
.list_text {
    padding:2px;
}
.list_text a {
    font-weight:500;
}
/* (リストに下線を付けたいとき) */
.list_text li {
    padding:2px;
    border-bottom:1px dashed #E19951;
}
/* (mobileイメージの大きさ) */
.mobile {text-align:center; padding:2px;}
.mobile img {height:95px;}
/***************************************************/
/* フリーエリア部分の設定 ------------------------ */
/* (タイトル部分) */
.free_title {
    padding:2px;
    border-left:5px solid #E19951;
}
/* (テキスト部分) */
.free_text {
    padding:2px;
    text-align:center;
}
.free_text a {
    font-weight:bold;
}
/***************************************************/
/* フッタ (copyright) ---------------------------- */
#footer {
    text-align:center;
    padding:5px;
}
/***************************************************/
/* アマゾンに関する設定 -------------------------- */
/* (アマゾン全体) */
.amazon {
    text-align:center;
    padding:2px;
}
/* (アマゾンテキストの部分) */
.amazon_text {
    text-align:left;
    padding:2px;
}
/* (アマゾン（MonoColle ≫）の部分) */
.amazon_text strong {
    font-weight:400;
}
.amazon_monocolle a {
    font-family:Calligraph421 BT;
}
/* (アマゾンの画像に関する設定) */
.amazon_pict {height:100px;}
/***************************************************/
/* 広告に関する設定 ------------------------------ */
#ad {}
.links{
    text-align:center;
    padding:2px;
}
.linktext{}

高品質デザイン選び放題で、あなた好みのブログに。今すぐブログ作成！: 今すぐ 無料ブログ をはじめよう！ ≫ブログ作成