ループスルーカテゴリ - ワードプレスウィジェット

Question

カテゴリから5つの投稿をループするウィジェットを作成したいと思います。 ユーザーはウィジェットオプションからカテゴリを選択できます。

今は、ハードコードされた値（Cat ID）を持つウィジェットとループを作成します。

私が必要としているのは、このハードコード化された値を動的選択/オプションに変更して、ユーザーがウィジェットオプションから選択できるようにカテゴリドロップダウンリストから引き出すことです。

<?php 
 

 
// Initiate roms_widget_menu ends here 
 
    class roms_widget_menu extends WP_Widget { 
 
    function __construct() { 
 
     parent::__construct(
 
     // Base ID 
 
     'roms_widget_menu', __('Romaisa Mege menu widget', 'roms_menu_widget_domain'), array('description' => __('Designed to display a category post in mega menu (Widgets in Menus plugin must be installed)', 'roms_menu_widget_domain'),)); 
 
    } 
 
    public function widget($args, $instance) { 
 
     $title = apply_filters('widget_title', $instance['title']); 
 
     $social_menu_title = apply_filters('widget_title', $instance['title']); 
 
     // before and after widget arguments are defined by themes 
 
     echo $args['before_widget']; 
 
     // Romaisa Widget user front Content 
 
     ?> 
 
<div class="row small-up-1 medium-up-5 large-up-5"> 
 
    <?php 
 
     $args = array(
 
      'cat' => 2, 
 
      'posts_per_page' => 5, //This is the hard coded value 
 
     ); 
 
     $widget_module_menu_qry = new WP_Query($args); 
 
     
 
     ?> 
 
    <?php if ($widget_module_menu_qry->have_posts()) : while ($widget_module_menu_qry->have_posts()) : $widget_module_menu_qry->the_post(); ?> 
 
    <div class="column column-block"> 
 
     <div class="megamenu-item"> 
 
     <?php if (has_post_thumbnail()) : ?> 
 
     <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"> 
 
     <?php the_post_thumbnail(array(230, 130)); ?> 
 
     </a> 
 
     <?php else: ?> 
 
     <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><img src="<?php echo get_template_directory_uri(). '/romisa-assets/img/sample/230x130.png'; ?>" alt=""> 
 
     </a> 
 
     <?php endif; ?> 
 
     <div class="megamenu-item-typo text-left"> 
 
      <h5 class="text-left"> 
 
       <a class="megamenu-item-typo-title trans1" href="<?php the_permalink(); ?>"><b><?php the_title(); ?></b></a> 
 
      </h5> 
 
      <p><?php echo excerpt(22); ?></p> 
 
      <h6 class="megamenu-item-date"><i class="fa fa-calendar"></i> <?php the_time('F j, Y'); ?> &nbsp;</h6> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    <?php endwhile; endif; ?> 
 
</div> 
 
<?php 
 
    // /Romaisa Widget user front Content 
 
    echo $args['after_widget']; 
 
    } 
 
    // Widget Backend 
 
    public function form($instance) { 
 
    if (isset($instance[ 'title' ])) { $title = $instance['title']; } 
 
    else { $title = __('Custom HTML for Menu', 'roms_menu_widget_domain'); } 
 
    
 
    ?> 
 
<!-- Example for widget category select dropdown that need to be dynamic --> 
 
<select> 
 
<option>Category 1</option> 
 
<option>Category 2</option> 
 
</select> 
 
<?php 
 
} 
 
// Updating widget replacing old instances with new 
 
public function update($new_instance, $old_instance) { 
 
$instance = array(); 
 
$instance['title'] = (!empty($new_instance['title'])) ? strip_tags($new_instance['title']) : ''; 
 
return $instance; 
 
} 
 
} // Class roms_widget_menu ends here

Answer 1

以下のコードを確認してください：

class roms_widget_menu extends WP_Widget 
{ 
    function __construct() 
    { 
     parent::__construct(
     // Base ID 
      'roms_widget_menu', __('Romaisa Mege menu widget', 'roms_menu_widget_domain'), array('description' => __('Designed to display a category post in mega menu (Widgets in Menus plugin must be installed)', 'roms_menu_widget_domain'),)); 
    } 

