New page template- strange page layout request

I want/need to create a new page template that combines layouts of different page templates. The template flow would go:


full width (content)

sidebar (standard main content width); sidebar (standard sidebar size)


I’m not sure how to set up the template to allow this kind of layout. The need for this is predicated on the idea that only one nivo slider plugin seems to work (FIAGallery) without breaking basic WP/BP functionality, and uses images from the media gallery, but it can only be deployed to a page using short code, and I need the banner to extend the width of the page. The rest of the content for the page I’d prefer to be standard content, but will live with it if I need to work with an oversized text box (hoping that will work).

Thoughts? Feedback? Guidance?

  • Arnold
    • El Macho WP

    And the full width area would have the slider in it?

    I do this often by putting a “feature” box there with a new widget area in it. Then drop a text widget with the shortcode in it there and style it out in CSS. something like here:

    That actual has two widget in the area, one for the slider and one for the contact form. To do that you need to define the area and put the sidebar code in and register the new sidebar for the widgets.

    To do that you need something like this in the template below the header.

    <?php if ( is_active_sidebar('feature-widget')): ?>
    <div id="feature_widget" class="feature_widget">
    <ul class="sidebar_list">
    <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('feature-widget') ) : endif; ?>
    <div style="clear:both;"></div>
    <?php endif; ?>

    That defines the widget area. Then in your functions you need to register the new area.

    if(function_exists('register_sidebar') ){
    'id' => 'feature-widget',
    'name' => 'Feature',
    'before_widget' => '<li id="%1$s" class="widget %2$s">' . "n",
    'after_widget' => "</li>n",
    'before_title' => '<h3 class="widgettitle">',
    'after_title' => '</h3>'

    And so your widgets will run shortcodes.

    /*** Allow shortcodes in widgets ***/
    add_filter('widget_text', 'do_shortcode');

    The rest would be styling the above with CSS


  • frostdawn
    • New Recruit

    I tried the above. The new widget area is registered and I have tested that I can deploy it to a page template and it renders. However declaring it after the header just lines it up to the far right of the page above the standard sidebar widget area. And that’s even after putting a div with css clear:both after the header AND after the new widget. I can only position the new sidebar using relative css positioning. And even doing that, the width of the sidebar is still fixed. How can I break a sidebar out of it’s fixed width? That seems to be at the core of my dilemma. If I can figure that, I can probably stumble my way through 2-3 different ways to handle the page layout.


  • Arnold
    • El Macho WP

    Like I said you’ll need to add CSS to get it to display the way you want. Most likely you’ll need to change the width of the feature_widget div

    width: 100%; /* or some pixel value*/

    Probably other things like the ul and li tags will need styling

  • frostdawn
    • New Recruit

    Thanks, actually after my post last night, I stumbled across the css I needed. I copied an existing sidebar and repurposed it. I noticed within it, it had 2 main css definitions (defined within base.css in the _inc directory). One was “sidebar” the other was “center-column”. I made copies of the style definitions, renamed and tweaked them accordingly, and voila- “fixed” custom sidebar widget. :slight_smile:

    Thanks again for the recommendations Arnold. By the way, I’m curious which plugin you’re using for the nivo slider on your site?

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.