app/template/default/index.twig line 1

Open in your IDE?
  1. {#
  2. This file is part of EC-CUBE
  4. Copyright(c) EC-CUBE CO.,LTD. All Rights Reserved.
  6. http://www.ec-cube.co.jp/
  8. For the full copyright and license information, please view the LICENSE
  9. file that was distributed with this source code.
  10. #}
  11. {% extends 'default_frame.twig' %}
  13. {% set body_class = 'front_page' %}
  15. {% block stylesheet %}
  16.     <style>
  17.         .slick-slider {
  18.             margin-bottom: 30px;
  19.         }
  21.         .slick-dots {
  22.             position: absolute;
  23.             bottom: -45px;
  24.             display: block;
  25.             width: 100%;
  26.             padding: 0;
  27.             list-style: none;
  28.             text-align: center;
  29.         }
  31.         .slick-dots li {
  32.             position: relative;
  33.             display: inline-block;
  34.             width: 20px;
  35.             height: 20px;
  36.             margin: 0 5px;
  37.             padding: 0;
  39.             cursor: pointer;
  40.         }
  42.         .slick-dots li button {
  43.             font-size: 0;
  44.             line-height: 0;
  45.             display: block;
  46.             width: 20px;
  47.             height: 20px;
  48.             padding: 5px;
  49.             cursor: pointer;
  50.             color: transparent;
  51.             border: 0;
  52.             outline: none;
  53.             background: transparent;
  54.         }
  56.         .slick-dots li button:hover,
  57.         .slick-dots li button:focus {
  58.             outline: none;
  59.         }
  61.         .slick-dots li button:hover:before,
  62.         .slick-dots li button:focus:before {
  63.             opacity: 1;
  64.         }
  66.         .slick-dots li button:before {
  67.             content: " ";
  68.             line-height: 20px;
  69.             position: absolute;
  70.             top: 0;
  71.             left: 0;
  72.             width: 12px;
  73.             height: 12px;
  74.             text-align: center;
  75.             opacity: .25;
  76.             background-color: black;
  77.             border-radius: 50%;
  79.         }
  81.         .slick-dots li.slick-active button:before {
  82.             opacity: .75;
  83.             background-color: black;
  84.         }
  86.         .slick-dots li button.thumbnail img {
  87.             width: 0;
  88.             height: 0;
  89.         }
  90.     </style>
  91. {% endblock %}
  93. {% block javascript %}
  94.     <script>
  95.         $(function() {
  96.         });
  98.     </script>
  99. {% endblock javascript %}
  101. {% block main %}
  102. {# 静的コンテンツ #}
  103. <ul class="add_link ft_e u_visible_pc">
  104.   <li>
  105.     <a href="https://ppplot.com/">
  106.       <img src="{{ asset('assets/img/plot/top_img01.jpg', 'user_data') }}" alt="">
  107.       <p>PHOTO<br>STUDIO</p>
  108.     </a>
  109.   </li>
  110.   <li>
  111.     <!--<a href="/user_data/photobooth">-->
  112.       <img src="{{ asset('assets/img/plot/top_img02.jpg', 'user_data') }}" alt="">
  113.       <!--<p>PHOTO<br>BOOTH</p>--><p>COMING<br>SOON</p>
  114.     <!--</a>-->
  115.   </li>
  116. </ul>
  117. <div style="display:none;">
  118.   <div class="add_txt" data-pos="11"><a href="/products/list?category_id=169&name=&tag1=&tag2=&word="><img src="{{ asset('assets/img/top/add_img01.jpg', 'user_data') }}" alt=""></a></div>
  119.   <div class="add_txt" data-pos="22"><a href="/products/list?category_id=&name=&tag1=47"><img src="{{ asset('assets/img/top/add_img02.jpg', 'user_data') }}" alt=""></a></div>
  120.   <div class="add_txt" data-pos="23"><a href="/products/list?category_id=&name=&tag1=&tag2=29&word="><img src="{{ asset('assets/img/top/add_img03.jpg', 'user_data') }}" alt=""></a></div>
  121.   <div class="add_txt" data-pos="30"><a href="/products/list?category_id=67&name=&tag1=&tag2=&word="><img src="{{ asset('assets/img/top/add_img04.jpg', 'user_data') }}" alt=""></a></div>
  122.   <div class="add_txt" data-pos="34"><a href="/products/list?category_id=8&name=&tag1=&tag2=&word="><img src="{{ asset('assets/img/top/add_img01.gif', 'user_data') }}" alt=""></a></div>
  123.   <div class="add_txt" data-pos="38"><a href="/products/list?category_id=61&name=&tag1=&tag2=&word="><img src="{{ asset('assets/img/top/add_img06.jpg', 'user_data') }}" alt=""></a></div>
  124.   <div class="add_txt" data-pos="45"><a href="/products/list?category_id=61&name=&tag1=&tag2=&word="><img src="{{ asset('assets/img/top/add_img05.jpg', 'user_data') }}" alt=""></a></div>
  125.   <div class="add_slide" data-pos="13">
  126.     <div class="item">
  127.       <img src="{{ asset('assets/img/plot/top_slide01.jpg', 'user_data') }}" alt="">
  128.     </div>
  129.     <div class="item">
  130.       <img src="{{ asset('assets/img/plot/top_slide02.jpg', 'user_data') }}" alt="">
  131.     </div>
  132.     <div class="item">
  133.       <img src="{{ asset('assets/img/plot/top_slide03.jpg', 'user_data') }}" alt="">
  134.     </div>
  135.     <div class="item">
  136.       <img src="{{ asset('assets/img/plot/top_slide04.jpg', 'user_data') }}" alt="">
  137.     </div>
  138.     <div class="item">
  139.       <img src="{{ asset('assets/img/plot/top_slide05.jpg', 'user_data') }}" alt="">
  140.     </div>
  141.     <div class="item">
  142.       <img src="{{ asset('assets/img/plot/top_slide06.jpg', 'user_data') }}" alt="">
  143.     </div>
  144.     <div class="item">
  145.       <img src="{{ asset('assets/img/plot/top_slide07.jpg', 'user_data') }}" alt="">
  146.     </div>
  147.     <div class="item">
  148.       <img src="{{ asset('assets/img/plot/top_slide08.jpg', 'user_data') }}" alt="">
  149.     </div>
  150.     <div class="item">
  151.       <img src="{{ asset('assets/img/plot/top_slide09.jpg', 'user_data') }}" alt="">
  152.     </div>
  153.     <div class="item">
  154.       <img src="{{ asset('assets/img/plot/top_slide10.jpg', 'user_data') }}" alt="">
  155.     </div>
  156.     <div class="item">
  157.       <img src="{{ asset('assets/img/plot/top_slide11.jpg', 'user_data') }}" alt="">
  158.     </div>
  159.   </div>
  160. </div>
  161. <div class="u_visible_sp">
  162.   <div class="mv_slide">
  163.     <div class="item">
  164.       <img src="{{ asset('assets/img/plot/top_slide01_sp.jpg', 'user_data') }}" alt="">
  165.     </div>
  166.     <div class="item">
  167.       <img src="{{ asset('assets/img/plot/top_slide02_sp.jpg', 'user_data') }}" alt="">
  168.     </div>
  169.     <div class="item">
  170.       <img src="{{ asset('assets/img/plot/top_slide03_sp.jpg', 'user_data') }}" alt="">
  171.     </div>
  172.     <div class="item">
  173.       <img src="{{ asset('assets/img/plot/top_slide04_sp.jpg', 'user_data') }}" alt="">
  174.     </div>
  175.   </div>
  176.   <p class="mv_txt">Plotは、撮影・展示関係者向けのレンタルショップです。スタイリストが集めた、インテリア、キッチンアイテムなどを撮影・ディスプレイ用にお貸出ししています。北堀江（大阪市）の実店舗では、在庫品を自由に組み合わせ撮影できるブースを設けております。ぜひご利用ください。</p>
  177. </div>
  178. {# 静的コンテンツ ここまで #}
  180. <div class="c_bg">
  181. {% if mainProducts %}
  182.   <ul class="item_list home">
  183.   {% for Product in mainProducts %}
  184.       {% if date('-30days') < Product.create_date %}<li class="new">{% else %}<li>{% endif %}
  185.           <a href="{{ url('product_detail', {'id': Product.id}) }}">
  186.               <img src="{{ asset(Product.main_list_image|no_image_product, 'save_image') }}" alt="{{ Product.name }}" {% if loop.index > 5 %} loading="lazy"{% endif %}>
  187.               <dl>
  188.                   <dt>{{ Product.brand }}<br>
  189.                   <dt>{{ Product.name }}</dt>
  190.                   <dd class="price">
  191.                   {% for prdClass in Product.ProductClasses %}
  192.                   {% if prdClass.ClassCategory1 is not empty %}
  193.                   {% if not ("併設スタジオ利用時のみ" in prdClass.ClassCategory1.name) %}
  194.                   <p>{{ prdClass.ClassCategory1.name }}<i>{{ prdClass.price01|price }}</i></p>
  195.                   {% endif %}
  196.                   {% endif %}
  197.                   {% endfor %}
  198.                   </dd>
  199.                   <dd>{{ Product.number }}</dd>
  200.               </dl>
  201.           </a>
  202.           <div class="favo">
  203.             <form action="{{ url('product_add_favorite', {id:Product.id}) }}" method="post">
  204.               {% if Product.SearchWord is empty %}
  205.                   <button type="submit" class="favorite" title="{{ 'お気に入りに追加'|trans }}"></button>
  206.               {% else %}
  207.                   <button type="submit" class="favorite done" disabled="disabled" title="{{ 'お気に入りに追加済です。'|trans }}"></button>
  208.               {% endif %}
  209.             </form>
  210.           </div>
  211.       </li>
  212.   {% endfor %}
  213.   </ul>
  214. {% endif %}
  215.   <dl class="item_search">
  216.     <dt class="ft_e">Item Search</dt>
  217.     <dd>
  218.       <form method="get" class="searchform" action="/products/list">
  219.         <input type="text" name="word" placeholder="キーワードを入力ください" />
  220.         <input type="submit" value="検索する" />
  221.       </form>
  222.     </dd>
  223.   </dl>
  224. </div>
  227. {# 静的コンテンツ #}
  228. <div class="u_visible_sp">
  229.   <ul class="h_list ft_e">
  230.     <li>
  231.       <a href="">
  232.         <img src="{{ asset('assets/img/plot/booth_img.jpg', 'user_data') }}" alt="">
  233.         <!--<p>PHOTO BOOTH</p>--><p>COMING SOON</p>
  234.       </a>
  235.     </li>
  236.     <li>
  237.       <a href="">
  238.         <img src="{{ asset('assets/img/plot/photo_img.jpg', 'user_data') }}" alt="">
  239.         <p>PHOTO STUDIO</p>
  240.       </a>
  241.     </li>
  242.   </ul>
  243. </div>
  244. <section class="top_flow">
  245.   <div class="c_inner">
  246.     <h2 class="c_ttl ft_e">Rental flow</h2>
  247.     <div class="box">
  248.       <div class="scroll">
  249.         <ul>
  250.           <li><img src="{{ asset('assets/img/plot/flow01.svg', 'user_data') }}" alt=""></li>
  251.           <li><img src="{{ asset('assets/img/plot/flow02.svg', 'user_data') }}" alt=""></li>
  252.           <li><img src="{{ asset('assets/img/plot/flow03.svg', 'user_data') }}" alt=""></li>
  253.           <li><img src="{{ asset('assets/img/plot/flow04.svg', 'user_data') }}" alt=""></li>
  254.         </ul>
  255.       </div>
  256.       <div class="c_btn"><a href="/guide">See more</a></div>
  257.     </div>
  258.   </div>
  259. </section>
  260. {# 静的コンテンツ ここまで #}
  263. {# RSS #}
  264. <section class="top_topics">
  265.   <div class="c_inner">
  266.     <h2 class="c_ttl ft_e">Topics</h2>
  267.   </div>
  268. {% if news %}
  269.   <ul>
  270.     {% for item in news %}
  271.     <li>
  272.       <a href="{{ item.link }}">
  273. {% if item.img %}
  274.         <img src="{{ item.img }}" alt="">
  275. {% else %}
  276.         <img src="{{ asset('assets/img/dummy/topics_img01.jpg', 'user_data') }}" alt="">
  277. {% endif %}
  278.         <p><small class="ft_e">{{ item.date }}</small>{{ item.title }}<br><i class="ft_e">{{ item.category }}</i></p>
  279.       </a>
  280.     </li>
  281.     {% endfor %}
  282.   </ul>
  283. {% endif %}
  284.   <div class="c_inner">
  285.     <div class="c_more ft_e"><a href="https://ppplot.com/news/">See more</a></div>
  286.   </div>
  287. </section>
  290. {# NEW ITEMS #}
  291. <section class="top_new">
  292.   <div class="c_inner">
  293.     <h2 class="c_ttl ft_e">New Items</h2>
  294.   </div>
  295.   <div class="c_bg">
  296. {% if newProducts %}
  297.     <ul class="item_list n">
  298.     {% for Product in newProducts %}
  299.         {% if date('-30days') < Product.create_date %}<li class="new">{% else %}<li>{% endif %}
  300.             <a href="{{ url('product_detail', {'id': Product.id}) }}">
  301.                 <img src="{{ asset(Product.main_list_image|no_image_product, 'save_image') }}" alt="{{ Product.name }}" {% if loop.index > 5 %} loading="lazy"{% endif %}>
  302.                 <dl>
  303.                     {% if Product.brand %}
  304.                     <dt>{{ Product.brand }}</dt>
  305.                     {% endif %}
  306.                     <dt>{{ Product.name }}</dt>
  307.                     <dd class="price">
  308.                     {% for prdClass in Product.ProductClasses %}
  309.                     {% if prdClass.ClassCategory1 is not empty %}
  310.                     {% if not ("併設スタジオ利用時のみ" in prdClass.ClassCategory1.name) %}
  311.                     <p>{{ prdClass.ClassCategory1.name }}<i>{{ prdClass.price01|price }}</i></p>
  312.                     {% endif %}
  313.                     {% endif %}
  314.                     {% endfor %}
  315.                     </dd>
  316.                     <dd>{{ Product.number }}</dd>
  317.                 </dl>
  318.             </a>
  319.             <div class="favo">
  320.               <form action="{{ url('product_add_favorite', {id:Product.id}) }}" method="post">
  321.                 {% if Product.SearchWord is empty %}
  322.                     <button type="submit" class="favorite" title="{{ 'お気に入りに追加'|trans }}"></button>
  323.                 {% else %}
  324.                     <button type="submit" class="favorite done" disabled="disabled" title="{{ 'お気に入りに追加済です。'|trans }}"></button>
  325.                 {% endif %}
  326.               </form>
  327.             </div>
  328.         </li>
  329.     {% endfor %}
  330.     </ul>
  331. {% endif %}
  334. {# 静的コンテンツ #}
  335.     <div class="c_inner">
  336.       <div class="entry_news">
  337.         <dl>
  338.           <dt>新商品のご案内</dt>
  339.           <dd>新入荷情報をご希望の方は<br>LINE<!--かE-mail-->をご登録ください。</dd>
  340.         </dl>
  341.         <ul>
  342.           <li class="line"><a target="_blank" href="https://liff.line.me/1645278921-kWRPP32q/?accountId=416dellc">LINE登録はこちらをクリック</a></li>
  343.           <!--<li class="mail">
  344.             <form>
  345.               <input type="email" name="mail" placeholder="メールアドレスをご記入ください" />
  346.               <input type="submit" value="登録" />
  347.             </form>
  348.           </li>-->
  349.         </ul>
  350.       </div>
  351.     </div>
  352.   </div>
  353. </section>
  354. <section class="top_service">
  355.   <div class="c_inner">
  356.     <h2 class="c_ttl ft_e">Our Service</h2>
  357.     <div class="u_visible_pc pc">
  358.       <ul>
  359.         <li>
  360.           <a href="https://ppplot.com/">
  361.             <img src="{{ asset('assets/img/plot/service01.jpg', 'user_data') }}" alt="">
  362.           </a>
  363.         </li>
  364.         <li>
  365.           <!--<a href="/user_data/photobooth">-->
  366.             <img src="{{ asset('assets/img/plot/service02.jpg', 'user_data') }}" alt="">
  367.           <!--</a>-->
  368.         </li>
  369.         <li>
  370.           <!--<a href="">-->
  371.             <img src="{{ asset('assets/img/plot/service03.jpg', 'user_data') }}" alt="">
  372.           <!--</a>-->
  373.         </li>
  374.       </ul>
  375.     </div>
  376.   </div>
  377.   <div class="u_visible_sp sp"></div>
  378. </section>
  379. {# 静的コンテンツ ここまで #}
  381. {% endblock %}