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

ホーム

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

テンプレート名 : moblog

HTML・CSSをコピーして使う

HTML

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset={site_encoding}" />
<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}" />

</head>

<p style="display: none;">{blog_name}{blog_description}</p>

<div id="contents">

<div id="header">

<table width="100%">
<tr>
<td>
<h1><a href="http://daiskip.com/" accesskey="1">daiskip.com</a></h1>

<form method="get" action="http://www.google.co.jp/custom" target="_top" class="google">
<a href="http://www.google.co.jp/">Google</a>
<input type="hidden" name="domains" value="daiskip.com" />
<input type="text" name="q" size="31" maxlength="255" value="" class="words" />
<input type="submit" name="sa" value="SEARCH" class="button" />
<input type="radio" name="sitesearch" value="" class="check" id="web" /><label for="web">WWW</label>
<input type="radio" name="sitesearch" value="daiskip.com" checked="checked" class="check" id="daiskip" /><label for="daiskip">daiskip.com</label>
<input type="hidden" name="client" value="pub-3791197185218818"></input>
<input type="hidden" name="forid" value="1"></input>
<input type="hidden" name="ie" value="UTF-8"></input>
<input type="hidden" name="oe" value="UTF-8"></input>
<input type="hidden" name="cof" value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1;"></input>
<input type="hidden" name="hl" value="ja"></input>
</form>

</td>

</div>

<ul id="nav">
	<li id="nav_home"><a href="http://daiskip.com/">HOME</a></li>
	<li id="nav_blog"><a href="http://daiskip.com/blog/">BLOG</a></li>
	<li id="nav_moblog"><a href="http://daiskip.jugem.jp/">MOBLOG</a></li>
	<li id="nav_review"><a href="http://daiskip.com/review/">REVIEW</a></li>
	<li id="nav_bookmark"><a href="http://daiskip.com/bookmark/">BOOKMARK</a></li>
	<li id="nav_link"><a href="http://daiskip.com/link/">LINK</a></li>
	
	<li id="nav_about"><a href="http://daiskip.com/about/">ABOUT</a></li>
</ul>

<hr />

<div id="main">

<td>
<div class="footstamp">
<a href="http://daiskip.com">HOME</a> / <a href="http://daiskip.jugem.jp/">MOBLOG</a> / {entry_year}.{entry_month}
</div>
</td>

<div class="pagenavi">
{prev_page_link} <a href="./">page {page_now} / {page_num}</a> {next_page_link}
</div>

<div class="pagenavi">
{prev_entry} <a href="./">main</a> {next_entry}
</div>

</td>

</tr>

<tr>
<td colspan="2">

<div class="archives_list">
{archives_list}
</div>

</td>
</tr>
</table>
</div>

<div class="entry_area">
<p class="entry_date">{entry_date}</p>
<p class="entry_title"><a href="{entry_permalink}">{entry_title}</a></p>
<p class="entry_body">{entry_description}</p>
<p class="posted"><a href="{entry_permalink}">{entry_time}</a> | {comment_num} | {trackback_num}</p>
{trackback_auto_discovery}
<div id="edit_entry"></div>
</div>

<div id="comment_area">
<h2>Comment</h2>

<p class="comment_body">{comment_description}</p>
<p class="comment_posted">{comment_time} by {comment_name}</p>

<form action="./?mode=comment" method="post" style="font-size: x-small; font-weight: bolder; margin-top: 20px;">
<input type="hidden" name="entry_id" value="{entry_id}" />
<input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" style="width:180px;" /> : name<br />
<input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" style="width:180px;" /> : email<br />
<input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" style="width:180px;" /> : url<br />
<textarea tabindex="4" id="description" name="description" rows="10" cols="20" style="width:240px;"></textarea><br />
<input type="submit" value="コメント送信" />
<input type="checkbox" name="set_cookie" value="1" id="set_cookie" checked>
<label for="set_cookie">Cookieに登録</label>
</form>
</div>

<div id="trackback_area">
<h2>Trackback</h2>
<form style="margin-top: 20px;">
<input type="text" value="{trackback_url}" style="width: 240px;" />
</form>

<p>{trackback_blog_name}</p>
<p>{trackback_title}</p>
<p>{trackback_excerpt}</p>
<p class="posted">{trackback_time}</p>

</div>

</div>

<hr />

</div>

