2014年4月16日水曜日

おちゃのこネットのテンプレートカスタム(裏技) ヘッダーにナビを置く方法


おちゃのこネットのテンプレートはかなり面倒・・・好きにいじれない場所が大杉です。

なんといってもHTMLを修正できないのが不便で。

cssと、ブロックごとのレイアウトを変更することでしか、改変ができません。

せめて、ヘッダーの中にHTMLを書かせてほしいです。




ということで、ヘッダーにナビがないのを、つらいなぁと諦めていたんですが、発見しました!ヘッダーナビのつくりかた。

これ発見しちゃった時はすごいぜ自分って自分を褒めたくなりました(・∀・)


2014年8月追記:おちゃのこネットでは、今年になってからHTML5のテンプレートの配布が始まり、ずいぶんと使いやすくなりました。ヘッダーのグローバルナビが標準装備されているので自由にメニュー項目を入れることができます。おちゃのこネットは、私が一番オススメしている使いやすいショッピングカートです!
このブログは、旧タイプのテンプレートを使っている方に役に立つと思います。


1)基本設定のメタタグ設定のPC番キャッチフレーズの中にHTMLを書く


>今回の事例サイトはこちら 果物でつくったワインとジュース直売農園「果物の恵み」






最初はここの位置にナビが出ます

2)cssで、ヘッダーの高さを伸ばしておいて、一番外側のテーブルにポジションrelativeを指定



table#container{
position:relative;
}


3)PC版キャッチフレーズに入れたパーツ(ナビゲーション)にスタイルをつけます



PC版キャッチフレーズは、#copyがつくので


#copy{
top:170px;
left:0;
position:absolute;  →ポジションはabsolute 外側の#containerからの位置に固定する
width:1050px;
height:24px;
}


4)フリーページは別の所にキャッチフレーズを入れる場所があります



事例にさせていただいたネットショップ「果物の恵み」さんの紹介






フルーツ王国、長野県の中でもさらにくだものの里として有名な松川町にある、老舗の農園さんです。
秋になると、りんご狩りのお客さんで渋滞が出来るほど人気の果樹園。
三代目のオーナーが運営しているネットショップでは、この農園でとれたリンゴで作ったオリジナルアップルワインが好評。
りんごやブルーベリーを使った特製ジャムやジュースなどを取り扱っています。

他では手に入らないここだけの逸品、収穫時期になったらネットショップに並びます。季節外にはほとんど売り切れてしまうので、気になる方は逃さないようにGetしてくださいね!



参考になったよ!って方はwebの森のfacebookページへイイネをしてね(v^ー゜)



0 件のコメント:

webの森のFBページへも来て下さい