保険 アリコ

moon in the noon

http://mistybluerose.jugem.jp/
<< October 2020 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 >>
テンプレ sakura シンプルピンク2 カスタマイズ例 2
おい森でも可憐に咲きほこる「すずらん」を、テンプレにも咲かせてみました。
ライトブルーのピンストライプの地模様も、爽やかさをはこんでくれるようです。

ベースは「sakura シンプルピンク2」
http://jugem.jp/utf/?mode=viewer&act=lookup&jtid=3736
「User Template File」に公開中。

公開分CSSは、以下スクロールバー内。
追記部分には、そのまま記載してあります。


* {
margin: 0;
padding: 0;
}

body {
font-family:"Verdana","MS Pゴシック", Osaka, "ヒラギノ角ゴ Pro W3",;
font-size:10px;
color:#aaa;
background:#fff;
margin:0px;
padding:0px;
}

a:link { color: #888; text-decoration: none; }
a:visited { color: #888; text-decoration: none; }
a:active { color: #888; text-decoration: none; }
a:hover { color: #D8D6FC; text-decoration: none; }

table,td,tr,div,form {
margin:0px;
padding:0px;
}

img {
border:none;
}

ul {
list-style-type: none;
line-height:120%;
margin:0px;
padding:0px;
}

input,textarea {
color: #666;
font-size :12px;
border:1px #ccc solid;
background-color:#FFF;
padding: 2px;
}


/* レイアウト */

#back {
width:900px;
background:#fff ;
border-right:2px solid #aaa;
border-left:2px solid #aaa;
margin:0px auto;
padding:0px 10px;
}

#head{
width:900px;
background-image: url(http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif);
background-repeat: repeat-y;
border-bottom:1px #aaa solid;
}

#main { width:520px;float:left; }
#side_1 { width:180px;float:left;margin-left:10px;}
#side_2 { width:180px;float:left;margin-left:10px;}

#copy {
margin-top:30px;
border-bottom:20px #eee solid;
color:#aaa;
text-align:right;
}


/* ヘッダー */

#head .site_title {
font-family :"Comic Sans MS";
color:#fff;
font-size:23px;
margin:40px 0px 10px 180px;
}

#head .description {
color:#fff;
font-weight: bold;
margin:0px 0px 30px 180px;
}

#head ul {
margin:80px 10px 10px 0px;
}

#head a:link { color: #fff; text-decoration: none; }
#head a:visited { color: #fff; text-decoration: none; }
#head a:active { color: #fff; text-decoration: none; }
#head a:hover { color: #fff; text-decoration: none; }

/* ナビゲーション */

#navi {
color:#fff;
font-size:12px;
font-weight: bold;
margin-bottom:10px;
}

#navi .cell_1 { background:#eee;}

#navi .cell_2 { width:10px;}
#navi .cell_2 img { width:10px; height:20px;}

#navi span { margin: 0px 5px;}

#navi a:link { color: #fff; font-weight: bold; text-decoration: none; }
#navi a:visited { color: #fff; font-weight: bold; text-decoration: none; }
#navi a:active { color: #fff; font-weight: bold; text-decoration: none; }
#navi a:hover { color: #444; text-decoration: none; }

/* エントリー */

#entry {

}

/* state部分 ---------*/

#entry .state {
width:150px;
color:#fff;
font-weight: bold;
text-align:right;
background-image: url(http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif);
padding-top:5px;
}

#entry .state ul {
margin-right:5px;
margin-bottom:10px;
}

#entry .state a:link { color: #fff; font-weight: bold; text-decoration: none; }
#entry .state a:visited { color: #fff; font-weight: bold; text-decoration: none; }
#entry .state a:active { color: #fff; font-weight: bold; text-decoration: none; }
#entry .state a:hover { color: #444; text-decoration: none; }


/* state_bottom部分 ---------*/

#entry .state_bottom {
width:150px;
color:#f05187;
text-align:right;
background-image: url(http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif);
padding-bottom:10px;
}
#entry .state_bottom img { width:5px; height:50px; }

/* entry_main部分 ---------*/

#entry .entry_main {

}

.entry_title {
font-family :"Comic Sans MS";
font-size:12px;
color:#D8D6FC;
font-weight: bold;
margin-top:10px;
margin-left:10px;
margin-bottom:10px;
}

.entry_body {
color:#888;
font-size:10px;
line-height:170%;
margin-left:10px;
padding-bottom:10px;
}

