Seesaa用のテンプレートをカスタマイズしてみました。

2015年5月22日

TwitterのまとめサイトをSeesaaブログにて作っています。
Bloggerへ移転する前はさくらのブログ(SeesaaのOEM)で行なっていたので使い勝手はある程度わかっているものの、テンプレートはどれもダサダサでしっくりこないのでtagebuch-zweitのsei様作のテンプレートをカスタマイズして使わせて頂きました。

需要があるかどうかわかりませんが、他の方がより良いものにブラッシュアップして下さるかもしれないので公開させていただきました。
改変と公開の許可をして下さったsei様ありがとうございます。
なお、使用方法は「デザイン設定」の画面に以下のスタイルシートをコピペするだけでできます。

@charset “UTF-8″;
/*■tagebuch-zweit■http://tagebuch-zweit.seesaa.net
●gg_gray(右サイドバータイプ)
(改)http://mac.kumadoumei.net/
*/

/*全体・ボディ指定*/
body{
font-family: Arial, Helvetica, sans-serif;
text-align: center;
color:#333;
background-color:#ffffe0;
margin:0px auto 0px auto;
padding:0px;
}

/*全体のリンクカラー設定*/
a:link{ color:#336; text-decoration:underline;}
a:visited{ color:#669; text-decoration:none;}
a:active,a:hover{ color:#000; text-decoration:none;}

/*全体*/
#container{
margin:0px auto 0px auto;
padding:0px;
text-align:center;
width: 960px;
background:#FFF;
}

/*日記のタイトル(トップ)部分全体*/
#banner{
color:#333;
padding:0px ;
margin:0px 0px 10px 30px;
font-size:90%;
text-align:left;
}

/*日記のタイトル(トップ)*/
h1 {
font-size: 200%;
font-weight: bold;
font-family: Times New Roman,Times,serif,”MS P明朝”,”MS 明朝”,”ヒラギノ明朝 Pro W6″,”平成明朝”;
color: #777;
padding:10px 20px;
margin: 0px;
}

/*日記のタイトルリンクカラー指定*/
h1 a:link{color:#777;
text-decoration:none;}
h1 a:visited{color:#777;
text-decoration:none;}
h1 a:active,h1 a:hover{color:#777;
text-decoration:none;}

/*ブログの内容説明文*/
.description {
font-size:90%;
color:#555;
line-height:150%;
}

/*記事毎のページのナビ部分*/
.navi{
color:#9c6;
font-size:85%;
text-align:center;
padding-top:10px;
padding-bottom:10px;
width:100%;
}

/*記事エントリ部分(全体)*/
#content{
float:left;
text-align:left;
width:660px;
margin:0px;
padding-right:0px;
padding-left:10px;
}

.blog{
font-weight:normal;
line-height:170%;
}

/*各記事エントリ部分*/
.blogbody{
margin-bottom:5px;
}

/*日付部分*/
.date{
font-size:80%;
color:#999;
padding:2px 5px 0px 2px;
text-align:right;
font-weight:normal;
}

/*日付部分*/
h2 {
margin: 0px;
padding: 0px;
}

/*エントリタイトル*/
.title{
font-weight:bold;
font-size:100%;
color:#555;
padding: 5px;
text-align:left;
}

/*エントリタイトル*/
h3{
margin: 0px;
padding: 0px;
}

/*エントリタイトル部分のリンク設定*/
.title a:link,.title a:visited{
color:#555;
text-decoration:none;
}
.title a:active,.title a:hover{
color:#555;
text-decoration:none;
}

.text{
font-size:90%;
padding:10px 10px 0px 10px;
}

/*引用部分の設定*/
blockquote{
border:1px dotted #33f;
padding:2px;
}

q{
background-color:#ccc;
}

/*名前・投稿日時等の部分*/
.posted{
font-size:80%;
color:#888;
text-align:right;
margin:10px 0px 0px 0px;
padding:2px;
border-top: 1px dotted #ccc;
}

/***************************/
/*トラックバック*/
#trackback{
color:#666;
padding:5px 15px;
font-size:80%;
border:1px dotted #ccc;
}

/*コメント*/
#comments{
color:#555;
padding:5px;
margin-bottom:5px;
font-size:85%;
line-height:160%;
}

#comments form{
padding:5px;
}

/*「コメントする」*/
.comments-head{
color:#555;
font-weight:bold;
padding:5px;
}

/*コメント(内容)*/
.comments-body{
padding:10px;
}

/*コメント投稿者*/
.comments-post{
color:#777;
font-size:85%;
padding:3px;
border-bottom-width:1px;
border-bottom-style:dotted;
text-align:right;
}

input,#comments textarea{
border: 1px solid #777;
}
.input-submit{
color:#eee;
background-color:#333;
border:2px outset #eee;
}

/***************************/

