0

Please assist. I have followed a tutorial to create a custom template with a sidebar. The sidebar has been implemented successfully and the page template is called "Custom page Template Wizard". The issue I am having is getting the sidebar to appear left and content on the right. The theme I am using is Ultra7

The issue I am having lies within this test page: https://devtest2017.aquatiere.co.uk/product-filter-wizard/

The desired layout is not showing up. Does this require css?

Also, main page content is not displaying. How do I resolve this?

This is custom_page.php coding:

<?php
/*
 * Template Name: Custom Page Template Wizard
 */
?>

<?php get_header(); ?>

      <?php if ( is_active_sidebar( 'wizard-sidebar' ) ) : ?>
    <?php dynamic_sidebar( 'wizard-sidebar' ); ?>
<?php endif; ?>

<?php get_footer(); ?>

This is my custom sidebar template coding (sidebar-wizard.php):

<div id="sidebar">
   <ul>
      <?php
      if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('wizard-sidebar') ) :
      endif; ?>
   </ul>
</div>

AND I have added this code to my themes functions.php file:

if ( function_exists('register_sidebar') ) {
register_sidebar(array(
'name' => 'Wizard Layout Page',
'id' => 'wizard-sidebar',
'description' => 'Appears as the sidebar on the custom wizard page',
'before_widget' => '<div style="height: 280px"></div><li id="%1$s" class="widget %2$s">',
'after_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'after_title' => '</h2>',
));
}

This is what the page looks like at present:

enter image description here

enter image description here

enter image description here

0

First you need to show the content

<?php the_content() ?>

Then you need to add containers for the sidebar and content

<div class="main-content ten columns">
    <?php the_content() ?>
</div>
<div class="side-bar two columns">
    <?php if ( is_active_sidebar( 'wizard-sidebar' ) ) : ?>
        <?php dynamic_sidebar( 'wizard-sidebar' ); ?>
    <?php endif; ?>
</div>

The theme already has column CSS set, so add the correct class to each container as above e.g 'columns two'

Hope this helps

  • Hi Jim, thank you for your answer. I am assuming this code goes in custom_page.php ? – Bradley Oct 30 '17 at 12:59
  • yes, it will need to go into the custom_page.php – Jim-miraidev Oct 30 '17 at 13:14
  • the CSS should be .main-content.ten.columns { styles} & .side-bar.two.columns { styles } and i missed the brackets off the_content(), sorry – Jim-miraidev Oct 30 '17 at 15:13
0

I have updated my custom_page.php to this:

<?php get_header (); ?>

<div class="main-content ten columns">
    <?php the_content ?>
</div>
<div class="side-bar two columns">
    <?php if ( is_active_sidebar( 'wizard-sidebar' ) ) : ?>
        <?php dynamic_sidebar( 'wizard-sidebar' ); ?>
    <?php endif; ?>
</div>

<?php get_footer(); ?>

AND added this css:

    .main-content.ten columns {
        width: 1000px;
        float: right;
    }
   .side-bar.two columns {
        width: 200px;
        float: left;
    }

However, the widget is still showing at the bottom of the page and no content is visible. Please assist

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.