<div id="footer">
<div id="footer_navi"><a href="http://daiskip.com/">home</a> | <a href="#header">header</a> </div>
Feeds : <a href="http://daiskip.com/atom.xml">Atom</a> , <a href="http://daiskip.com/index.xml">RSS 2.0</a><br />
Powered by <a href="http://www.movabletype.jp/">Movable Type 3.11-ja</a> , <a href="http://www.flickr.com">flickr</a> , <a href="http://del.icio.us/">del.icio.us</a> , <a href="http://b.hatena.ne.jp/">hatena bookmark</a><br />
&copy; <a href="mailto:mail@daiskip.com" title="mailto">daiskip</a> | <a href="https://admin.heteml.jp/">SERVER</a> | <a href="http://analyze.daiskip.com/">ANALYZE</a> | <a href="http://daiskip.com/mt/mt.cgi">ADMIN</a>
</div>

</div>

</body>
</html>

CSS

.archives_list {
	}
.archives_list ul {
	margin: 0 0 20px 10px;
	padding: 0 0 0 0;
	}
.archives_list li {
	font-size: x-small;
	list-style-type: none;
	display: block;
	float: left;
	margin: 0 0 5px 0;
	padding: 0 0 0 0;
	}
.archives_list li a {
	margin: 0 0 0 0;
	padding: 0 0 0 10px;
	}

/* common
--------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	}

body {
	color: #333;
	font-family: "arial", "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka‐等幅";
	background: #E2E4E0 url(http://daiskip.com/img/background/body.gif) repeat-y center;
	}

p {
	margin: 10px 0;
	}

hr {
	display: none;
	}

a {
	text-decoration: underline;
	color: #000;
	}

a:link {
	text-decoration: underline;
	color: #000;
	}

a:visited {
	text-decoration: underline;
	color: #666;
	}

a:hover,
a:active {
	text-decoration: none;
	color: #009DE0;
	background: #EEE;
	}

/* layout
--------------------------------------------------------*/

#layout {
	width: 1000px;
	margin: 0 auto;
	}

#header {
	padding: 10px 20px;
	}

#nav {
	}

#contents {
	}

#main {
	width: 720px;
	float: left;
	clear: left;
	}

#side {
	font-size: x-small;
	width: 280px;
	float: right;
	clear: right;
	}

#footer {
	clear: both;
	padding: 20px;
	}

/* Header
-------------------------------------- */

#header h1 {
	font-size: 20px;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 10px 0;
	}
#header h1 a,
#header h1 a:link,
#header h1 a:hover,
#header h1 a:visited,
#header h1 a:active  {
	color: #597EA7;
	text-decoration: none;
	}

#header h2 {
	font-size: x-small;
	font-weight: bolder;
	padding: 0 0 10px 0;
	}

#header h3 {
	font-size: x-small;
	font-weight: bolder;
	padding: 0 0 10px 0;
	}

#header .google {
	font-size: 10px;
	}
#header .google .words {
	border: 1px solid #CCC;
	padding: 2px;
	background: #EEE;
	font-size: 11px;
	margin-left: 5px;
	width: 100px;
	}
#header .google .button {
	background: #CCC;
	border: 1px solid #666;
	font-size: 11px;
	margin: 0 5px 0 3px;
	padding-top: 1px;
	}
#header .google .ckeck {
	border: none;
	}
#header .google label {
	margin: 0 5px 0 2px;
	}

#nav {
	float: left;
	width: 996px;
	margin: 0 0 20px 2px;
	padding: 0;
	list-style: none;
	font-size: 11px;
	border-top: 1px solid #FFF;
	background: #6295CE;
	}
#nav li {
	float: left;
	margin: 0 1px 0 0;
	padding: 0 0 0 0;
	background: #5588C1;
	list-style: none;
	}
#nav a {
	float: left;
	padding: 7px 13px;
	text-decoration: none;
	border-bottom: none;
	color: #fff;
	}
#nav a:hover, #nav a.active {
	color: #fff;
	background: #235C9D;
	}
#nav a.active {
	font-weight: bold;
	}

body#index #nav_home,
body#blog #nav_blog,
body#blog_index #nav_blog,
body#individual #nav_blog,
body#moblog #nav_moblog,
body#review #nav_review,
body#bookmark #nav_bookmark,
body#link #nav_link {
	text-decoration: none;
	background: #3D3D3D;
	color: #FFF;
	}

/* Main
-------------------------------------- */

.ads {
	margin: 0 0 35px 35px;
	}

.footstamp {
	font-size: 11px;
	font-family: Georgia, "Times New Roman", Times, serif;
	margin: 0 0 0 20px;
	}

.pagenavi {
	font-size: x-small;
	margin: 0 0 0 0;
	}

