Utilizing WordPress’ Theme Customizer to pick web page templates that replace format within the preview

I wasn’t positive the place to publish this query..

I just lately found WordPress’ “Theme Customizer” and am utilizing it to make the pages simpler to replace for shoppers. Quite than the usual approach of modifying every particular person web page, clicking replace, after which visiting the web page to see the modifications, I like how the Theme Customizer robotically previews your modifications on the best facet.

I’m attempting to get an understanding of how far I can go along with the Theme Customizer earlier than I’m going all out on this…

I’ve created a “Dwelling Web page” setting/part/management pictured right here:

And right here is the code for this:

operate get_page_templates_select() {
 $teh_cats = get_page_templates();
 foreach ( $teh_cats as $template_name => $template_filename ) {
     if (stripos(strtolower($template_filename), 'dwelling') !== false) {
        $outcomes[$template_filename] = $template_name;
     }
   }
   return $outcomes;
   echo $outcomes;
}

operate get_categories_select() {
 $teh_cats = get_categories();
    $outcomes;
    $rely = rely($teh_cats);
    for ($i=0; $i < $rely; $i++) {
      if (isset($teh_cats[$i]))
        $outcomes[$teh_cats[$i]->slug] = $teh_cats[$i]->identify;
      else
        $rely++;
    }
  return $outcomes;
}

operate prowordpress_customize_register( $wp_customize ) {

    // Settings, Sections, and Controls are outlined right here

    // HOME PAGE

    $wp_customize->add_setting( 'home_page_text' , array(
        'default'           => 'That is the house web page textual content',
        'sort'              => 'possibility',
        'transport'         => 'refresh',
    ));
    $wp_customize->add_section( 'prowordpress_content_customizations' , array(
        'title'       => __('Dwelling Web page', 'prowordpress'),
        'description' => __('Modify the Dwelling Web page', 'prowordpress'),
        'precedence'    => 30,
    ));
    $wp_customize->add_control( 'home_page_text_control', array(
        'label'      => __( 'Dwelling Web page Textual content', 'prowordpress' ),
        'part'    => 'prowordpress_content_customizations',
        'settings'   => 'home_page_text',
        'sort'       => 'textarea',
    ));

    $wp_customize->add_setting( 'home_page_template_select' , array(
        'default'           => 'take a look at',
        'sort'              => 'theme_mod',
        'transport'         => 'refresh',
    ));
    $wp_customize->add_control(
        new WP_Customize_Control(
            $wp_customize,
            'home_page_template_select',
            array(
                'label'          => __( 'Dwelling web page template:', 'blankwptheme' ),
                'part'        => 'prowordpress_content_customizations',
                'settings'       => 'home_page_template_select',
                'sort'           => 'choose',
                'decisions'        => get_page_templates_select(),
            )
        )
    );

    $wp_customize->add_setting( 'home_page_posts_select' , array(
        'default'           => 'take a look at',
        'sort'              => 'theme_mod',
        'transport'         => 'refresh',
    ));
    $wp_customize->add_control(
        new WP_Customize_Control(
            $wp_customize,
            'home_page_posts_select',
            array(
                'label'          => __( 'Which publish sort to show on the house web page?', 'blankwptheme' ),
                'part'        => 'prowordpress_content_customizations',
                'settings'       => 'home_page_posts_select',
                'sort'           => 'choose',
                'decisions'        => get_categories_select(),
            )
        )
    );

}

add_action( 'customize_register', 'prowordpress_customize_register' );

Dwelling 1 template:

<?php /* Template Identify: Dwelling */

get_header();

echo "theme chosen: " . get_theme_mod('home_page_template_select');

$page_id = 5;
update_post_meta( $page_id, '_wp_page_template',    get_theme_mod('home_page_template_select') );

?>

<div type="margin-top:60px;">

    <?php echo get_option('home_page_text'); ?>

</div>

<div type="margin-top:60px;">

    <?php
  $args = array(
    'category_name' => get_theme_mod('home_page_posts_select'),
    'posts_per_page' => 5
  );

  // Shows the class's identify
  echo "<h3>" . get_category_by_slug($args['category_name'])->identify . "    </h3>";
  $the_query = new WP_Query( $args );

   // The Loop
  if ( $the_query->have_posts() ) :
     //echo "<ul>";
    whereas ( $the_query->have_posts() ) : $the_query->the_post();
      if(has_post_thumbnail($post->ID)){ 
        $thumbsrc = get_the_post_thumbnail($post->ID,'medium'); 
      } else {
        $thumbsrc = "<img src="photos/no_featured_image.jpg" alt="" . get_the_title() . "">";
      }
      $hyperlink = get_permalink();
      $title = get_the_title();
      $content material = get_the_content();
      echo '<div type="width:302px;float:left;peak:502px;margin- proper:20px;">';
     echo $thumbsrc . '<br>';
      echo '<a href="' . $hyperlink . '">'  . $title . '</a><br>' . $content material;
      echo '</div>';
    endwhile;
    //echo "</ul>";
  endif;

  // Reset Submit Knowledge
  wp_reset_postdata();

?>

</div>

<?php get_footer(); ?>

You may see within the screenshot I’ve added a choose menu for “Dwelling web page template”…

Is it potential I might set it up the place the consumer can select an current “web page template” from this choose menu after which have the web page preview/format on the best hand facet robotically inherit the web page template settings and alter the format in real-time?

Once more, I am simply attempting to grasp if that is possible, and if anybody has tried one thing related earlier than. I notice this will require some AJAX or one thing alongside these traces.

Thanks for the assistance!