HABU-CMS【簡単ホームページ作成システム】長崎事務局

管理画面メニュー「ページ編集」→「基本情報設定」→「ロゴ画像登録タブ」にてサイトのロゴマークをアップロードすることができます。この機能の仕様について解説いたします。

この機能を使ってGIFやJPGで出力したロゴ画像をアップロードした場合、テンプレートによってはロゴ画像の背景が目だってしまう場合があります。


上記は同じロゴ画像を2つのテンプレートで比較した例です。
このように背景透過処理がなされていないGIFやJPG画像をアップロードした場合、テンプレートの背景となじまないケースが出てきます。この症状を改善するためには「背景透過処理を行ったPNG画像」を作成する必要があります。

また、PNG形式の画像は未だ正常に対応していないブラウザがありますので、PNGのロゴ画像が登録されてもそれをそのまま表示せずに、いったん「ロゴ画像表示領域の背景画像」と合成して出力しています。

このロゴ画像合成の仕様は以下の図をご覧ください。


ポイントとしてはロゴ画像背景画像「bg_logo.jpg」のサイズとCSSで指定したロゴ表示領域サイズを合わせることです。このサイズが合っていないときれいにロゴ画像を合成することができません。

また、登録したロゴ画像を合成する位置は
「デザイン」＞「オリジナル追加・編集」よりテンプレートを選択・編集し、「画像編集」＞「システム画像」内の「bg_logo.jpg（EDITORマークが付いています）」サムネイルをクリックすることで調整が可能です。

【ロゴ出力用独自タグについて】

ロゴ出力用独自タグは「ロゴ画像が登録されているかいないか」を判別し、ロゴ画像が登録されている場合は上記合成画像を背景として出力、テキストをネガティヴインデントしたソースに置換されます。

上記はロゴ画像を登録した場合の置換ソース例です。
※ID”indent”はシステム側で登録された独自IDとなります。
ロゴ画像を登録していない（テキスト表示）場合は div id=”indent” のタグは表示されません。

この記事を表示

トップページの画像（トップイメージ）のサイズ変更につきましてはオリジナルテンプレート編集にて変更が可能です。1）「デザイン」メニューより「オリジナル追加・編集」より編集したいテンプレートをコピーし、編...
記事全文を読む

 ＝ウイルス・セキュリティソフトに関するご報告＝「ウィルスセキュリティーZERO」にて最新のパターンファイルをダウンロードしてご利用した際に、管理画面にてウィルス検出されたとのご報告を頂いて...
記事全文を読む

ビジネスPに3種（橙・緑・青）を追加しました。
この記事を表示

ポップKに3種（ピンク・緑・青）を追加しました。
この記事を表示