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

ホーム

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

テンプレート名 : pop'n

HTML・CSSをコピーして使う

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<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}" />
</head>

<body>

<div id="header">
<h1 class="site_title" id="top" name="top">{blog_name}</h1>

<h2 class="description">{blog_description}</h2>
<div class="line"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20080601_556075.gif" /></div>
</div>

<div class="calendar">
{calendar_horizontal}
</div>

<div id="main">

<div class="entry">
<div class="entry_date">{entry_date}</div>
<div class="entry_title">
{entry_title}</div>
<div class="entry_body">{entry_description}</div>
<div class="entry_more">

<a href="./?eid={entry_sequel_id}#sequel">Read more ?</a>


{entry_sequel_text}

</div>
<p class="entry_state">Posted by {user_name} at {entry_time} | {category_name} | {comment_num}</p>
</div>

<div id="navipage">{prev_page_link} New Entries | {page_now} / {page_num} | Old Entries {next_page_link}</div>

<a name="comments"></a>
<div class="entry">
<div class="comment_title"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20080601_556065.gif" /> コメント</div>

<div class="entry_body">{comment_description}</div>
<p class="entry_state">{comment_name} | {comment_time_24}</p>

<div class="comment_title"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20080601_556065.gif" /> コメントする</div>
<div class="entry_body">
<form action="./?mode=comment" method="post">
<input type="hidden" name="entry_id" value="{entry_id}" />
<label for="name">name:</label><br />
<input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" /><br />

<label for="url">url:</label><br />
<input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" /><br />
<label for="description">comments:</label><br />
<textarea tabindex="4" id="description" name="description"></textarea><br /><br />
<input type="submit" value="-OK-" />
<input type="checkbox" name="set_cookie" value="1" id="set_cookie">
<label for="set_cookie">Cookieに登録</label>
</form>

</div>
</div>

<a name="trackback"></a>
<div class="entry">
<div class="trackback_title"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20060322_149940.gif" /> この記事のトラックバックURL</div>
<div class="trackback_url">{trackback_url}</div>
<div class="trackback_title"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20060322_149940.gif" /> トラックバック</div>

<div class="entry_title">{trackback_title}</div>
<div class="entry_body">{trackback_excerpt}</div>
<p class="entry_state">{trackback_blog_name} | {trackback_time_24}</p>

</div>

<div class="entry">
<div class="comment_title"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20080601_556065.gif" /> Profile</div>
<div class="entry_title">{profile_name}</div>
<div class="entry_body">{profile_description}</div>
</div>

</div>

<div id="side">

<h3 class="linktitle">Recent Entries</h3>
<div class="linktext">
{selected_entry_list}
</div>

<h3 class="linktitle">Categories</h3>
<div class="linktext">
{category_list}
</div>

<h3 class="linktitle">Archives</h3>
<div class="linktext archives">
<div id="archive">
{archives_list}
</div>
</div>

<h3 class="linktitle">Recent Comment</h3>
<div class="linktext text_s">
{recent_comment_list}
</div>

<h3 class="linktitle">Recent Trackback</h3>
<div class="linktext text_s">
{recent_trackback_list}
</div>

<h3 class="linktitle">Bookmarks</h3>
<div class="linktext">
{link_list}
</div>

<h3 class="linktitle">Recommend</h3>
{amazon_item}

<h3 class="linktitle">Profile</h3>
<div class="linktext">
{user_list}
</div>

<h3 class="linktitle">{freespace_title1}</h3>
<div class="linktext text_s">
{freespace_contents1}
</div>

<form method="get" action="">
<div class="search">Search this site.<br />
<input id="search" name="search" class="form" /> <input type="submit" value="Search" class="button" />
</div>
</form>

<div class="linktext">
<ul>
<li><a href="./admin/" target="top">Login</a></li>
<li><a href="./?mode=rss">RSS1.0</a></li>
<li><a href="./?mode=atom">Atom0.3</a></li>
<li><a href="http://nyanchu.jugem.cc/">Designed by fs*</a></li>
</ul>
</div>

{ad}

</div>

<div id="footer">
<div class="line"><img src="http://img-cdn.jg.jugem.jp/5f2/72048/20080601_556075.gif" /></div>
<p class="copyright">{copyright}</p>
<p class="pagetop"><a href="#top">▲ PAGE TOP ▲</a></p>
</div>

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

CSS

/*============= Designed by fs* [ http://nyanchu.jugem.cc/ ] ==============*/

/*=================================

基本構造
 共通設定
 記事装飾
 タイトル
 エントリー記事
 コメント・トラックバック
 サイドバー・リンク
 カレンダー
 フッター・著作権

===================================*/

/*===============================　基本構造　============================*/

