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

ホーム

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

テンプレート名 : chu*heart

HTML・CSSをコピーして使う

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<title>{site_title}</title>
<meta http-equiv="content-type" content="text/html; charset={site_encoding}" />
		<link rel="stylesheet" href="{site_css}" type="text/css" />
		<link type="text/css" href="{gmo_header_css}" rel="stylesheet" media="screen,print">
		<link rel="alternate" type="application/rss+xml" title="RSS" href="{site_rss}" />
		<link rel="alternate" type="application/atom+xml" href="{site_atom}" />
		<link rel="alternate" media="handheld" type="application/xhtml+xml" href="{mobile_url}" />
</HEAD>
<BODY>

<div id="wrapper">

<div id="layout">

<div id="top"><a name="top2"></a></div>

<div id="middle">

<h1>{blog_name}</h1>
<div id="description">{blog_description}</div>

<div id="calender">{calendar_horizontal_addzero}</div>

<div id="side">

<h2>Profile</h2>
{user_list}

<h2>Categories</h2>
{category_list}

<h2>Archives</h2>
<div class="scroll">
{archives_list}
</div>

<h2>New Entries</h2>
{latest_entry_list}

<h2>Recent Comments</h2>
<div class="scroll">
{recent_comment_list}
</div>

<h2>{freespace_title1}</h2>
{freespace_contents1}

<h2>{freespace_title2}</h2>
{freespace_contents2}

<h2>{freespace_title3}</h2>
{freespace_contents3}

<h2>{freespace_title4}</h2>
{freespace_contents4}

<h2>{freespace_title5}</h2>
{freespace_contents5}

 
<h2>Links</h2>
 
{link_list}

 

<h2>Recommend</h2>
<div class="amazon_scroll">

<div class="amazonbox">
<div class="amazonimage centering">
<A HREF="{amazon_url}" target="_blank" title="{amazon_ProductName}"><IMG SRC = "{amazon_ImageUrlSmall}" ALT = "{amazon_ProductName}"></A><BR>
{amazon_OurPrice}
</div>
<div class="amazontext">
{amazon_comment}
</div>
</div>

</div>

<h2>Other</h2>
<ul>
<li><a href="./admin/">管理者ページ</a></li>
<li><a href="./?mode=rss">RSS1.0</a></li>
<li><a href="./?mode=atom">Atom0.3</a></li>
<li><a href="https://jugem.jp/">Powered by "JUGEM"</a></li>
</ul>

<h2>Sponsored Link</h2>
<div class="centering">
{ad}
</div>

</div>

<div id="main">


<div class="entry">
<h3>{entry_date} {entry_time}</h3>
<div class="author">{user_name}</div>
<h4>{entry_title}</h4>
<div class="entryBody">{entry_description}</div>
<div class="entryMore"><a name="sequel"></a>
{entry_sequel}</div>
<div class="entryState"> | {comment_num} | {category_name} | {trackback_num}</div>
</div>

<div class="entry">
<a name="comments"></a>
<h4>Comments</h4>

<div class="entryBody">{comment_description}</div>
<div class="entryState"> {comment_name} | {comment_time}</div>


</div>

<div class="entry">
<h4>Comment form</h4>

<div class="commentform">
<form name="comment_area" action="./?mode=comment" method="post">
<input type="hidden" name="entry_id" value="{entry_id}" />
<div class="name"><label for="name">name</label><br>
<input type="text" tabindex="1" name="name" class="form" value="{cookie_name}" /></div>
<div class="email">
<label for="email">email</label><br>
<input type="text" tabindex="2" name="email" class="form" value="{cookie_email}" /></div>
<div class="url">
<label for="url">url</label><br>
<input type="text" tabindex="3" name="url" class="form" value="{cookie_url}" /></div>
<div class="comment">
<label for="description">comments</label><br />
<textarea tabindex="4" class="form" name="description" rows="10" cols="50" style="width:400px;"></textarea><br /><br />
<input tabindex="5" type="submit" value="Send!!" onclick="javascript:setval();" />
<input type="checkbox" name="set_cookie" value="1" id="set_cookie">
<label for="set_cookie">Cookieに登録</label></div>
</form>
</div>

</div>

<a name="trackback"></a>

<div class="entry">
<h4>Trackback URL</h4>
<input type="text" class="form" value="{trackback_url}" size="30">
</div>

<div class="entry">
<h4>Trackback</h4>

<h5>{trackback_title}</h5>
<div class="entryBody">{trackback_excerpt}</div>
<div class="entryState">{trackback_blog_name} | {trackback_time}</div>

</div>

<div class="entry">
<h4>Profile</h4>
<h5>{profile_name}</h5>
<div class="entryBody">{profile_description}</div>
</div>


<div class="centering">{prev_page_link}｜{page_now}/{page_num}PAGES｜{next_page_link}</div>

</div>

<div id="footer">
{copyright} 

　Desined by <a href="http://caramy.jugem.jp" target="_blank">Caramy</a>

　<a href="#top2">▲Top</a>
</div>

</div>


<div id="bottom"></div>

</div>

</div>

</BODY>
</HTML>

CSS

/* 全体の設定 */
*{margin:0;
padding:0;}
body{background-color:#ffffff;
	text-align: center;
	scrollbar-face-color:#ffffff;
	scrollbar-track-color:#ffffff;
	scrollbar-arrow-color:#ffc5e8;
	scrollbar-highlight-color:#ffffff;
	scrollbar-shadow-color:#ffc5e8;
	scrollbar-3dlight-color:#ffc5e8;
	scrollbar-darkshadow-color:#ffffff;
	font-size:12px;
	font-family:Century Gothic;
	color:#4f4f4f;
	letter-spacing:1px;
line-height:14pt;
	}
