app/Plugin/TabaCMS2/Resource/template/default/post.twig line 1

Open in your IDE?
  1. {#
  2. Copyright (C) SPREAD WORKS Inc. All Rights Reserved.
  4. For the full copyright and license information, please view the LICENSE
  5. file that was distributed with this source code.
  6. #}
  7. {% extends 'default_frame.twig' %}
  9. {% set category_list = TabaCMSCategoryList({type_data_key:'news'}) %}
  11. {% set new_post_list = TabaCMSPostList({ page_count: 5, type_data_key: 'news', category_data_key: app.request.query.get('category_data_key') }) %}
  13. {% set body_class = 'tabacms_post_page' %}
  15. {# 投稿データの取得 #}
  16. {% set post = TabaCMSPost() %}
  18. {% block javascript %}
  19. {{ TabaCMSAsset('script.js','script')|raw }}
  20. {{ post.getScript|raw }}
  21. <script>
  22.     function openLineShare() {
  23.         const lineUrl = 'https://social-plugins.line.me/lineit/share?url=';
  24.         const url = location.href;
  25.         window.open(`${lineUrl}${url}`)
  26.     }
  27. </script>
  28. {% endblock javascript %}
  30. {% block stylesheet %}
  31. {{ TabaCMSAsset('style.css','style')|raw }}
  32. {% endblock stylesheet %}
  34. {% block main %}
  35. <div class="flex w-[990px] justify-between mx-auto mt-[40px] lg:mt-6 lg:w-full lg:flex-col lg:items-center lg:px-4">
  36.     <div class="w-[720px] text-[#000000] md:w-full">
  37.         {% if post.getThumbnail is not empty %}
  38.                 <img src="{{ asset(post.getThumbnail,'save_image') }}" class="w-full h-[500px] object-cover mb-10 md:mb-3">
  39.         {% endif %}
  40.         <div class="px-[60px] md:px-0">
  41.             <h1 class="text-3xl font-extralight text-center mb-5 md:text-xl md:mb-3">{{ post.getTitle|raw }}</h1>
  42.             <div class="flex gap-4 text-sm mb-10 md:mb-6 md:text-xs md:gap-3">
  43.                 <time class="">
  44.                     {{ post.getPublicDate|date('Y.m.d') }}更新
  45.                 </time>
  46.                 <span>{{ post.category.categoryName }}</span>
  47.             </div>
  48.             <section>
  49.                 {{ post.getBody|raw }}
  50.             </section>
  51.         </div>
  52.         <div
  53.             class="hover mt-20 mb-6 md:mt-10"
  54.             onclick="openLineShare()"
  55.         >
  56.             <img class="h-8 w-8 md:mx-auto" src="{{ asset('assets/icon/line-icon.svg') }}" />
  57.         </div>
  58.         <div class="flex justify-center mb-10 md:mb-7">
  59.             <a href="{{ url('user_data',{'route':'reading'}) }}" class="text-lg hover underline md:text-sm">
  60.                 <p>記事一覧</p>
  61.             </a>
  62.         </div>
  63.         {% if new_post_list is not empty %}
  64.             <div class="pt-8 px-20 lg:py-4 border-t-2 border-[#CCC] lg:px-0">
  65.                 <h3 class="text-lg font-bold mb-6 md:mb-4 md:text-base">新着記事：</h3>
  66.                 <ul class="flex flex-col gap-4">
  67.                     {% for post in new_post_list %}
  68.                         <a href="{{ post.getURI }}" class="hover">
  69.                             <li class="flex gap-[2%] md:gap-[4%]">
  70.                                 <img src="{{ asset(post.thumbnail|no_image_product, 'save_image') }}" class="w-[28%] h-[88px] object-contain md:w-[18%]"></img>
  71.                                 <p class="w-[68%] underline md:text-sm md:w-[80%]">{{ post.title }}</p>
  72.                             </li>
  73.                         </a>
  74.                     {% endfor %}
  75.                 </ul>
  76.             </div>
  77.         {% endif %}
  78.     </div>
  79.     <div class="w-[200px] lg:w-full flex flex-col lg:pt-4 lg:border-t-2 border-[#CCC]">
  80.         <div class="text-sm font-light text-[#000] lg:p-7 lg:mt-7 lg:bg-[#F6F6F6]">
  81.             <p>Category :</p>
  82.             <div class="mt-[10px] text-[#000000] lg:font-normal">
  83.             {% for category in category_list %}
  84.                 <p>
  85.                     <button class="category-button w-full text-left my-[2px] underline hover" data-category-key="{{ category.dataKey }}">
  86.                         {{ category.categoryName }} ({{ category.postCount }})
  87.                     </button>
  88.                 </p>
  89.             {% endfor %}
  90.             </div>
  91.         </div>
  92.         <div class="mb-[20px] hover mt-[25px] lg:hidden">
  93.             <a href="{{ url('user_data',{'route': 'showroom'}) }}">
  94.                 <img src="{{ asset('assets/img/info/showroom.svg') }}" class="w-full">
  95.             </a>
  96.         </div>
  97.         <div class="second mb-[20px] hover lg:hidden">
  98.             {# <a href="{{ url('contact_catalog') }}"> #}
  99.                 <img src="{{ asset('assets/img/info/catalog.svg') }}" class="w-full">
  100.             {# </a> #}
  101.         </div>
  102.     </div>
  103. </div>
  104. <div class="w-[990px] mx-auto lg:w-full">
  105.    <div class="w-full lg:px-12 mt-[130px] md:mt-10 mb-8 md:mb-0">
  106.             <ul id="breadcrumbs" class="border-t-[1px] border-[#EFEFEF] py-5 md:py-4 w-full md:text-xs text-sm tracking-widest flex items-center gap-x-1">
  107.                 <li>
  108.                     <a href="{{ url('homepage') }}" class="hover">
  109.                         <span>HOME</span>
  110.                     </a>
  111.                 </li>
  112.                 <span>/</span>
  113.                 <li>
  114.                     <a href="{{ url('user_data',{'route': 'reading'}) }}" class="hover">
  115.                         <span>お知らせ</span>
  116.                     </a>
  117.                 </li>
  118.                 <span>/</span>
  119.                 <li>
  120.                     <span>{{post.title}}</span>
  121.                 </li>
  122.             </ul>
  123.         </div>
  124. </div>
  125. {% endblock %}