• 締切済み

もしもドロップシッピング メニューをツリー表示に

みなさん今晩は、質問させてください。 今日もしもドロップシッピングに登録し開店したのですが、 商品メニューをツリー表示に出来ないのでしょうか? 例えば 「ホビー」-「楽器」-「ギター」のようにクリックしていくとサブメニューが開いて欲しいのです。 HTMLは一応分かります。 それではよろしくお願い致します。

みんなの回答

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

グローバルなメニューでしたらheaderに入れるのが楽ですね。 <body>  <div class="header">   <div class="nav">    <ul>     <li><a href="">ホビー</a>      <ul>       <li><a href="">楽器</a>        <ul>         <ul><a href="">管楽器</a>          <li><a href="">金管楽器</a>           <ul>            <li><a href="">トランペット</a></li>            <li><a href="">ホルン(フレンチホルン)</a></li>            <li><a href="">トロンボーン</a></li>           </ul>          </li>          <li><a href="">木管楽器</a></li>         </ul>         <li><a href="">弦楽器</a>          <ul>           <li><a href="">撥弦楽器</a></li>           <li><a href="">擦弦楽器</a></li>           <li><a href="">打弦楽器</a></li>          </ul>         </li>        </ul>       </li>      </ul>     </li>    </ul>   </div>  </div> ・・・・・・ と率直にマークアップすれば良いです。 デザインは考えず、率直に文書構造だけをマークアップしておきましょう。そうして「構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )」さえしておけば、スタイルシートでどうにでもなります。 (どうにでもなるサンプル)  ナビゲーションリストを様々にデザインしてみよう。( http://www.ichiya.com/WebService/Howto/sample/HTML/nav/navigation1.html )  にて、HTMLソースを確認  ついでブラウザの[表示]メニューから[スタイル(シート)]を選択してスタイルだけを変更してみると意味が分かる。ウィンドウ幅変えたり、Ctrl + +/- でフォントサイズ変えたり、印刷プレビューを確認してみると、HTMLさえきちんと書けていたらどうにでもなる意味が分かるかと。Chromeは代替スタイルが利用できないので他のブラウザで

toitoi2
質問者

お礼

ORUKA1951さま 今晩はアドバイスありがとうございます。 返信が遅れて申し訳ありません。 実はHTMLをいじるのは久々ですっかり忘れてしまいました。 Jimdoや他のブログのように簡単に変更できるので・・・ Firfoxでトップページを表示し、画面上で右クリックー ページのソースを表示、デスクトップに保存しさくらエディタで編集をすればいいのでしょうか? ul,liはリストを作成するソースで、 <ul><li>...</li></ul>でくくるですね? 実際ソースを見てみると、 <div class="header"> <div class="nav"> の代わりに <body id="sd-index" class="top"> <div id="container" class="layout-left"> <div id="contents"> <div id="header"> <h1>Alley Cat Armory</h1> <ul class="navigation"> <li><a href="./">トップ</a> <span>|</span></li> となっています。 ここを変更したいのではなく、146行目からの <div class="section"> <p class="genre-all"><a href="./list-0001.html"><span>商品一覧</span></a></p> <ul class="genre-list"> <li><a href="./category-09-0001.html">ホビー・エトセトラ</a></li> </ul> </div> <div class="section"> <ul class="side-link"> <li><a href="./group-0000465227-0001.html">東京マルイ 次世代電動ガン</a></li> <li><a href="./group-0000465263-0001.html">ガン本体</a></li> <li><a href="./group-0000465265-0001.html">モデルガン</a></li> </ul> </div> を変更したいのです。 [エアーソフトガン]というカテゴリー内に[ガン本体]、[外装パーツ]、[内部パーツ]などが表示してほしいのです。 またこれらを編集したあとどうやって反映させればいいのでしょうか? つまりソースをダウンロード、編集するのはローカルなので。 引き続き、よろしくお願い致します。