にゃあ

ニュース記事と画像に適度な余白を作る

ニュース記事に画像を貼り付けてみたけれど、画像と本文が密着して見栄えが悪い。そんな小さな悩み、小さな改良で、すぐに解決できます。

ニュー スに画像をつけて投稿するのは簡単にできるのですが、画像のまわりに適度なスペース(パディング)を設けるのは、すこし面倒です、いえ、面倒でした。過去 にxoopscube.jpのフォーラムなどでも、この件についていくか質問があったようですが、その都度ニュース記事内でHTMLタグを使ったり、 newsモジュール自体をハックしたり、あるいはXoopsCodeをハックしたりと、単に余白を設けるだけなのに、大がかりな工事が必要だと言われてき ました。しかし、そのようなやり方は面倒なだけでなく、XOOPSをアップデートするときに、それらの地道な苦労は吹き飛んでしまいます。

最も楽でスマートな解決方法はテーマのスタイルシートを編集する方法です。あなたが今使用しているテーマのスタイルシートに以下の一行を追加するだけです。

.itemBody img{padding: 5px;}

どうでしょう?あっという間に実現できたことでしょう。テーマは意図しないアップデートで上書きされることもありませんし、この程度の作業であれば、たとえテーマが上書きされてもすぐに治せます。

もちろんこのtipsはBulletinにも使えます。それ以上にclassがitemBodyである箇所ならどこでも適用できます。このtipsを応用すればweblogや他のモジュールでも利用できます。


コメント&トラバ

トラックバックを送る

無関係なスパムのトラックバックを防止するため、リンク先で本サイト(suin.asia)への言及が確認されないトラックバックは破棄しています。

トラバURL : http://suin.asia/trackback/279

コメントを書く

お名前* URL
本文*
合い言葉* ←「4veanypol」と入力して下さい。
* この記事の話題と関係ないコメントはどんな内容でも削除します。(移動できないので)

トラックバック

トラックバックがないのはさみしいにゃん…。

コメント

コメントはないです。誰かコメント書いてよぅ…。

このブログの著者


Suinと申します。

@suin on Twitter

サブメニュー

最近気になるモノ!

WindowsからMacに乗り換えて半年ですが、Macは細かいところまで丁寧に作られていて、親切なユーザーインターフェイスが気に入ってます。iMacはMagic Mouseと洗練されたデザインのBluetoothキーボードがついてくるので、お得だなあ、なんて思ってます。私に買ってもいいという方、いたら教えてください 笑。

最近のエントリ

XOOPS Cube Dev Ring

最近のコメント

最近のトラックバック

ひとりで喜ぶログ
デュラララに登場するチャットを再現した (04/09)
ひとりで喜ぶログ
デュラララに登場するチャットを再現した (03/28)
http://www15.atpages.jp/~classicalstudio/wordpress/?p=50
getcwd()とdirname(__FILE__)は違う結果になるときがある (12/22)
Re:
CSSのtext-align:center;は<div>には通用しない (12/15)
XOOPS専門-株式会社RYUS - d3blog
Shiori 1.02 (12/02)
9deMaio.com - blog
Koins 1.00 (11/11)
インターネット覚え書き「ビボウログ」
CSSのtext-align:center;は<div>には通用しない (09/16)
hinoeuma1966
CSSのtext-align:center;は<div>には通用しない (07/03)
Suin.org
ブログ作ってみた (03/23)
Suin.org
ブログ作ってみた (03/23)