

<!doctype html>

<html <?php echo get_language_attributes(); ?>>
<?php echo $__env->make('partials.head', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
<body id="blog" <?php body_class() ?>>
<div class="pacewrap">

  <div id="container">
  <?php echo $__env->make('partials.header', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>

  <article class="mt-md-5 pt-md-5">
    <section class="main">

      <div class="row plr-0 col-10 offset-1 pb-5">
        <div class="container">


          <header class="post_titlearea">
            <div class="container clearfix d-flex align-items-center">
              <h1 class="en float-left"><?php echo get_the_title(); ?></h1>
            </div>
          </header>

          <div id="latest_news" class="mt-md-0 border-bottom-0">
            <ul id="result" class="row post_row">
              <!-- ここに投稿を表示 -->
              <?php
                $number = 4;
                $paged = (int) get_query_var('paged');
                $args = [
                  'post_type' => 'post', // 検索したいカスタム投稿タイプ
                  'posts_per_page' => 8,
                  'paged'      => get_query_var('paged') ? intval(get_query_var('paged')) : 1,
                ];

                $the_query = new WP_Query($args);
                ?>
                <?php while ($the_query->have_posts()): $the_query->the_post(); $rankcount++; ?>
                  <li class="col-lg-3 col-md-6 col-sm-12 post_box">
                    <a href="<?php echo e(get_permalink()); ?>" class="thumbnail">
                      <?php if(has_post_thumbnail()): ?>
                        <?php the_post_thumbnail( 'thumb-square', array('class' => 'img-fluid') ); ?>
                      <?php else: ?>
                        <img src="<?= App\asset_path('images/notfound.jpg'); ?>" alt="RECALM" class="img-fluid" />
                      <?php endif; ?>
                    </a>
                    <time class="en"><?php echo e(get_the_date()); ?></time>
                    <h2><a href="<?php echo e(get_permalink()); ?>"><?php echo get_the_title(); ?></a></h2>
                  </li>
                  <?php if ($rankcount == $number ): ?>
                    <!-- <hr class="w-100 mb-5 pb-3"> -->
                  <?php endif; ?>
                <?php endwhile; ?>
                <?php wp_reset_postdata(); ?>
            </ul>

            <div id="pagination">
              <div class="clearfix">
                <?php
                  if ($the_query->max_num_pages > 1) {
                    echo paginate_links(array(
                    'base' => get_pagenum_link(1) . '%_%',
                    'format' => 'page/%#%/',
                    'current' => max(1, $paged),
                    'total' => $the_query->max_num_pages,
                    'prev_text' => '&#xf053;&nbsp;&nbsp;&nbsp;Prev',
                    'next_text' => 'Next&nbsp;&nbsp;&nbsp;&#xf054;'
                    ));
                  }
                ?>
              </div>
            </div>



           </div>

    </section>
  </article>







  <?php do_action('get_footer') ?>
  <?php echo $__env->make('partials.footer', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>
  <?php wp_footer() ?>

</div>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <script type="text/javascript">
      jQuery(document).ready(function() {
        $('.cat-all').addClass('active');
      });
      //===============================================
      //    カテゴリー選択
      //_________________________________
      $('.news_select').on('change', function() {

        // 選択時 active classを付与
        $('.check_cat').parent('label').removeClass('active');
        $(this).parent('label').addClass('active');
        let cat = this.value;
        // console.log(cat); // テスト用 - 何を選択したか確認用
        $.ajax({
          type: 'post',
          url: ajaxUrl, // functions.phpで指定した admin-ajax.php のURLが格納された変数
          cache: false,
          timeout: 3000,
          dataType: 'html',
          data: {
            'action': 'select_category_ajax_php', // 登録したアクション名
            'cat': cat // functions.phpでPOST値として渡す
          },
          success: function(data) {
            // console.log(data); // テスト用 - 送られてきたデータの確認用
            $('#result').html(data);
          }
        });
      });
    </script>

</body>
</html>