img{border:0;}
a{color:#4f4f4f;
	text-decoration:none;}
a:hover{color:#9d9d9d;}
ul {
    margin: 0px 0px 0px 10px;
    padding: 0px;
list-style-type: none;
}
#wrapper{padding:10px;}

/* 横幅700pxの設定 */
#layout,#top,#bottom{width: 700px;}
/* 横幅700pxの設定閉 */

#layout{ margin-left: auto;
		margin-right: auto;
		text-align: left;
		}
		
#top{background:transparent url(http://img-cdn.jg.jugem.jp/e4b/1424920/20090906_582282.gif) no-repeat 0 0;
	display: block;
	height: 45px;
	}
	
#middle{background-color:#ffc5e8;
		padding:10px 10px 0px 10px;
width:680px;}
* html #middle{width:700px;}
#side{width:170px;
	float:left;
	 margin-left: auto;
	margin-right: auto;}
#main{width:490px;
	float:right;
	margin-left: auto;
	margin-right: auto;}
#calender,#footer{width:680px;
		text-align:center;
		}
#calender{padding:5px 0px 5px 0px;
		font-size:9px;}
#calender a{color:#ff249c;
		text-decoration:none;
		font-weight:bold;}
#calender a:hover{font-size:12px;
		font-weight:bold;
				}
#footer{clear: both;
		padding:5px 0px 0px 0px;}
#bottom{background:transparent url(http://img-cdn.jg.jugem.jp/e4b/1424920/20090906_582283.gif) no-repeat 0 0;
	display: block;;
	height: 34px;
	}
/* 全体の設定閉 */
/* リンクピンクの設定 */ 
h1 a,#footer a,.author a,h3 a{color:#ff249c;
	text-decoration:none;}
h1 a:hover,#footer a:hover,.author a:hover,h3 a:hover{color:#ff85c8;}
/* リンクピンクの設定閉 */

/* サイトタイトル */ 
h1{color:#ff249c;
		width:680px;
		font-size: 20px;
		font-weight:bold;
		line-height:23px;
		padding:0px 0px 3px 0px;
		margin:0px;
		}
/* サイトタイトル閉 */

/* 説明文 */ 
#description{width:680px;
		padding:0px 0px 0px 15px;
		}
/* 説明文閉 */

/* sideタイトル */
h2{color:#ff249c;
	font-size:12px;
	font-weight:bold;
	line-height:13px;
	border-bottom:1px dashed #ff8aca;
	padding:0px 0px 3px 0px;
	margin:4px 0px 4px 0px;
	}
/* sideタイトル閉 */  
/* スクロール */
.scroll{
	scrollbar-face-color:#ffc5e8;
	scrollbar-track-color:#ffc5e8;
	scrollbar-arrow-color:#ff249c;
	scrollbar-highlight-color:#ffc5e8;
	scrollbar-shadow-color:#ff249c;
	scrollbar-3dlight-color:#ff249c;
	scrollbar-darkshadow-color:#ffc5e8;
height:50px; /* 高さ */
     overflow: auto; 
}
/* スクロール閉 */
/* amazonスクロール */
.amazon_scroll{height:200px; /* 高さ */
     			overflow-y: auto; 
     			overflow-x:hidden;
scrollbar-face-color:#ffc5e8;
	scrollbar-track-color:#ffc5e8;
	scrollbar-arrow-color:#ff249c;
	scrollbar-highlight-color:#ffc5e8;
	scrollbar-shadow-color:#ff249c;
	scrollbar-3dlight-color:#ff249c;
	scrollbar-darkshadow-color:#ffc5e8;
}
/* amazonスクロール閉 */

/* その他設定 */
.amazonbox{width:160px;
		}
.amazonimage{width:70px;
			float:left;
			}
.amazontext{width:75px;
			float:right;}
.centering{text-align:center;}
/* その他設定閉 */

/* 日時 */
h3{color:#ff249c;
	font-size:12px;
	font-weight:bold;
	border-bottom: 1px dashed #ff8aca;
	text-align:right;
	width:480px;
	padding:0px 10px 3px 0px;
	margin:0px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width:470px;
	}
html>body h3 {width:470px;}

/* 日時閉 */ 
/* 記事タイトル */
h4{background: url(http://img-cdn.jg.jugem.jp/e4b/1424920/20090906_582410.gif) no-repeat 0% 50%;
	color:#ff249c;
	font-size:13px;
	line-height:20px;
	padding:0px 0px 0px 17px;
	margin:0px 0px 5px 0px;
	} 
/* 記事タイトル閉 */ 
.author,.entryState{font-size:9px;
				text-align:right;
				width:480px;
				padding:0px 10px 0px 0px;
				voice-family: "\"}\"";
				voice-family:inherit;
				width:470px;
				}
html>body .author,.entryState{width:470px;}

.entryBody,.entryMore{width:490px;}

.entryMore{padding:5px 0px 0px 10px;
		voice-family: "\"}\"";
		voice-family:inherit;
		width:480px;
		}
html>body .entryMore{width:480px;}

.commentform{width:480px;}
.form{border:1px dashed #ff8aca;
	background-color:transparent;
	margin:2px;
	padding:1px;
	font-size:10px;
	line-height:13px;
	font-family:Century Gothic;
	color:#4f4f4f;
	letter-spacing:1px;
	}
.name{float:left;}
.email{float:left;}
.comment{clear: both;}
h5{color:#ff249c;
	font-weight:bold;
	font-size:12px;
	margin:3px 0px 5px 0px;}
.entry{width:490px;
	padding:5px 0px 5px 0px;
	}

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