    public function widget($args, $instance) 
    { 
     $title = apply_filters('widget_title', $instance['title']); 
     $social_menu_title = apply_filters('widget_title', $instance['title']); 
     // before and after widget arguments are defined by themes 
     echo $args['before_widget']; 
     // Romaisa Widget user front Content 
     ?> 
     <div class="row small-up-1 medium-up-5 large-up-5"> 
      <?php 
      if (! empty($title)) 
      { 
       echo $args['before_title'] . esc_html($title) . $args['after_title']; 
      } 
      $q_args = array(); 
      if (isset($instance['cat'])) { 
       $q_args["cat"] = $instance['cat']; 
      } 
      $q_args['posts_per_page'] = (isset($instance['number_of_posts']) ? (int)$instance['number_of_posts'] : 5); 
      $widget_module_menu_qry = new WP_Query($q_args); 

      ?> 
      <?php if ($widget_module_menu_qry->have_posts()) : while ($widget_module_menu_qry->have_posts()) : $widget_module_menu_qry->the_post(); ?> 
       <div class="column column-block"> 
        <div class="megamenu-item"> 
         <?php if (has_post_thumbnail()) : ?> 
          <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"> 
           <?php the_post_thumbnail(array(230, 130)); ?> 
          </a> 
         <?php else: ?> 
          <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><img 
             src="<?php echo get_template_directory_uri() . '/romisa-assets/img/sample/230x130.png'; ?>" 
             alt=""> 
          </a> 
         <?php endif; ?> 
         <div class="megamenu-item-typo text-left"> 
          <h5 class="text-left"> 
           <a class="megamenu-item-typo-title trans1" 
            href="<?php the_permalink(); ?>"><b><?php the_title(); ?></b></a> 
          </h5> 
<!--       <p>--><?php //echo excerpt(22); ?><!--</p>--> 
          <h6 class="megamenu-item-date"><i class="fa fa-calendar"></i> <?php the_time('F j, Y'); ?> 
           &nbsp;</h6> 
         </div> 
        </div> 
       </div> 
      <?php endwhile; 
      wp_reset_postdata(); 
      endif; ?> 
     </div> 
     <?php 
     // /Romaisa Widget user front Content 
     echo $args['after_widget']; 
    } 

    // Widget Backend 
    public function form($instance) 
    { 
     if (isset($instance['title'])) { 
      $title = $instance['title']; 
     } else { 
      $title = __('Custom HTML for Menu', 'roms_menu_widget_domain'); 
     } 
     if (isset($instance['cat'])) { 
      $cat = $instance['cat']; 
     } else { 
      $cat = ''; 
     } 
     if (isset($instance['number_of_posts'])) { 
      $np = $instance['number_of_posts']; 
     } else { 
      $np = 5; 
     } 
     ?> 
     <p> 
      <label for="<?php echo esc_attr($this->get_field_id('title')); ?>"><?php esc_html_e('Title:', 'text-domain'); ?></label> 
      <input class="widefat" id="<?php echo esc_attr($this->get_field_id('title')); ?>" 
        name="<?php echo esc_attr($this->get_field_name('title')); ?>" type="text" 
        value="<?php echo esc_attr($title); ?>"/> 
     </p> 
     <p> 
      <label for="<?php echo esc_attr($this->get_field_id('cat')); ?>"><?php esc_html_e('Categories:', 'text-domain'); ?></label> 
      <select class="widefat" id="<?php echo esc_attr($this->get_field_id('cat')); ?>" 
        name="<?php echo esc_attr($this->get_field_name('cat')); ?>"> 
       <?php 
       $terms = get_terms('category', array(
        'hide_empty' => false, 
       )); 
       if (count($terms) > 0) { 
        foreach ($terms as $term) { 
         echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; 
        } 
       } 
       ?> 
      </select> 
     </p> 
     <script> 
      document.getElementById("<?php echo esc_attr($this->get_field_id('cat')); ?>").value = 
       "<?php echo $cat; ?>"; 
     </script> 
     <p> 
      <label for="<?php echo esc_attr($this->get_field_id('number_of_posts')); ?>"><?php esc_html_e('Number Of Posts:', 'text-domain'); ?></label> 
      <input class="widefat" id="<?php echo esc_attr($this->get_field_id('number_of_posts')); ?>" 
        name="<?php echo esc_attr($this->get_field_name('number_of_posts')); ?>" type="text" 
        value="<?php echo esc_attr($np); ?>"/> 
     </p> 
     <?php 
    } 

// Updating widget replacing old instances with new 
    public function update($new_instance, $old_instance) 
    { 
     $instance['title'] = strip_tags($new_instance['title']); 
     $instance['number_of_posts'] = $new_instance['number_of_posts']; 
     $instance['cat'] = $new_instance['cat']; 
     return $instance; 
    } 
} // Class roms_widget_menu ends here