/*サイドバー右*/
#links{
float: right;
text-align: center;
font-weight:normal;
width:270px;
margin:0px;
padding:10px 10px 0px 0px;
font-size:80%;
color: #777;
line-height:150%;
}

/*サイドバーの見出し部分・カレンダー年月部分*/
.sidetitle,.calendarhead{
color:#555;
font-size:95%;
font-weight:bold;
text-align:center;
margin:0px 0px 3px 0px;
padding:3px;
border-top:2px solid #999;
border-bottom:2px solid #999;
}

.calendarhead a:link,.calendarhead a:visited{
color:#555;
text-decoration:none;
}
.calendarhead a:active,.calendarhead a:hover{
color:#555;
text-decoration:underline;
}

/*サイドバー(中身)*/
.side,.side-tag{
color:#444;
text-align:left;
margin-bottom:3px;
padding:5px;
}

.side-tag{
color:#444;
text-align:left;
padding:5px;
line-height:1.5;
}

/******************************/

/*カレンダー*/
#calendar {
font-size: 80%;
text-align: left;
font-weight: normal;
color: #fff;
margin: 0px;
padding: 0px;
}

/*カレンダー(テーブルタグでの指定部分)*/
#calendar table {
text-align: center;
width: 98%;
margin: 3px 0px;
}

/*カレンダー曜日部分(テーブルタグでの指定部分)*/
#calendar th{
text-align: center;
color: #888;
}

/*カレンダー日にちリンク部分(テーブルタグでの指定部分)*/
#calendar td a{
color: #eee;
text-decoration: none;
background-color: #444;
display: block;
border: 1px inset #444;
}

/*カレンダー日にち部分*/
.calendarday{
font-size: 80%;
font-weight: normal;
color: #999;
padding: 1px;
}

/******************************/

/*rss設定*/
.syndicate{
font-size: 80%;
margin: 10px;
text-align: center;
}

/***************************/

/*フッター、一番下のスペース設定*/
#footer{
clear:both;
padding:5px;
margin-top:15px;
text-align:right;
font-size:80%;
color: #666;
}

/*Seesaaバナー*/
.powered table {
text-align: center;
margin-left: auto;
margin-right: auto;
}

/*タグクラウド用
※記事用のノーマルタイプ以外は確認が出来ていませんので、ビデオ等でもお使
いの方は個々で確認・修正して下さい*/

/**記事内に表示される部分のタグクラウド用**/
.tag-word{
font-size: 80%;
text-align: right;
margin: 5px;
}

/**検索部分のタグクラウド用**/
.tag{
font-size: 90%;
color: #777;
padding: 7px;
line-height: 1.8;
background-color: #fff;
position:relative;
border:1px solid #ccc;
}

#tag_cloud{
padding: 3px;
position:relative;
border-bottom:1px dotted #ccc;
}

.tag-title,.tag-photos-title,.tag-audios-title,.tag-videos-title{
font-size: 120%;
font-weight: bold;
color: #555;
position:relative;
}

.tag-search{
font-size: 80%;
text-align: right;
position:relative;
}

.tag-search a:link{color: #555;
text-decoration: underline;}
.tag-search a:visited{color: #666;
text-decoration: none;}
.tag-search a:active,.tag-search a:hover{color: #000;
text-decoration: none;}

.tag-more{
font-size: 80%;
margin-top: 7px;
position:relative;
}

/***********************************/
.tag-photos{
float:left;
margin:10px;
position:relative;
width:150px;
height:200px;
}
.tag-audios{
margin:5px;
position:relative;
}
.tag-videos{
float:left;
margin:10px;
position:relative;
}
.tag-navi{
clear:left;
text-align:center;
margin:10px 0px;
position:relative;
}

/* twitter quote */
.tweetBlockQuote{
margin-bottom:10px;
overflow:hidden;
width:98%;
}
.tweetBlockQuote img{
border:0;
}
.tweetBlockQuote .tweetImg{
padding:0px;
width:53px;
text-align:left;
overflow:hidden;
vertical-align:top;
float:left;
margin-right:7px;
}
.tweetBlockQuote .tweetMain{
padding:5px;
border:solid 1px #ddd;
background:#fff;
color:#000;
overflow:hidden;
vertical-align:top;
float:left;
width:70%;
}
.tweetBlockQuote .tweetMain a.tweetOwner{
color:#E86390;
font-weight:bold;
text-decoration:none;
}
.tweetBlockQuote .tweetMain a.tweetFriends{
font-weight:bold;
color:#26A6DC;
text-decoration:none;
}
.tweetBlockQuote .tweetMain .tweetText{
color:#000;
}
.tweetBlockQuote .tweetMain .tweetText a{
color:#000;
text-decoration:underline;
}
.tweetBlockQuote .tweetMain .tweetDate{
color:#9C9C9C;
}
.tweetBlockQuote .tweetBoth{
clear:both;
}
/* twitter quote */