#main .entry { /* entry area */
	}

#main .entrybody { /* body */
	font-size: small;
	line-height: 160%;
	margin: 10px 20px;
	}

#main p img {
	margin: 10px 0;
	border: 1px solid #CCC;
	padding: 5px;
	background: #FFF;
	}

#main h2 { /* date */
	font-size: xx-small;
	font-weight: bolder;
	margin: 0 20px;
	}

#main h3 { /* title */
	font-size: medium;
	font-weight: bolder;
	margin: 10px 20px;
	padding: 0px 0px 5px 0px;
	border-bottom: 1px dotted #CCC;
	}
#main h3 p.url {
	font-size: xx-small;
	color: #CCC;
	margin: 2px 0 0 0;
	}
#main h3 p.url a {
	text-decoration: none;
	background-color: #F1F1F1;
	}

#main blockquote {
	line-height: 150%;
	border-left: 3px solid #CCC;
	margin: 10px 10px 10px 0;
	padding: 10px;
	background: #EEE;
	}
#main blockquote p {
	margin: 10px 0;
	}

#main p.extended {
	font-size: x-small;
	margin: 0 20px;
	}

#main p.posted {
	font-size: x-small;
	line-height: 150%;
	margin: 10px 20px 30px 20px;
	padding: 5px 0px 0px 0px;
	border-top: 1px dotted #CCC;
	clear: both;
	}

#main p.today {
	font-size: x-small;
	margin: 10px 20px;
	padding: 5px;
	border: 1px dotted #CCC;
	background: #EEE;
	}

/*FOOTER
-------------------------------------- */

#footer_navi {
	font-size: xx-small;
	float: right;
	}

#footer {
	font-size: x-small;
	line-height: 150%;
	}

/*MOBLOG
-------------------------------------- */

#moblog #main {
	width: 1000px;
	margin: 0 auto;
	padding: 0 0 0 20px;
	}

#moblog #main .pagenavi {
	font-size: 2em;
	font-family: Georgia, "Times New Roman", Times, serif;
	}

#moblog .entry_area img {
	margin: 0 0 20px 0;
	}
#moblog .entry_area .entry_date {
	font-size: x-small;
	margin: 0 0 10px 0;
	}
#moblog .entry_area .entry_title {
	font-size: medium;
	}

#moblog .entry_area .entry_body,
#moblog .entry_area p {
	font-size: x-small;
	margin: 0 0 10px 0;
	}

#moblog .entry_area .posted {
	font-size: x-small;
	margin: 0 0 0 0;
	}

#comment_area {
	width: 280px;
	float: left;
	margin: 0 20px;
	}

#comment_area h2 {
	border-top: 3px solid #009DE0;
	margin: 0 0 0 0;
	padding: 10px 0 0 0;
	}

#comment_area .comment_body {
	font-size: small;
	margin: 10px 0;
	}

#comment_area .comment_posted {
	font-size: x-small;
	border-top: 1px dotted #CCC;
	padding: 5px 0 0 0;
	}

#trackback_area {
	width: 280px;
	float: left;
	margin: 0 20px;
	}

#trackback_area h2 {
	border-top: 3px solid #009DE0;
	margin: 0 0 0 0;
	padding: 10px 0 0 0;
	}

#trackback {
	font-size: x-small;
	margin: 50px 0px 0px 0px;
	padding: 10px 0px 0px 0px;
	border-top: 1px dotted #CCC;
	}

.trackback_url {
	font-size: xx-small;
	margin-left: 20px;
	}

.trackback_list {
	font-size: x-small;
	line-height: 150%;
	margin-left: 20px;
	}

/*index, monthly*/

body.index .entry_area,
body.month .entry_area,
body.page .entry_area,
body.search .entry_area {
	width: 200px;
	height: 350px;
	float: left;
	margin: 0 20px 0 20px;
	font-size: x-small;
	overflow: auto;
	}

body.index .entry_area .pict,
body.month .entry_area .pict,
body.page .entry_area .pict,
body.search .entry_area .pict {
	width: 120px;
	height: 160px;
	margin: 0 0 10px 0;
	border: 1px solid #666;
	}

/*individual*/
body.eid .entry_area {
	width: 280px;
	float: left;
	margin: 0 20px;
	font-size: x-small;
	}
body.eid .entry_area .entry_date {
	border-top: 3px solid #009DE0;
	margin: 0 0 0 0;
	padding: 10px 0 0 0;
	}
body.eid .entry_area .pict {
	margin: 0 0 10px 0;
	border: 1px solid #666;
	}

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