FC2ブログ

ハーレクイン図書館      
ハーレクインのことなら何でも・・・                         FC2館

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。



Edit
  1. --/--/--(--) --:--:--|
  2. スポンサー広告|
  3. トラックバック(-)|
  4. コメント(-)

マイ本棚(Amazonツール)の設置―テンプレートカスタマイズ

新刊情報☆ ハーレクイン1月5日刊
powerd by amazon360

先ほども紹介したアマゾン360の『マイ本棚』↑
本棚の中の本は拡大して見ることが出来ます。
すごいツールでしょ!

ところが・・・早速設置したところ
↓こんな風になってしまいました。
???
本棚
あれれ・・・なんかおかしい・・・

原因はツール製作者さんのこちらの記事で判明。
AMAZON360 MY本だな設置
ちゃんとFC2ブログで動作テスト済でした

ただ貼り付けただけでは使用しているテンプレートによって
本だなの中で、本が浮いているようになってしまう場合があります

その場合は、「テンプレートの設定>編集>スタイルシートの編集」を・・・
つづきを読む

つまり余白設定をゼロにしないと
本がきちんと並べられないということ。

そ~なのか!

しかし原因がわかってもにはちょっと難しかった・・・
テンプレートによって色々パターンがあるのでって
本当にいろいろパターンがあるようで、
どこがその箇所なのか、見つけるのに悪戦苦闘。

まっ、こんな便利なツールのためなら
苦労もなんのそのですが・・・

ということで参考までにカスタマイズのメモを残します。
当図書館の使用テンプレートはFC2の公式テンプレート[rose]です。
テンプレートの前半部は省略します。

中ごろの/* 記事表示部分 */という箇所を目安に探してください。

/* 記事表示部分 */
#left {
width: 485px;
float: left;
overflow: hidden;
margin: 5px 10px 0 0;
background: #FFF;
}

/* 記事の見出し(タイトル) */
#left h3 {
font-size: 110%;
color :#FAD53A;
padding: 0px 0px 0px 0px;
margin-left:5mm;margin-top:8mm;
border-bottom: 0px dashed #FAD53A 90% center;
background: url() no-repeat top left #fff;}

/* 記事表示部分/コメントなどを囲うブロック要素の属性 */
.content {
margin: 0 0 10px 0;
padding: 15px 15px 0 15px;
line-height: 1.4;
border-top-width: 0;
border-left: 0px solid #6D7966;
border-right: 0px solid #6D7966;
border-bottom: 0px solid #6D7966;
}

/* 記事内の画像 */
.content img {
border: 1px solid gray;
margin: 0 10px 5px 0;
}

この部分を以下のように書きかえる
赤字部分に注目。

/* 記事内の画像 */
.content img {
border: 1px solid gray;
margin: 0 0 0 0;
}


記事内の画像というところが
ポイントだったんですね。この部分の余白設定をゼロにすると
本が浮き上がらなくなります。
ついでにborder: 1px solid gray;の部分をwhiteにしたりすると
一冊一冊の区切り線も目立たなくなります。
でもちょっと見にくいのでグレイ(gray)のままにしました。
関連記事
スポンサーサイト



Edit
  1. 2006/12/30(土) 22:10:23|
  2. ブログ初挑戦レポート|
  3. トラックバック:0|
  4. コメント:0

コメント

コメントの投稿

管理者にだけ表示を許可する

トラックバック

トラックバックURLはこちら
http://harlequintosyokan.blog7.fc2.com/tb.php/236-372ff4d0
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。