メイン | 2012年8月 »

2012年7月

2012年7月18日 (水)

ラベルの文字のサイズを変更したい

■ こんな時にどうぞ

Zenbackの「関連する記事」や「関連するみんなの記事」、「Twitter」といったラベルの部分、ここの文字サイズを変更できます。

■ コード

<style>
#zenback #zenback-widget .zenback-module-label  {
	font-size: 20px;
}
</style>

■ で、どうなるの?

続きを読む "ラベルの文字のサイズを変更したい" »

2012年7月12日 (木)

文字のサイズを大きく/小さくしたい

■ こんな時にどうぞ

Zenbackの文字がなんだか大きい!とか小さい!ときは、このコードの20pxのところを好きな文字サイズに変更してご利用ください。

■ コード

<style>
#zenback #zenback-widget .zenback-module-content { 
	font-size: 20px;
}
</style>

■ で、どうなるの?

続きを読む "文字のサイズを大きく/小さくしたい" »

横幅を指定したい

■ こんな時にどうぞ

Zenbackがにょーんと右側にはみ出してしまう。そんな時はこんなふうに、Zenbackのコードを横幅を指定したdivタグの中に入れましょう。400pxのところはご自身のサイトにあわせて編集してください。

■ コード

<div style="width:400px">〜ここにZenbackのコードを入れる〜</div>

■ で、どうなるの?

続きを読む "横幅を指定したい" »

2012年7月11日 (水)

ZenbackのHTML/CSSコード 図解付き解説 【2013/08/29 更新】

  • 2013/08/29 おしらせ欄まわりなどアップデートしました。

ZenbackのHTML/CSS構造は下図のようになっています。

Css_structure
※画像をクリックすると大きい画像を閲覧できます。

  • #zenback → Zenback全体を囲っています
  • #zenback-widget → Zenbackウィジェット全体を囲っています
  • #zenback-各モジュール名.zenback-module → 各モジュール全体
  • .zenback-module-label → 「関連するみんなの記事」といったタイトル
  • .zenback-module-content → 各関連記事のアイテム

続きを読む "ZenbackのHTML/CSSコード 図解付き解説 【2013/08/29 更新】" »

ここは何のブログ?
ここは、Zenbackっていうブログパーツのデザインカスタマイズをご紹介するブログです。Twitter @zenback のなかのひとが運営しています。

設定方法など、よくわからなくなっちゃったら、「Zenback デザインハックブログ: 【最初に読んでね】このブログの使い方」の記事をご覧ください。

サイト内検索

Twitter

RSS登録