Joomla!テンプレートの「beez」を使う

「beez」テンプレートのCSSを編集してみます。
ページ全体のfont-family行間文字間を変更します。

「template」→「beez」→「css」→template.cssを開き,bodyの箇所に以下を修正・追加します。

***************************************************
body
{
background: #fff;
color: #000000;
font-family: “メイリオ”, Meiryo, “ヒラギノ角ゴ Pro W3″, “Hiragino Kaku Gothic Pro”, Osaka, “MS Pゴシック”, “MS PGothic”, sans-serif;
font-size: 100.1%;
padding: 0px;
text-align: center;
line-height : 1.4em;
    letter-spacing:1px;
}

サイト構築の元となるテンプレートの選択

管理画面の「エクステンション」「テンプレート管理」には,初めから用意されている3つのテンプレートがあります。
テンプレートを選択して,★印のデフォルトボタンをクリックすると,テンプレートが切り替わります。
隣の「編集」ボタンをクリックすると,管理画面上で,デザイン等いくつか編集できるようです。
「パラメータ」が表示されるものと,表示されないものがありますが,これは各テンプレートのフォルダにある「params.ini」というファイルに設定内容が記述されています。管理画面上で変更を加えると,params.iniが書き換えられ,フロントページに反映される仕組みですね。
Dreamweaver等のテキストエディタで直接編集するのであれば,パラメータが表示されていなくても特に差し障りはないでしょう。
あとで,params.iniをカスタマイズして,更新作業をより簡単に行うようにすることはできそうです。

3つのテンプレートから選択するのもいいでしょうし,「Joomla テンプレート」でググるとかなりのページが出てきますので,その中から選ぶのもいいでしょう。
ただ,有料テンプレートで多機能・ナイスデザインを見てしまうと,フリーテンプレートがかすんで見えます。

Joomla!最初のログインでしておくこと

1 管理者情報を変更する

(1)管理画面を開きます。
http://ドメイン/administrator/

(2)管理者ページにログインします。
ユーザ名:admin
パスワード:インストール時に設定した値
(3)管理者のユーザ名を初期値の「admin」から変更し,さらにその他いくつか変更します。
「ユーザ管理」アイコンをクリックしましょう。

(4)「administrator」の名前をクリックし,「ユーザ編集」画面へ移動します。以下の変更を行います。

▼ユーザ詳細
名前:任意(日本語で分かりやすく「管理者」としました)
ユーザ名:半角英数字で入力します。

▼パラメータ
バックエンドランゲージ:Japanese(JP)
フロントエンドランゲージ:Japanese(JP)
ユーザエディタ:エディタ-TinyMCE
タイムゾーン:(UTC+09:00)東京,ソウル,大阪,札幌,ヤクーツク
続きを読む Joomla!最初のログインでしておくこと

パッケージを展開,インストール

(1)ダウンロードしたファイルを展開後,FTPソフトを利用しサーバーへファイルをアップします。5000を超えるファイルがあるので,時間はかなりかかります。

(2)この時間を利用して,データベースを作成しておきましょう。
たいていは,契約しているサーバーのコントロールパネルから,データベースにアクセスできるようになっています。

①データベースの種類を選択:MySQL

②データベース名を入力:任意
私は「joom001」としました。サーバーによっては文字数に制限がある場合もあります。私が利用しているサーバーでは,入力したデータベース名の前に必ずユーザ名が入るので,「コントロールパネルのユーザ名+joom001」がデータベースの名前になります。

③ここで,「データベースの作成」を行います。

④次に,ユーザ名とパスワードを作成し,データベースのユーザとして割り当てます。まずは,「ユーザの作成」を行います。
ユーザ名:任意
パスワード:任意

⑤次に,データベースにユーザを追加します。
ユーザを選択,データベースを選択後,「追加」します。→ユーザ特権管理として,「全ての特権(ALL)」を与えます。
これでデータベース設定は終了です。
続きを読む パッケージを展開,インストール

Joomla!をダウンロード

ちなみに,Joomla(ジュームラ)と読むそうです。

サーバーの自動インストール機能を使えば楽なのですが,用意されているファイルのバージョン(1.0.15JP)が古いので,Joomla!じゃぱんより最新版(1.5.23JP)をダウンロードして少し手間をかけてインストールすることにします。

① http://joomla.jp/ アクセス
② 左メニューの黄色いバー「in Japanese」をクリックすると,SourceForge.JP にジャンプし,最新版がダウンロードできる。

happy_search検索モジュールをインストール

【環境】PHP:5.2.14,MySQL:5.5.13,Legacy:2.2.0,happy_search:0.60

happy_searchモジュールはサイト内検索とGoogle検索を同時に行うことができる。

sqlフォルダ内のhappy_search.sqlとhappy_search0.sqlをMySQL5用に修正する。
TYPE=MyISAM;」→「ENGINE=MyISAM;」

theme.htmlのヘッダー部に以下のソースを記述し,常にヘッダーに表示させるようにする。

続きを読む happy_search検索モジュールをインストール

ブロック名を表示させない

【環境】PHP:5.2.14,MySQL:5.5.13,Legacy:2.2.0

ブロック名を表示させない方法として次の方法がある。

①theme.html(テーマのテンプレート)の「blocktitle」が記述されている部分に条件分岐文を追記する。
***************************************************
< {if $xoops_showlblock == 1}>
    < {foreach item=block from=$xoops_lblocks}>
      < {if $block.title|strstr:"none"}>
      < {else}>
     

< {/if}>
     
< {$block.content}>

      < {/foreach}>
< {/if}>
***************************************************

続きを読む ブロック名を表示させない

jQueryによる画像のロールオーバーを実装

【環境】PHP:5.2.14,MySQL:5.5.13,Legacy:2.2.0

画像ごとにロールオーバーを設定するのは面倒なので,下記方法を利用する。
ロールオーバーを表示したい場合は2つの画像を用意する。→「abc.jpg」「abc_on.jpg」
abc.jpgにマウスポインタを当てると,同じファイル名に_onが付いている画像を表示し,マウスポインタを外すと_onが付いていない画像に戻る,という具合。

①common/js内のjquery.jsをリンクする。
[互換レンダーシステム]→[jQuery コアライブラリ]に「http://www.○○○.com/common/js/jquery.js」と入力

続きを読む jQueryによる画像のロールオーバーを実装