たとえば、人気記事のモジュールと最新ニュースのモジュールを別々のデザインにしたいという場合、どうするのか？そのやり方を説明しておきます。

実は、JoomlaにはモジュールごとにCSSを切り替える方法が用意されています。それがモジュールのパラメータにあるクラスモジュールと呼ばれるものです。

最新ニュースのモジュールを例にとって説明します。

通常ここは空白になっています。実際の表示では下記のような表示です。

まあ、味もそっけもないといいますか、改造してください！といわんばかりですね。そこで、上記のようにモジュールクラスにnewsという任意の文字を入れてみます。

それを使って先の「最新ニュース」のモジュールを再デザインしてみましょう。

ということですっかり変わりました。

やり方のヒントとして実際にCSSに追加変更した部分を書いておきます。

a.latestnewsnews:link, a.latestnewsnews:visited {
color: #666;
border-bottom: 1px dashed #8FE6F8;  }

a.latestnewsnews:hover {
color: #000;
border-bottom: 1px dashed #8FE6F8;
text-decoration: none;  }

.moduletablenews {
    width: 196px;
    hight: 100%;
    background-image:url(/images/stories/button/news.jpg);
    background-position: left top;
    background-repeat:no-repeat;
    background-color: #fff;
    padding-top:40px;
    margin:0;
    border: 3px solid #8FE6F8;
    font-weight: bold;
    color: #666666;  }

とにかくソースを解析するとわｋりますよ。