body { margin: 0em ; padding: 0em; color: #888; 
text-align: center;
background-color: #fff;
background-image: url("http://img-cdn.jg.jugem.jp/5f2/72048/20060322_149941.jpg");
background-position: 10% 10%; }

#wall { width: 73%; margin: 0em auto;
border-right: 1px solid #d5d5d5; 
border-left: 1px solid #d5d5d5; 
text-align: left;
background-color: #fff; }

#header { width: 100% auto; margin: 0em anto; }

#main { width: 69%; float: left; margin: 0em auto; }

#side { width: 27%; float: right; margin: 0em auto; }

#footer { clear: both; }

/*==============================　共通設定　==============================*/

html {
scrollbar-track-color:      #e7f3ff; 
scrollbar-face-color:       #fff;
scrollbar-shadow-color:     #fff;
scrollbar-darkshadow-color: #fff;
scrollbar-highlight-color:  #fff;
scrollbar-3dlight-color:    #fff;
scrollbar-arrow-color:      #fdd66d; }

a         { color: #f18c9a; text-decoration: none; }
a:link    { color: #f18c9a; }
a:visited { color: #f18c9a; }
a:active  { color: #f18c9a; }
a:hover   { color: #ffbf56; border-bottom: 1px dotted; }

a[name]:hover { color: #ccc; background: transpapers; }

input,botton,textarea { font-size: 95%; 
font-family: "Verdana","ＭＳ Ｐゴシック","Osaka",sans-serif; 
color: #88acd5; 
padding: 0.2em;
border: solid 1px #ccc;
background-color: #fff; }

form { margin: 0em; }

.button { font-size: 0.8em; padding: 0.13em 0em; }

h1,h2,h3,h4,h5,h6 { font-size: 80%; margin: 0em; padding: 0em; }

hr { height: 1px;
border-top: 0px;
border-right: 0px;
border-bottom: 1px dotted #d5d5d5;
border-left: 0px;
margin: 0.6em 0em 0.3em 0em; }

.line { margin: 0em;
background: url("http://img-cdn.jg.jugem.jp/5f2/72048/20060721_218923.gif") repeat-x bottom ;
text-align: right;
padding-right: 1em; }

code { font-size: 95%;
font-family: "Verdana","Lucida Sans Unicode","Arial","Chicago",Osaka,sans-serif; }

cite { font-size: 100%; color: #999;
font-family: "Lucida Sans Unicode",Osaka,sans-serif;
font-style: normal;
padding: 1em 0.1em; }

#navipage { font-size: 70%; color: #888;
text-align: center;
font-family: "Verdana","Osaka",sans-serif;
padding: 2em 1em ; }

blockquote { margin: 0.7em 0.2em;
padding: 0.25em 0.2em 0.25em 0.7em;
border-left: 3px solid #dcdcdc; }

/*============================　記事装飾　===============================*/

.pink   { color: #ef7585; }
.blue   { color: #66b7be; }
.gray   { color: #aaa; }
.strong { font-weight: bold; }

.a { font-size: 95%;
font-family: "Verdana","Lucida Sans Unicode","Arial","Chicago",Osaka,sans-serif; }

div.pre { white-space: pre; }

.entry p { padding: 0.25em 0em 0.6em 0em; margin: 0.05em 0em;
clear: both; }

.pict { border: 1px solid #ccc; 
margin : 0.1em 0.5em 0.2em 0.4em; }

.c { clear: left; }

.text_center { text-align: center; }
.text_right  { text-align: right; }
.text_left   { text-align: left; }

.strong { font-weight: bold; }

.waku { border: 1px solid #dcdcdc;
background-color: #fff;
padding: 0.8em 0.8em ;
margin: 0.5em 0em; }

li.check_a{ padding-left: 1.5em; 
background:url("check02a.gif") no-repeat 0em 0.1em ; }

li.check_b{ padding-left: 1.5em; 
background:url("check02b.gif") no-repeat 0em 0.1em ; }

/*============================　ヘッダー　============================*/

.site_title a         {color: #bbb; text-decoration: none; }
.site_title a:link    {color: #bbb; text-decoration: none; }
.site_title a:visited {color: #bbb; text-decoration: none; }
.site_title a:active  {color: #bbb; text-decoration: none; }
.site_title a:hover   {color: #bbb; text-decoration: none; }

.site_title { padding: 1.2em 1em 0.8em 1em ;
font-family: "Lucida Sans Unicode","Verdana","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック", "Osaka‐等幅",sans-serif;
font-size: 150%;
font-weight: bold;
color: #bbb;  }

.description { font-size: 70%; color: #888; 
background: url() repeat-x bottom;
padding: 0em 2em 0.5em 2em ; 
font-weight: normal ;
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Osaka",sans-serif; }

/*=========================　エントリー記事本文　=========================*/

.entry { margin: 0em; padding: 0em; color: #888;
font-family: "Verdana","ＭＳ Ｐゴシック","Osaka",sans-serif; }

.entry_date { font-size: 70%; color: #aaa;
width: 100%;
font-weight: nomal; 
text-align: right;
border-bottom: 1px dotted #d5d5d5;
padding: 0.3em 0em ; }

.entry_title { font-size: 80%; color: #888;
font-weight: normal;
padding: 1.5em 1em 1.5em 5.5em;
background: url('http://img-cdn.jg.jugem.jp/5f2/72048/20080601_556065.gif') no-repeat 1.2em 1.4em; }

.entry_body { font-size: 75%;
line-height: 150%;
padding: 0em 0.9em 0.5em 1.8em; }

.entry_author {  }

.entry_more { font-size: 75%; clear: left;
margin: 0.9em 0em ;
line-height: 160%;
padding-left: 1.8em; }

p.entry_state { font-size: 70%; color: #aaa;
text-align: right;
padding: 0.2em 0em 2.3em 1em; }

.entry ul { margin: 0em; padding: 0em; list-style: none; }

.entry li{ padding-left: 1.2em;
background: url("http://img-cdn.jg.jugem.jp/5f2/72048/20060712_214274.gif") no-repeat 0.2em 0.6em ; }

/*============================　コメント　============================*/

.comment_title { font-size: 75%; color: #999;
font-family: "Lucida Sans Unicode","Verdana","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Osaka",sans-serif;
font-weight: normal; 
text-align: right;
border-bottom: 1px dotted #d5d5d5;
padding: 0.2em 0.5em ;
margin-bottom: 1.2em; }

#description { padding: 1%; width: 80%; height: 120px; }
#name  { width: 40%; }
#email { width: 40%; }
#url   { width: 60%; }

.trackback_url { font-size: 70%; padding: 1.5em; }

.trackback_title { font-size: 75%; color: #999;
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Osaka",sans-serif;
font-weight: normal;
text-align: right;
padding: 0.2em 0.5em;
border-bottom: 1px dotted #d5d5d5; }

/*========================　サイドバー・リンク　========================*/

.linktitle { font-size: 80%; color: #bbb;
font-family: "Lucida Sans Unicode","Verdana",'Osaka',sans-serif;
font-weight: bolder;
border-bottom : 1px dotted #d5d5d5;
margin-top: 0.2em;
padding-bottom: 0.1em ; }

.linktext { font-size: 70%; color: #aaa;
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","Osaka",sans-serif;
line-height: 170%;
margin-right: 0.7em;
padding: 0.6em 0em 1em 0em; }

.text_s { font-size: 65%; line-height: 150%; }

.linktext ul { margin: 0em; padding: 0em;
list-style: none; }

.linktext li{ padding-left: 15px;
text-valign: middle;
background: url("http://img-cdn.jg.jugem.jp/5f2/72048/20060322_149942.gif") no-repeat 0em 0.42em ; }

.linktext img { border: none; margin: 0em 0.2em; }

.archives { padding-top: 0.9em; margin-left: -0.81em; }

#archive { overflow: auto; 
height: 9em; width: auto;
margin: 0em; padding: 0em 0.8em ;
line-height: 150%; }

.amazon_text { font-size: 80%;
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ ゴシック","Osaka",sans-serif;
line-height: 140%; }

.amazon { font-size: 75%; color: #aaa; padding: 1em 0.5em ; }

.search { font-size: 70%; color: #aaa;
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ ゴシック","Osaka",sans-serif;
line-height: 170%;
padding: 0.7em 0.1em; }

.form { width: 65%; }

#ad { padding: 2.5em 0.5em; color: #aaa; font-size: 75%; }

/*=============================　カレンダー　============================*/

.calendar { font-size: 70%; color: #888;
font-family: "Verdana","Osaka",sans-serif;
text-align: center;
word-spacing: 0.15em;
font-weight: normal;
padding: 0.7em 0.4em 1.2em 0.4em; }

.cell { width: 3em;
margin-left: 0;
padding: 0em; }

/*=============================　フッター　==============================*/

#footer { padding: 0.4em 0em 1.2em 0em; 
margin-top: 1em; width: 100%;
border-top: 0px solid #aaa; 
text-align:center; }

p.copyright { font-size: 70%;
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ ゴシック","Osaka",sans-serif;
color: #888;
line-height: 140%;
padding: 0em 1em; }

p.pagetop { font-size: 70%; 
font-family: "Verdana","ヒラギノ角ゴ Pro W3","ＭＳ ゴシック","Osaka",sans-serif; }

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