Bloggerのメモ: 1月 2006

NovuさんのWordPress用テンプレートをBlogger用に改造したもの。
※再配布の許可をもらいました。
※テンプレート下部の作者情報は削除してはいけません。

画像などはこちらで
Download KASANE 1.1

＃1/30　引用先のものをそのままコピペした為、問題が多々。修正はしたものの納得はしてない。（使ってみないと分からない）
＃Searchがどうしても分からなかった。分かる人は自分で編集してください。
＃<style type="text/css">は、<link rel="stylesheet" href="CSSを置いている場所" type="text/css" >でもイイです。

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

<head>
<$BlogMetaData$>
<meta name="keywords" content="<$BlogTitle$>" />
<meta name="description" content="<$BlogTitle$>" />

<title><$BlogPageTitle$></title>

<style type="text/css">
#b-navbar {

height:0px;

visibility:hidden;

display:none

}

/*
Theme Name: KASANE
Theme URI: http://www.napdays.com/download/kasane/
Description: WordPress theme KASANE
Version: 1.1
Author: Novu
Author URI: http://www.napdays.com/
*/

/*INDEX
-------------------------------------------------
BASE
HEADER
CONTENT
SIDE BAR
COMMENT
CALENDAR
FOOTER
*/

/*BASE
-------------------------------------------------*/
body {
margin: 0;
padding: 0;
background: #eeeeee;
color: #333333;
text-align: center;
}

#page {
width: 760px;
margin: 0 auto;
padding: 30px 0 0 0;
background: url(/images/wrapper-bg.png) repeat-y;
_background: url(/images/wrapper-bg.gif) repeat-y;
text-align: left;
}

h1, h2, h3, h4, h5 {
font-family: "Trebuchet MS", Chicago, sans-serif;
font-size: 100%;
}

body, div, p, table, th, tr, td,
ol, ul, li, dl ,dt, dd, input, select, textarea, label, legend,
addres, abbr, blockquote {
font-family: Verdana, sans-serif;
font-size: 100%;
}

pre, code, kbd {
font-family: monospace;
font-size: 100%;
}

img { border: none; }

a:link{ color: #336699; }
a:visited{ color: #6699cc; }
a:hover{ color: #cc6666; }
a:active{ color: #cc6666; }

input, textarea {
margin: 0 0 3px 0;
padding: 2px;
border-top: 1px solid #999999;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
border-left: 1px solid #999999;
}

input#submit {
padding: 2px 5px;
border-top: 1px solid #cccccc;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999;
border-left: 1px solid #cccccc;
background: #cccccc;
}

hr { display: none; }

/*HEADER
-------------------------------------------------*/

#header {
width: 750px;
height: 150px;
margin: 0px 5px;
padding: 0;

background: #cccccc url(/images/header-bg-blue.gif) no-repeat;
/*
background: #cccccc url(/images/header-bg-green.gif) no-repeat; */
/*
background: #cccccc url(/images/header-bg-red.gif) no-repeat; */
/*
background: #cccccc url(/images/header-bg-gray.gif) no-repeat; */
}

#header h1 {
margin: 0;
padding: 50px 0 0 20px;
color: #ffffff;
font-size: 200%;
}

.description {
padding-left: 20px;
color: #ffffff;
font-size: 80%;
text-align: left;
}

#header a:link,
#header a:visited {
color: #ffffff;
text-decoration: none;
}

/*CONTENT
-------------------------------------------------*/

#content {
display: inline;
font-size: 80%;
}

.narrowcolumn {
float: left;
width: 510px;
margin: 30px 20px 0px 25px;
padding: 0 0 20px 0;
}

.widecolumn {
width: 600px;
margin: 0 100px;
padding: 20px 0;
background: #ffffff;
}

.navigation {
margin: 0 0 20px 0;
padding: 0;
text-align: center;
}

.navigation .alignright {
float: right;
margin: 0;
padding: 0;
}

.navigation .alignleft {
float: left;
margin: 0;
padding: 0;
}

.clear {
clear: both;
margin: 0;
padding: 0;
}

.post {
margin: 0 0 40px 0;
}

h2.pagetitle {
margin: 0 0 20px 0;
padding: 0;
color: #666;
font-size: 120%;
letter-spacing: 1px;
}

.post h2 {
margin: 0 0 5px 0;
padding: 0;
border-bottom: 1px solid #ddd;
font-size: 125%;
}

