Message


アーティフィシャルフラワー、プリザーブドフラワー教室をしておりますLilygardenリ リーガーデンです。
ご自分の為だけの花時間とアフタヌーンティーをお楽しみいただきます。

・クリエイトアカデミーライセンススクール・
・FEJライセンススクール・

文字色やサイズなどの設定は…

梱包のstyle.cssで行います。メモ帳で編集できます。詳しい説明も書いていますのでお読み下さい。

プレビューでチェックすると警告メッセージが出る場合

メニューの透明度設定によって出る警告ですが、WEB上にアップロードすれば出ません。また、この警告が出ている間はメニューの透明度も見る事がで きないので、警告メッセージ内で左クリックし、「ブロックされているコンテンツを許可」を選択して下さい。これにより、メニューの透明度がちゃんと見れる ようになります。

テンプレートの使い方

■はじめにやる事。
まず、htmlソースが見れる状態(メモ帳などで開いてもOK)にして、
<title>フラワーショップ向けホームページテンプレート mf_green</title>
を編集しましょう。あなたのホームページ名が「Sample Flower Shop」だとすれば、
<title>Sample Flower Shop</title>
とすればOKです。
SEO対策もするなら冒頭にキーワードを入れましょう。
<title>贈り物やお見舞いにSample Flower Shop</title>

続いて、下の方の
Copyright(C) 2009 サンプルフラワーショップ[…省略…]
も編集します。「2009」部分はその年その年にあわせて変更して下さい。

ヘッダー画像について
自分で画像を用意する場合、幅900px、高さ405pxにし、画像ファイル名を「main_img.jpg」にしてimagesフォルダに上書きして下 さい。現在のお花の画像と置き換わります。

■サイト名ロゴ画像について
横幅364px、高さ89pxで制作して、マット色を#859c51にして、画像ファイル名を「logo.gif」にしてimagesフォルダに上書きし て下さい。現在の「Sample Flowe Shop*」のロゴと置き換わります。尚、背景画像を入れ替えたり、ロゴ画像の位置を移動したりする場合は、フチが目立たないようにマット色を調整して下 さい。
上と同じロゴを1個500円にて承り中。尚、上記フォントは英語専用なので日本語希望の場合は別フォント(細めのゴシック系など)の代用となります。

■上部のメインメニューについて
カーソルオーバー時に透明度が変化するのはロールオーバー効果ではありません。1枚のメニュー画像をcssファイルで調整しています。cssで透明度の設 定をしているので、背景画像を入れ替えても同じ透明度でメニュー画像が表示されます。文字なしのベース画像がbaseフォルダに入っていますので好きに文 字いれしてそのままimagesフォルダへ上書きして下さい。左からmenu1.gif…と置き換わります。
当方でもメニューへの文字入れ代行(最初の1個目のみ500円、後は追加1個あたり150円。)承っております。もし全部入れ替えるなら、最初の1個分 500円+残り5個(750円)=1,250円となります。詳しくはこちらをご覧 下さい
ちなみに、メニューは背景画像に対して自由な位置に配置ができ ます。メニュー画像同士をちょっと重ねてみたりランダムに配置してもいいでしょう。詳しくはstyle.cssファイルに記載していますのでご覧下さい。

少し補足ですが、この透明度変化のスタイルはW3Cのバリデータチェックでエラー対象となります。気になる場合は透明度 設定部分をcssファイルから削除して下さい。削除すると当然ですがメニューの透明効果は得られません。意味が分からない場合は気にせずそのまま使っても らって問題ありません。

■当ブロックの見出しについて
当ブロックの一番上にある「ホームページビルダーをご利用の方へ(重要)」などの見出しは以下のようにh2タグで囲めばOKです。

環境によって文字が切れる場合があるのであまり枠ギリギリまで文字を詰め込まないように。

当ブロック内のテキストは…
段落タグ<p>で囲みましょう。余白が自動で反映されます。

当ブロック内に画像を置く場合…
段落タグ<p>内なら、幅540pxまで。段落タグの外なら幅560pxまで。

■最後にやる事。
全ページが完成したら、htmlソースが見える状態にしてmetaタグを変更しましょう。今はあまり重要視されていませんがSEO対策の一環です。

ソースの上の方に、
content="ここにサイト説明を入れます"
という部分がありますので、テキストをサイトの説明文に入れ替えます。検索結果の文面に使われる場合もありますので、見た人がよく分かるような説明文を簡 潔に書きましょう。
例:content="贈り物やお見舞いにはSample Flower Shop。地方発送も承っております。3,000円以上送料無料!"

続いて、その下の行の
content="キーワード1,キーワード2,〜〜〜"
も設定します。ここはサイトに関係のあるキーワードを入れる箇所です。膨大な数のキーワードを詰め込むとスパム処理されるのでやめましょう。キーワード間 はカンマ「,」で区切ります。
例:content="フラワーショップ,花,販売,地方発送,送料無料,……"

左側の「sidemenu」の使い方について

左側のメニュー部分は以下のhtmlでできています。文字色や下線、カーソルオーバー時の背景色などは梱包のstyle.cssファイルで変更できます。

上をコピーしてsideコンテンツ(左側ブロック)内に追加すればいくつもブロックを追加する事ができます。テーマが異なる場合などメニューを分け て使いたい場合にご利用下さい。

トップページの「What's New」コーナーの使い方

定義リストタグでできています。h2の見出しを含めた1ブロックをhtmlで書くと以下の通りです。

<dl>タグにclass指定で"new"とする事でインラインフレーム(iframe)風のボックスが出来上がります。iframeと違 い、実際に同じhtmlファイル内に記載されているのでSEO的にも有効かと思います。
<dt>には日付、<dd>には内容を書きます。<dd>の下に下線が自動で入ります。日付の文字色やボックスの背 景色やボックスの大きさなどはstyle.cssで変更して下さい。

テンプレートの編集サービスについて

ロゴやメニューの画像加工やhtmlコーディング、テンプレートのテーマカラー変更やプログラム設置など、テンプレートに関する様々なサポートも 承っております。また、当テンプレートのPSD(Photoshop)ファイル販売も行っております。
詳しくはこちらの テンプレート編集ページをご覧下さい。

おまけ


テンプレートとセットのバナーも準備しました。文字なし土台がbaseフォルダに入っていますのでご活用下さい。当サイトでも文字のせ代行承っております のでお気軽にご相談下さい。

sidemenu

上の「sidemenu」の見出しはh3タグで囲めばOKです。html側だと以下の通り。

「sidemenu1」などのサイドメニューについてはこちらをご覧下さい。

当ブロック内のテキストは

段落タグ<p>で囲みましょう。上下の余白が自動で反映されます。

当ブロック内に画像を置く場合…

幅276pxまで

サポート

■HPカラーの変更、お問い合わせフォームの設置、画像加工サービス(500円〜)など、ホームページ編集のお手伝いもしております。
>> 詳細はこちら