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

Open in your IDE?
  1. {% set config = repository('Plugin\\CMBlogPro42\\Entity\\Config').get() %}
  2. {# 重要なお知らせカテゴリを指定 #}
  3. {% set category_id = 2 %}
  4. {% set blogs = repository('Plugin\\CMBlogPro42\\Entity\\Blog').getListByCategoryId(category_id) %}
  6. {% block javascript %}{% endblock %}
  8. {% if blogs is defined and blogs|length > 0 %}
  10.     <section id="import_notice">
  11.         <div class="import_notice__inner">
  12.             <div class="import_notice__flex">
  13.                 <h2 class="home_brown_h2">重要なお知らせ</h2>
  14.                 <ul class="import_notice__list">
  15.                     {% for blog in blogs %}
  16.                     <li>
  17.                         <a href="{{ url('cm_blog_pro_page_detail', {'id': blog.slug ? blog.slug : blog.id}) }}">
  18.                             <span class="date">{{ blog.release_date|date('Y.m.d')}}</span>
  19.                             <span class="news_text">
  20.                                 <span class="ttl">{{ blog.getTitle|raw }}</span>
  21.                             </span>
  22.                         </a>
  23.                     </li>
  24.                     {% endfor %}
  25.                 </ul>
  26.             </div><!--/.import_notice__flex-->
  27.         </div><!--/.import_notice__inner-->
  28.     </section>
  29. {% endif %}
  33. {#
  34. {% block stylesheet %}
  36. <style>
  37. .cm_blog_plugin .list_blog .ec-topicpath__item {
  38.     display: initial;
  39. }
  41. .cm_blog_plugin .list_blog .ec-topicpath__item a:hover {
  42.     text-decoration: underline;
  43. }
  45. .cm_blog_plugin .item_blog_image {
  46.     width: 100% !important;
  47.     height: 248px;
  48.     object-fit: cover;
  49. }
  51. .cm_blog_plugin .list_blog .list_category_link{
  52.     color: #337ab7;
  53.     padding: .2rem 0.5rem;
  54.     font-size: 1.3rem;
  55.     border-right: 1px solid #ddd;
  56. }
  57. .cm_blog_plugin .blog_category li:last-child .list_category_link{
  58.     border: none;
  59. }
  61. .cm_blog_plugin .blog_category{
  62.     margin: 0;
  63.     padding: 0;
  64.     display: flex;
  65.     flex-wrap: wrap;
  66. }
  67. .cm_blog_plugin .blog_category li{
  68.     display: initial;
  69. }
  70. .cm_blog_plugin .figure__main_image{
  71.     margin: 0;
  72.     padding: 0;
  73.     display: grid;
  74.     justify-content: stretch;
  75.     align-items: flex-end;
  76. }
  77. .cm_blog_plugin .item_blog_image,
  78. .cm_blog_plugin figcaption {
  79.     padding: 0;
  80.     grid-column: 1/2;
  81.     grid-row: 1/2;
  82. }
  83. .cm_blog_plugin figcaption {
  84.     text-align: center;
  85.     padding: 0.4rem 2rem;
  86.     font-size: 1rem;
  87.     background-color: rgba(0,0,0,.7);
  88.     color: #fff;
  89.     overflow: hidden;
  90.     white-space: normal;
  91.     word-wrap: break-word;
  92. }
  94. .cm_blog_plugin .list_blog h3{
  95.     margin-top: 10px;
  96.     margin-bottom: 1px;
  97.     font-size: 16px;
  98.     line-height: 1.4;
  99.     word-break: break-word;
  100. }
  101. .cm_blog_plugin .blog_release_date {
  102.     font-size: 1rem;
  103.     margin-bottom: 1rem;
  104. }
  106. @media screen and (max-width: 768px){
  107. .cm_blog_plugin .item_blog_image {
  108.     width: 100% !important;
  109.     height: 35vw;
  110.     object-fit: cover;
  111.     }
  112. .cm_blog_plugin .cm_blog_plugin{
  113.     padding: 10vw 0 !important;
  114.     }
  115. }
  116. </style>
  118. {% endblock %}
  120. {% if blogs is defined and blogs|length > 0 %}
  121. <div class="ec-categoryRole cm_blog_plugin">
  123.     <div class="ec-role">
  124.         <div class="ec-secHeading">
  125.             <span class="ec-secHeading__en">{{config.getTitleEn}}</span>
  126.             <span class="ec-secHeading__line"></span>
  127.             <span class="ec-secHeading__ja">{{config.getTitleJp}}</span>
  128.         </div>
  129.         <div class="ec-shelfRole" style="padding-top: 20px">
  130.             <ul class="ec-shelfGrid list_blog">
  131.                 {% for blog in blogs %}
  132.                     <li class="ec-shelfGrid__item">
  133.                         <a href="{{ url('cm_blog_pro_page_detail', {'id': blog.slug ? blog.slug : blog.id}) }}">
  134.                             <figure class="figure__main_image">
  135.                             {% if blog.getMainListImage %}
  136.                                 <img src="{{ asset(blog.getMainListImage|no_image_product, 'save_image') }}" class='item_blog_image'></img>
  137.                                 {% else %}
  138.                                 <img src="{{ asset(''|no_image_product, 'save_image') }}" class='item_blog_image'></img>
  139.                             {% endif %}
  140.                             {% if blog.getFigCaption %}
  141.                                 <figcaption>{{ blog.getFigCaption }}</figcaption>
  142.                             {% endif %}
  143.                             </figure>
  144.                         </a>
  145.                         <h3>
  146.                             <a href="{{ url('cm_blog_pro_page_detail', {'id': blog.slug ? blog.slug : blog.id}) }}">
  147.                                 {{ blog.getTitle|length > 40 ? blog.getTitle|striptags|replace({('&nbsp;'):' '})|slice(0, 40)|raw ~ '...' : blog.getTitle|raw }}
  148.                             </a>
  149.                         </h3>
  150.                         <div class="blog_release_date">公開日：{{ blog.release_date|date('Y年m月d日')}}</div>
  151.                         <ul class="blog_category">
  152.                             {% for category in blog.getBlogCategories %}
  153.                                 <li class="{{category.getCategory.class|raw}}">
  154.                                     <a href="{{ url('cm_blog_pro_page_list', {categories: [category.getCategory().getId()]}) }}" class="list_category_link">
  155.                                     {{ category.getCategory.getName|length > 15 ? category.getCategory.getName|striptags|replace({('&nbsp;'):' '})|slice(0, 15)|raw ~ '...' : category.getCategory.getName|raw }}
  156.                                     </a>
  157.                                 </li>
  158.                             {% endfor %}
  159.                         </ul>
  160.                     </li>
  161.                 {% endfor %}
  162.             </ul>
  163.         </div>
  164.     </div>
  165. </div>
  166. {% endif %}
  167. #}