app/template/default/Block/common_header.twig line 1

Open in your IDE?
  1. <div class="site__description">
  2.         <h1>グレースメディカルクリニック　オンラインショップ</h1>
  3.       </div>
  4.       <header class="header" id="header">
  5.         <div class="header__container">
  6.           <div class="header__wrapper">
  7.             <div class="header__logo">
  8.               <div><a href="/">
  9.                   <picture>
  10.                     <source srcset="/assets/images/common/logo_header_sp.png" media="(max-width: 1024px)">
  11.                     <source srcset="/assets/images/common/logo_header@2x.png 2x"><img src="/assets/images/common/logo_header.png" alt="grace presents..">
  12.                   </picture></a></div>
  13.             </div>
  14.             <div class="header__nav header__spnav">
  15.               <div class="header__spnav-head">
  16.                 <div class="header__spnav-logo"><img src="/assets/images/common/logo_color-02.png" alt="grace presents.."></div>
  17.                 <div class="header__spnav-close">
  18.                   <button><img src="/assets/images/common/btn_spnav-close.svg" alt="閉じる"></button>
  19.                 </div>
  20.               </div>
  21.               <nav>
  22.                 <ul>
  23.                   <li class="has-subnav"><a href=""><span>ブランドから<br>探す</span></a>
  24.                     <div class="header__subnav header__subnav--brand header__spnav-sub">
  25.                       <div class="header__subnav-container">
  26.                         <div class="header__spnav-sub-head">
  27.                           <div class="header__spnav-sub-back">
  28.                             <button><img src="/assets/images/common/btn_spnav-back.svg" alt="戻る"></button>
  29.                           </div>
  30.                           <div class="header__spnav-sub-ttl">ブランドから探す</div>
  31.                           <div class="header__spnav-sub-close">
  32.                             <button><img src="/assets/images/common/btn_spnav-close.svg" alt="閉じる"></button>
  33.                           </div>
  34.                           <div class="header__spnav-sub-search">
  35.                             <form>
  36.                               <input type="text" value="" placeholder="サイト内検索">
  37.                               <button type="submit" value="submit">検索</button>
  38.                             </form>
  39.                           </div>
  40.                         </div>
  41.                         <div class="header__subnav-ttl">ブランド一覧</div>
  42.                         <ul>
  43.                           <li><a href="/products/list?category_id=54">当院オリジナルメニュー</a></li>
  44.                           <li><a href="/products/list?category_id=40">アスタリール</a></li>
  45.                           <!--<li><a href="/products/list?category_id=41">ケイセイ</a></li>-->
  46.                           <li><a href="/products/list?category_id=42">サンソリット</a></li>
  47.                           <li><a href="/products/list?category_id=43">セルニュープラス</a></li>
  48.                           <li><a href="/products/list?category_id=44">センシル</a></li>
  49.                         </ul>
  50.                         <ul>
  51.                           <li><a href="/products/list?category_id=45">ソルプロ</a></li>
  52.                           <li><a href="/products/list?category_id=46">ナチュメディカ</a></li>
  53.                           <li><a href="/products/list?category_id=47">プラスリストア</a></li>
  54.                           <li><a href="/products/list?category_id=48">ペロバーム</a></li>
  55.                           <li><a href="/products/list?category_id=49">マグバーム</a></li>
  56.                         </ul>
  57.                         <ul>
  58.                           <li><a href="/products/list?category_id=50">リポC</a></li>
  59.                           <li><a href="/products/list?category_id=51">レカルカ</a></li>
  60.                           <li><a href="/products/list?category_id=33">beautiful skin</a></li>
  61.                           <li><a href="/products/list?category_id=57">Luscious Lips®</a></li>
  62.                           <li><a href="/products/list?category_id=34">JMEC be</a></li>
  63.                           <li><a href="/products/list?category_id=35">M DEAR</a></li>
  64.                         </ul>
  65.                         <ul>
  66.                           <li><a href="/products/list?category_id=36">MSS</a></li>
  67.                           <li><a href="/products/list?category_id=37">Ogshi</a></li>
  68.                           <li><a href="/products/list?category_id=38">Pure</a></li>
  69.                           <li><a href="/products/list?category_id=39">WiQo</a></li>
  70.                           <li><a href="/products/list?category_id=56">ROHTO</a></li>
  71.                         </ul>
  72.                       </div>
  73.                     </div>
  74.                   </li>
  75.                   <li class="has-subnav"><a href="#"><span>カテゴリーから<br>探す</span></a>
  76.                     <div class="header__subnav header__subnav--category header__spnav-sub">
  77.                       <div class="header__subnav-container">
  78.                         <div class="header__spnav-sub-head">
  79.                           <div class="header__spnav-sub-back">
  80.                             <button><img src="/assets/images/common/btn_spnav-back.svg" alt="戻る"></button>
  81.                           </div>
  82.                           <div class="header__spnav-sub-ttl">カテゴリーから探す</div>
  83.                           <div class="header__spnav-sub-close">
  84.                             <button><img src="/assets/images/common/btn_spnav-close.svg" alt="閉じる"></button>
  85.                           </div>
  86.                           <div class="header__spnav-sub-search">
  87.                             <form>
  88.                               <input type="text" value="" placeholder="サイト内検索">
  89.                               <button type="submit" value="submit">検索</button>
  90.                             </form>
  91.                           </div>
  92.                         </div>
  93.                         <ul>
  94.                           <li>
  95.                             <div class="header__subnav-img">
  96.                               <picture>
  97.                                 <source srcset="/assets/images/common/img_subnav-01@2x.png 2x"><img src="/assets/images/common/img_subnav-01.png" role="presentation" alt="">
  98.                               </picture>
  99.                             </div>
  100.                             <div class="header__subnav-body"><a class="header__subnav-body-ttl" href="/products/list?category_id=26">スキンケア</a>
  101.                               <ul>
  102.                                 <li><a href="/products/list?category_id=15">アンチエイジング</a></li>
  103.                                 <li><a href="/products/list?category_id=16">乾燥対策</a></li>
  104.                                 <li><a href="/products/list?category_id=17">美白</a></li>
  105.                                 <li><a href="/products/list?category_id=24">毛穴</a></li>
  106.                                 <li><a href="/products/list?category_id=25">ニキビ</a></li>
  107.                               </ul>
  108.                             </div>
  109.                           </li>
  110.                           <li>
  111.                             <div class="header__subnav-img">
  112.                               <picture>
  113.                                 <source srcset="/assets/images/common/img_subnav-02@2x.png 2x"><img src="/assets/images/common/img_subnav-02.png" role="presentation" alt="">
  114.                               </picture>
  115.                             </div>
  116.                             <div class="header__subnav-body"><a class="header__subnav-body-ttl" href="/products/list?category_id=19">メイクアップ</a>
  117.                               <ul>
  118.                                 <li><a href="/products/list?category_id=18">しわ・ハリ</a></li>
  119.                               </ul>
  120.                             </div>
  121.                           </li>
  122.                           <li>
  123.                             <div class="header__subnav-img">
  124.                               <picture>
  125.                                 <source srcset="/assets/images/common/img_subnav-03@2x.png 2x"><img src="/assets/images/common/img_subnav-03.png" role="presentation" alt="">
  126.                               </picture>
  127.                             </div>
  128.                             <div class="header__subnav-body"><a class="header__subnav-body-ttl" href="/products/list?category_id=20">紫外線対策</a>
  129.                               <ul>
  130.                                 <li><a href="/products/list?category_id=20">紫外線対策</a></li>
  131.                               </ul>
  132.                             </div>
  133.                           </li>
  134.                           <li>
  135.                             <div class="header__subnav-img">
  136.                               <picture>
  137.                                 <source srcset="/assets/images/common/img_subnav-04@2x.png 2x"><img src="/assets/images/common/img_subnav-04.png" role="presentation" alt="">
  138.                               </picture>
  139.                             </div>
  140.                             <div class="header__subnav-body"><a class="header__subnav-body-ttl" href="/products/list?category_id=32">医療痩身</a>
  141.                               <ul>
  142.                                 <li><a href="/products/list?category_id=13">ダイエット</a></li>
  143.                               </ul>
  144.                             </div>
  145.                           </li>
  146.                           <li>
  147.                             <div class="header__subnav-img">
  148.                               <picture>
  149.                                 <source srcset="/assets/images/common/img_subnav-05@2x.png 2x"><img src="/assets/images/common/img_subnav-05.png" role="presentation" alt="">
  150.                               </picture>
  151.                             </div>
  152.                             <div class="header__subnav-body"><a class="header__subnav-body-ttl" href="/products/list?category_id=29">サプリメント</a>
  153.                               <ul>
  154.                                 <li><a href="/products/list?category_id=21">腸内環境</a></li>
  155.                                 <li><a href="/products/list?category_id=14">睡眠サポート</a></li>
  156.                               </ul>
  157.                             </div>
  158.                           </li>
  159.                           <li>
  160.                             <div class="header__subnav-img">
  161.                               <picture>
  162.                                 <source srcset="/assets/images/common/img_subnav-06@2x.png 2x"><img src="/assets/images/common/img_subnav-06.png" role="presentation" alt="">
  163.                               </picture>
  164.                             </div>
  165.                             <div class="header__subnav-body"><a class="header__subnav-body-ttl" href="/products/list?category_id=30">薄毛対策</a>
  166.                               <a class="header__subnav-body-ttl" href="/products/list?category_id=31">ED治療</a></div>
  167.                           </li>
  168.                         </ul>
  169.                       </div>
  170.                     </div>
  171.                   </li>
  172.                   <li><a href="/#pickup"><span>ピックアップ</span></a></li>
  173.                   <li><a href="/help/about"><span>クリニック<br>について</span></a></li>
  174.                 </ul>
  175.               </nav>
  176.               <div class="header__spnav-search">
  177.                 <form>
  178.                   <input type="text" value="" placeholder="サイト内検索">
  179.                   <button type="submit" value="submit">検索</button>
  180.                 </form>
  181.               </div>
  182.               {% if is_granted('ROLE_USER') %}
  183.               <div class="header__spnav-btn">
  184.                 <ul>
  185.                   <li class="header__spnav-btn--login"><a href="/logout">ログアウト</a></li>
  186.                   <li class="header__spnav-btn--regist"><a href="/mypage/">マイページ</a></li>
  187.                 </ul>
  188.               </div>
  189.               {% else %}
  190.               <div class="header__spnav-btn">
  191.                 <ul>
  192.                   <li class="header__spnav-btn--login"><a href="/mypage/login">ログイン</a></li>
  193.                   <li class="header__spnav-btn--regist"><a href="/entry">会員登録</a></li>
  194.                 </ul>
  195.               </div>
  196.               {% endif %}
  197.             </div>
  198.             <div class="header__ec-func">
  199.               {% if is_granted('ROLE_USER') %}
  200.               <nav>
  201.                 <ul>
  202.                   <li class="header__ec-func--logout">
  203.                     <a href="/logout" title="ログアウト"><span>ログアウト</span></a>
  204.                   </li>
  205.                   <li class="header__ec-func--mypage">
  206.                     <a href="/mypage/" title="マイページ"><span>マイページ</span></a>
  207.                   </li>
  208.                   <li class="header__ec-func--cart">
  209.                     <a href="/cart" title="カート"><span>カート</span></a>
  210.                   </li>
  211.                 </ul>
  212.               </nav>
  213.               {% else %}
  214.               <nav>
  215.                 <ul>
  216.                   <li class="header__ec-func--login"><a href="/mypage/login" title="ログイン"><span>ログイン</span></a></li>
  217.                   <li class="header__ec-func--regist"><a href="/entry" title="会員登録"><span>会員登録</span></a></li>
  218.                   <li class="header__ec-func--cart"><a href="/cart" title="カート"><span>カート</span></a></li>
  219.                 </ul>
  220.               </nav>
  221.               {% endif %}
  222.               {#<div class="header__search">#}
  223.               {#  <form>#}
  224.               {#    <input type="text" value="" placeholder="サイト内検索">#}
  225.               {#    <button type="submit" value="submit">検索</button>#}
  226.               {#  </form>#}
  227.               {#</div>#}
  228.             </div>
  230.             <div class="header__menu">
  231.               <button><img src="/assets/images/common/icon_menu.svg" alt="MENU"></button>
  232.             </div>
  233.           </div>
  234.         </div>
  235.       </header>