.post h2 a:link,
.post h2 a:visited { color: #666666; text-decoration: none; }
.post h2 a:hover,
.post h2 a:active { color: #cc6666; }

.smaller {
font-size: 87.5%;
}

.data {
margin: 0;
color: #666;
font-size: 87.5%;
}

.entry {
margin: 1.5em 0;
}

.entry * {
color: #4d4d4d;
line-height: 160%;
}

.postfooter {
margin: 1em 0 40px 0;
text-align: right;
}

.postmetadata {
clear: both;
margin: 1em 0 40px 0;
padding: 10px;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
font-size: 87.5%;
text-align: left;
line-height: 150%;
}

/* ENTRY TAG */

img.alignright {
margin: 0 0 3px 5px;
}

img.alignleft {
margin: 0 5px 3px 0;
}

.alignright {
float: right;
}

.alignleft {
float: left
}

.entry ul,
.entry ol {
list-style-position : inside;
margin: 1em;
padding: 0;
}

.entry blockquote {
clear: both;
margin: 2em 1em;
padding: 1em;
background-color: #f7f7f7;
border-top: 1px double #eee;
border-bottom: 1px double #eee;
}

.entry blockquote p {
margin: 0;
}

pre {
overflow: auto;
width: auto !important;
width: 98%; /* for IE */
margin: 1em;
padding: 10px 10px 15px 10px;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
background: #f7f7f7;
font-family: monospace;
}

.entry code {
font-family: 'Courier New', Courier, monospace;
}

/*SIDE BAR
-------------------------------------------------*/

#sidebar {
display: inline;
float: right;
width: 200px;
margin: 30px 5px 20px 0px;
padding: 0;
font-size: 80%;
}

#sidebar a { text-decoration: none; }

#sidebar h2 {
margin: 0 0 0.5em 0;
padding: 2px 20px;
background: #f7f7f7;
color: #808080;
font-weight: bold;
line-height: 1.5em;
}

#sidebar ul {
list-style-type: none;
margin: 0;
padding: 0;
line-height: 150%;
}

#sidebar ul li ul {
margin: 0 20px 20px 20px;
}

#sidebar ul.children,
#sidebar li.pagenav ul ul {
margin: 0;
}

#sidebar ul.children li,
#sidebar li.pagenav ul ul li {
margin: 0;
margin-left: 1em;
}

#searchform {
width: 150px;
margin: 10px 20px 20px 20px;
padding: 0;
}

#sidebar #searchform #s {
display: block;
width: 150px;
margin: 0 0 3px 0;
padding: 2px;
border-top: 1px solid #999999;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
border-left: 1px solid #999999;
background: #fcfcfc;
}

#sidebar #searchsubmit {
margin: 0;
padding: 2px 5px;
border-top: 1px solid #cccccc;
border-right: 1px solid #999999;
border-bottom: 1px solid #999999;
border-left: 1px solid #cccccc;
background: #cccccc;
}

/*CALENDAR
-------------------------------------------------*/

#wp-calendar {
width: 160px;
margin: 0 20px 20px 20px;
border-collapse: collapse;
border: 1px solid #ddd;
color: #666666;
text-align: center;
font-size: 87.5%;
}

#wp-calendar {
line-height: 1.8em;
}

#wp-calendar thead {
border: 1px solid #ddd;
}

#wp-calendar tbody {
border: 1px solid #ddd;
}

#wp-calendar tfoot {
border: 1px solid #ddd;
}

#wp-calendar td,
#wp-calendar th {
line-height: 160%;
text-align: center;
border: 1px solid #ddd;
}

#wp-calendar td#today {
border: 1px solid #cccccc;
background: #eee;
}

#wp-calendar th[abbr="Sunday"] {
color: #6699cc;
}

#wp-calendar th[abbr="Saturday"] {
color: #cc6666;
}

#wp-calendar a {
display: block;
text-decoration: none;
}

/*COMMENT
-------------------------------------------------*/

h3.respond {
color: #666666;
font-size: 100%;
}

#commentform {
width: 100%;
}

#commentform p {
font-size: 100%;
}

#commentform input,
#commentform textarea {
font-size: 100%;
}

h3#comments {
margin: 0 0 10px 0;
}

ol.commentlist {
list-style-position: inside;
margin: 0 0 40px 0;
padding: 0;
border-top: 1px solid #eee;
}

.commentlist li {
padding: 10px;
border-bottom: 1px solid #eee;
text-align: left;
}

.alt {
background-color: #f7f7f7;
}

.commentlist cite,
.commentlist cite a {
font-style: normal;
text-decoration: none;
}

.commentlist p {
line-height: 150%;
}

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

#footer {
clear: both;
width: 510px;
margin: 0 20px 0 25px;
padding: 0;
border-top: 1px solid #ddd;
background: transparent;
font-size: 80%;
}

#footer p {
margin: 0;
padding: 20px 0;
line-height: 150%;
}

</style>

<script type="text/javascript">