.entry_body a:link {border-bottom:dotted 1px #aaa;}
.entry_body a:visited {border-bottom:dotted 1px #aaa;}
.entry_body a:active {border-bottom:dotted 1px #aaa;}
.entry_body a:hover {border-bottom:dotted 1px #aaa;}

.entry_more {
color:#888;
padding-top:10px;
}

.entry_more a:link {border-bottom:dotted 1px #aaa;}
.entry_more a:visited {border-bottom:dotted 1px #aaa;}
.entry_more a:active {border-bottom:dotted 1px #aaa;}
.entry_more a:hover {border-bottom:dotted 1px #aaa;}

blockquote {
color:#888;
border-left:3px solid #ccc;
margin: 10px 5px;
padding:0px 5px;
}

.page {
margin-top:15px;
font-size:10px;
color:#aaa;
text-align:right;
}

.top {
margin-top:10px;
font-size:10px;
color:#aaa;
text-align:right;
}


/* コメント・トラックバック部分 ---------*/

#comment {
color:#aaa;
line-height:150%;
margin-left:160px;
}

#comment .title {
font-family :"Comic Sans MS";
font-weight:bolder;
padding-bottom:5px;
border-bottom:1px solid;
}

#comment .tb {
border-bottom:1px dotted #ccc;
padding:10px 0;
}

#comment .state {
color:#aaa;
padding-left:9px;
margin-bottom:5px;
}

#comment .tb_url {
color:#aaa;
font-size:12px;
}

#comment .tb_title {
font-weight: bold;
}

#set_cookie { border:none;background:none; }

/* サイドメニュー */

.linktitle {
font-family :"Comic Sans MS";
color:#fff;
font-size:12px;
font-weight:bolder;
background-image: url(http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif);
padding:5px 0px 5px 7px;
}

.linktext {
padding-top:5px;
padding-bottom:5px;
}

.linktext a:link { color: #888; text-decoration: none; }
.linktext a:visited { color: #888; text-decoration: none; }
.linktext a:active { color: #888; text-decoration: none; }
.linktext a:hover { color: #D8D6FC; border-bottom:dotted 1px #aaa; }

.linktext ul { margin:0px 0px 10px 10px; }

.linktext li {
padding-left:0px;
margin-bottom:5px;
}

/* カレンダー ---------*/

.calendar {
font-family: "Verdana";
text-align:center;
line-height: 140%;
margin-bottom:10px;
}

.calendar table {
width:100%;
margin:0px auto;
text-align:center;
}

.weekday { padding: 2px;}
.cell { padding: 2px;}

.cell a:link {font-weight: bolder;}

/* アマゾン ---------*/

.amazon { margin-bottom:20px; }
.amazon_text { line-height:140%; }

/* サーチ ---------*/

.search { margin-bottom:10px;}

.search .title {
font-family :"Comic Sans MS";
color:#D8D6FC;}

.search input {
color: #666;
font-size :12px;
border:1px #ccc solid;
background-color:#eee;
padding: 2px;
}
.search .button { margin-left:5px;}

html{
scrollbar-base-color: #fff;
scrollbar-track-color: #fff;
scrollbar-face-color: #fff;
scrollbar-shadow-color: #DCE3E3;
scrollbar-darkshadow-color: #C1C1C1;
scrollbar-highlight-color: #fff;
scrollbar-3dlight-color: #DCE3E3;
scrollbar-arrow-color: #C1C1C1;
}

.pict {
background-color: #ffffff; 
border-width: 2px; 
margin: 5px 10px 5px 5px; 
padding: 10px 10px 50px 10px; 
border-style: solid; 
border-color: #DCE3E3 #C1C1C1 #C1C1C1 #DCE3E3; 
background-image:
url();
background-repeat:no-repeat;  
background-position:95% 95%;  
}


background-image: url(http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif);
で、それぞれに画像をのせ、paddingで巾の調整をしてあります。

なお、このブログ本文の左側にある画像は、上下二枚の組み合わせとなっています。
画像によっては、その張り合わせ部分が目立つかもしれません。
その点だけ、ご注意くださいませ。

なお元となっている「sakura シンプルピンク2」。
こちらは、文字のグレートーン以外は、2色しか使っておりません。
「メモ帳」の「置き換え」機能で、簡単にカラーチェンジを楽しめます。
CSSを「コピー」で全部拾い、「メモ帳」に「貼り付け」
「編集」の「置換」で、色をすべて載せかえます。
なお、薄いピンクは「#ffedf2」、濃いピンクは「 #f05187」。
この2色を、お好みの色へお替えください。
続きを読む >>
* ぷちカスタマイズ(テンプレ) * 07:58 * - * trackbacks(0)
テンプレ シンプルピンク spring ver.
コメント欄でのご要望により、シンプルピンクの春限定バージョンを作ってみました。
白地にイエロー、そしてグリーン・・・というご要望かなぁ?とも思いつつも・・・
こんな感じに仕立ててみました。

ふんわり、ほんわり、のんびり、まったりな春のイメージとなっていればいいのですが・・・

採用色はスプリング・グリーン#b4cb5e■■■とプリムローズ・イエロー#faf684■■■
他の配色は、それにあわせてグラデさせてあります。

なお、配布は期間限定。続投は未定となっております。

          かわいいサンプルかわいい かわいいダウンロードかわいい
* ぷちカスタマイズ(テンプレ) * 12:39 * comments(0) * trackbacks(0)
テンプレ シンプルピンク 一部修正
こんな簡素なテンプレ・・・つかってもらえるんやろかぁ?
と、かな〜〜〜り消極的に公開してみた「シンプルピンク」
つかっていただくサイトさまはじんわりと増え、ありがたく思っておりました。

今回、JUGEMでの独自タグ追加にともなっての一部修正と
超じみーーーなグレードアップをはかってみました。

next独自タグ追加とスクリプト削除
  続きを読む・・・の表記をかえるスクリプトを導入しておりましたがこれを削除し
  独自タグに置き換えました。
  見た目は、いままでとかわらないようにしてあります。

next画像の枠追加
  当テンプレ使用サイトさまを拝見させていただいて
  これがあったほうが、もっといいかなぁ?と追加してみました。

  なお、フリースペースなどの画像に枠がでてしまい困る。この枠はいらない。
  という場合は、CSS末尾の

  .pict {
  background-color: #ffffff; 
  border-width: 2px; 
  margin: 5px 10px 5px 5px; 
  padding: 5px 5px 5px 5px; 
  border-style: solid; 
  border-color: #DCE3E3 #C1C1C1 #C1C1C1 #DCE3E3;  
  }

  を削除するか、画像の表記の見直しをはかってみてください。

  <Img Src="http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif" Border="0">

  このような表記に変えると、画像に枠はつかないと思います。

next行間の修正
  広めに設定しなおしました。

nextcookieの保存
  実はコレがいちばん気にかかっていましたが、今回修正し、保存できるようになりました。

他にも微調整数箇所ありますが、略させていただきます。

今回、修正作業のため、元となった公式テンプレ「plain」をDLしてきたのですが
私がこの「シンプルピンク」を作ったときと、まるきりHTMLのほうがかわっていました。
現段階では動作に異常はありませんでしたが、先も修正しながらの配布を心がけたいと思っております。

          かわいいサンプルかわいい  かわいいダウンロードかわいい
* ぷちカスタマイズ(テンプレ) * 09:22 * comments(2) * trackbacks(0)
テンプレ groovy pink
テンプレ「groovy pink」「User Template File」に公開しました。
ベースは公式テンプレ「black」



白背景「cutie pink」を作成途中でできたテンプレです。

公式テンプレ「black」の段階で、すでに相当かっこよかったので
画像をはずしたり、ちょっとしたカスタマイズをおこなったり・・・
と、あまり手をくわえすぎず、ニュアンスをそのまま生かしてみました。

ご使用に際しての説明は、「cutie pink」とおなじです。
http://mistybluerose.jugem.jp/?eid=731

ダウンロードはこちらから。
http://jugem.jp/utf/?mode=viewer&act=lookup&jtid=3820
* ぷちカスタマイズ(テンプレ) * 23:24 * comments(3) * trackbacks(0)
テンプレ cutie pink
テンプレ「cutie pink」「User Template File」に公開しました。
ベースは公式テンプレ「black」



ピンクの色味がとってもいい感じだったので、そのまま白背景に整えてみました。

黒背景の「groovy pink」もあります。http://mistybluerose.jugem.jp/?eid=732

このテンプレの利点は、トップに画像を貼ることができるところです。

HTMLに <!-- 画像 ここから --><!-- 画像 ここまで --> というところがあります。
その間にタグを打ち込むと、画像が反映されます。
<!-- 画像 ここから -->
<img src="http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif" border="0" style="margin-bottom:20px;vertical-align:bottom">
<!-- 画像 ここまで -->

トップ画像に、ブログのURLをリンクさせる方法は、以下のようになります。
<a href=" http://**********.jugem.jp/ ">
<img src="http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif" border="0" style="margin-bottom:20px; vertical-align:bottom"></a>

next http://**********.jugem.jp/ ←ここにリンクさせたいURLを入力

next http://img-cdn.jg.jugem.jp/e63/171265/********_******.gif
ここに、ご自分で用意なさった画像のURLを入力して、タグを差し込んでください。

画像の横幅は、400pxが限界となっております。

なお、画像の上の余白をなくしたい場合は、CSSの
#main {
width: 400px;
margin-right:30px;
float:left;
padding-top: 50px; ←ここを0pxに変更してください。
}

使用したスクリプトはこちらです。
「stroll::blog」さま 「カテゴリーリストでサブカテゴリーがあるっぽく表示する」
「JUGEMカスタマイズ講座」さま 「リストのプルダウンメニュー化」

「続きを読む」の文字の変更は、JUGEMの独自タグが昨日公開されたので
そちらを取り入れてみました。
詳細はこちら 「JUGEMお知らせブログ」 「独自タグを2点追加」

ダウンロードは、こちらからどうぞ。
http://jugem.jp/utf/?mode=viewer&act=lookup&jtid=3816
* ぷちカスタマイズ(テンプレ) * 20:35 * comments(2) * trackbacks(0)
<<2/5pages>>
categories
selected entries
archives
recent comment
recent trackback
blogpeople
links
profile
qrcode