ホーム >  Blog > LinkWithinの補足
2011年01月22日

LinkWithinの補足

こんにちは。WEBデザイナーの CUBES です。

先日、LinkWithinの記事を書いたところ、意外に反響が頂き有り難うございました。
LinkWithin は最新ブログ記事下にお勧め記事を紹介するガジェットです。

アメブロデザイン変更お任せください!ホームページデザインCUBES-LinkWithin

ただ、説明が悪かったのでLinkWithinの補足を。
LinkWithinを導入すると、標準では左詰めで表示されるため、この様に表示されます。

アメブロデザイン変更お任せください!ホームページデザインCUBES-LinkWithin

これではバランスが悪いので、CSSを加工して左にもスペースを入れ、
バランス良くセンター揃えにしたい!

アメブロデザイン変更お任せください!ホームページデザインCUBES-LinkWithin

僕の場合、4記事でLinkWithinの左右幅が約470ピクセル。
右側には約100ピクセルのアキ。半分の50ピクセルを左側に振りあてます。

と記事を書きましたが、説明が不十分でした。ガーン
CSSを加工出来るテンプレートは「カスタム可能」だけ

です。
「カスタム可能」テンプレート以外を使われている方は、LinkWithinを移動出来ない

と思ってください。

念のために「カスタム可能」テンプレートでの変更方法はこちらです。

アメブロデザイン変更お任せください!ホームページデザインCUBES-アメブロカスタマイズ

1 画面右下の「カスタム加工」をクリック
2 使いたいデザインテンプレートを選択
3 デザイン変更画面に戻り「CSSの編集」をクリック

アメブロデザイン変更お任せください!ホームページデザインCUBES-アメブロデザイン加工

4 CSS編集画面に下記CSSをコピペ。

#lws_0{
padding-top: 0;
padding-bottom: 0;
padding-left: 50

px;
}

メチャクチャ手抜きなソースです。
上・下にアキ0ピクセル。左に50ピクセル、右は指定無し。
ブログレイアウト、LinkWithin表示ブロック数によって左側に入力する数値は変わります。
※「padding-left: 50

px;」の50

をご自分のブログに合った数値に変更してください。

page-top