function sh (id) {

whichpost = document.getElementById(id);

if (whichpost.className=="show") {
whichpost.className="hide";
}
else {
if (whichpost.className=="hide") {
whichpost.className="show";
}
}
}

<ItemPage>
var hasChanged = 0;
var hostName = 'blogspot.com';

function setCookie (name, value, expires) {
document.cookie = name + '=' + escape(value) + '; expires=' + expires.toGMTString() + '; domain=' + hostName + '; path=/';
}

function getCookie (name) {
var key = name + '=';
var c = document.cookie;
var i = c.indexOf(key);
if (i < 0) return '';
var j = c.indexOf(';', i + key.length);
if (j < 0) j = c.length;
return unescape(c.substring(i + key.length, j));
}

function rememberMe (f) {
var now = new Date();
now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
setCookie('author', f.anonName.value, now);
setCookie('site', f.anonURL.value, now);
}

function setFormValues (f) {
f.anonName.value = getCookie("author");
f.anonURL.value = getCookie("site");
}

function doLoaded () {
if (!document.frmComment) return;
setFormValues(document.frmComment);
if (document.frmComment.anonName.value)
document.frmComment.rememberInfo.checked = 1;
}
onload = doLoaded;

function escapeQuotes(text) {

text=text.replace(/'/g,"\\'");
text=text.replace(/\n/g,"\\n");
return text;
}

//Preview
function PreviewpostBody(){
if (cFrm.postBody.value=='') return;
var preview=window.open('','Preview','width=500,height=200');preview.document.open();
var text=cFrm.postBody.value;while(text.indexOf("\n") > -1)
text=text.replace("\n","<br/>");
preview.document.write('<html><style>*{font-size:11px;font-family:Verdana,Arial,Sans-Serif}<\/style><bo'+'dy>'+text+'<\/body><\/html>');
preview.document.close();
}
</ItemPage>
</script>

</head>
<body>

<div id="page">


<div id="header">
<h1><a href="<$BlogURL$>"><$BlogTitle$></a></h1>
<div class="description"></div>
</div>
<hr />

<div id="content" class="narrowcolumn">

<Blogger>



<div class="post">
<h2><a href="<$BlogItemUrl$>" title="Permanent Link to <$BlogItemTitle$>"><$BlogItemTitle$></a></h2>
<p class="data"><$BlogItemDateTime$></p>

<div class="entry">
<$BlogItemBody$>

<p class="postfooter">Posted by <$BlogItemAuthorNickname$></a>
<BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemPermalinkURL$>#comments"><$BlogItemCommentCount$> コメント</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">Links to this Post</a></font>
</BlogItemBacklinksEnabled>
<$BlogItemControl$>

</p>
</div>
　　　</div>




<ItemPage>

<div id="comments">

<BlogItemCommentsEnabled><a name="comments"></a>

<h2><$BlogItemCommentCount$> コメント</h2>

<dl id="comments-block">
<BlogItemComments>
<dt class="comment-data" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>
At <a href="#c<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>,
<$BlogCommentAuthor$> said...
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
</dl>

<p class="comment-timestamp">


<tr>
<h3 id="respond">コメントを投稿する</h3>
<form name="cFrm" id="cFrm" action="http://www.blogger.com/login-comment.do" method="post">
<div>
<input type="hidden" name="blogID" value="<$BlogID$>"/>
<input type="hidden" name="postID" value="<$BlogItemNumber$>"/>
<input type="hidden" name="isPopup" value="false"/>
<input type="hidden" name="iden" value="Other"/>
Name:<br />
<input type="text" name="anonName" maxlength="100" size="30" /><br />
Website:<br />
<input type="text" name="anonURL" maxlength="100" value="http://" size="30" /><br />
Comment:<br />
<textarea name="postBody" cols="40" rows="10"></textarea><br />
<script type="text/javascript">
//<![CDATA[
document.write('<input type="checkbox" id="remember"> Remember me<br \/>');
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var bgPosted = false;
var cFrm = document.getElementById('cFrm');
cFrm.target = 'bgpost';
cFrm.onsubmit = function(){return cFrmPost()};
if (document.cookie != '') {
cFrm.anonName.value = document.cookie.replace(/^.*anonName=?([^;]*);?.*$/, '$1');
cFrm.anonURL.value = document.cookie.replace(/^.*anonURL=?([^;]*);?.*$/, '$1');
}
cFrm.postBody.value = '';
function cFrmPost() {
with (cFrm) {
anonName.value = anonName.value.replace(/^\s+|\s+$/g, '');
anonURL.value = anonURL.value.replace(/^\s+|\s+$/g, '');
postBody.value = postBody.value.replace(/^\s+|\s+$/g, '');
if (anonName.value == '') {
alert('Please enter your name');
anonName.focus();
return false;
}
if (postBody.value == '') {
alert('Please enter a comment');
postBody.focus();
return false;
}
anonURL.value = anonURL.value.replace(/^http:\/\//g, '');
}
bgPosted = true;
document.cFrm.post.disabled=true;document.cFrm.post.value="Please wait...";
return true;
}
function bgpostLoad() {
if (bgPosted == true) {
if (cFrm.remember.checked) {
var expires = new Date();
expires.setFullYear(expires.getFullYear()+1);
document.cookie = "anonName=" + unescape(cFrm.anonName.value) + "; path=/" + "; expires=" + expires.toGMTString();
document.cookie = "anonURL=" + unescape(cFrm.anonURL.value) + "; path=/" + "; expires=" + expires.toGMTString();
document.cookie = "fromName=" + unescape(cSend.fromName.value) + "; path=/" + "; expires=" + expires.toGMTString();
document.cookie = "fromEmail=" + unescape(cSend.fromEmail.value) + "; path=/" + "; expires=" + expires.toGMTString();
}
window.location.reload();
}
}
document.write('<iframe style="position:absolute;left:-9999px;top:0" name="bgpost" onload="bgpostLoad()"><\/iframe>');
//]]>
</script>
<input type="button" value=" Preview " onclick="javascript:PreviewpostBody()" />   <input style=";font-weight:bold" type="submit" name="post" value=" Post " id="FinalPublish" />
</div>
</form>

</p>

</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>

<p style="padding-left:20px;">
<a href="<$BlogURL$>">HOMEへ</a>
</p>
</div>
</ItemPage>



</Blogger>
</div>


<div id="sidebar">
<ul>

<li class="pagenav"><h2>Pages</h2><ul><li class="page_item"><a href="<$BlogOwnerProfileUrl$>" title="About">About This Blog</a></li>
<li class="page_item"><a href="http://" title="Archives">Unknown</a></li>
<li class="page_item"><a href="http://" title="Download">Unknown</a><ul>
<li class="page_item"><a href="http://" title="KASANE">Unknown</a> </li>
<li class="page_item"><a href="http://" title="Luster Brown">Unknown</a> </li>
<li class="page_item"><a href="http://" title="Luster Gray">Unknown</a> </li>
<li class="page_item"><a href="http://" title="naLightGreen">Unknown</a> </li>
</ul>
</li>
</ul></li>
<li id="calendar"><h2>Unknown</h2>

</li>

<li id="search"><h2>Search</h2>
<form method="get" id="searchform" action="http://search.blogger.com/?as_q=%s&ie=UTF-8&ui=blg&bl_url=life7-2ch-okiraku.blogspot.com&x=0&y=0">
<div><input type="text" value="" name="s" id="s" size="10" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form></li>

<li><h2>Archives</h2>

<script type="text/javascript">
var archives = new Array();
<BloggerArchives>
archives[archives.length] = new Array("<$BlogArchiveURL$>", "<$BlogArchiveName$>");
</BloggerArchives>
document.writeln("<select name='archivemenu' onchange='document.location.href=this.options[this.selectedIndex].value;'>");
document.writeln("<option value='" + location.href + "' selected>- Archives -</option>");
for (var i = archives.length - 1; i >= 0; i--) {
document.writeln("<option value='" + archives[i][0] + "'>" + archives[i][1] + "</option>");
}
<ArchivePage>document.writeln("<option value='./'>Current Posts</option>");</ArchivePage>
document.writeln("</select>");
</script>
<noscript>
<BloggerArchives>
<li><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a></li>
</BloggerArchives>
<ArchivePage><li><a href="<$BlogURL$>">Current Posts</a></li></ArchivePage>
</noscript>

</li>

<li><h2></h2>

</li>

<li><h2>Links</h2>
<ul>
<li><a href='http://www.google.com'>Google</a></li>
　　　　</ul>
</li>

<li><h2>Meta:</h2>
　　　<ul>

　　　</ul>
</li>

</div>


<hr />
<div id="footer">
<p>
<a href="<$BlogURL$>"><$BlogTitle$></a> is proudly powered by <a href="http://www.blogger.com/">Blogger</a> <br /><a href="<$BlogURL$>/atom.xml">Entries (Atom)</a>
</p>
</div>



<center><font size=-2>Template by <a href="http://www.napdays.com/">Napdays</a>
© 2005 Novu</font></center>



</div>



</body>
</html>

Bloggerのメモ

日曜日, 1月 29, 2006

【テンプレート】KASANE

月曜日, 1月 09, 2006

lightbox.js - Web2.0ライクな画像サムネイル生成