how to change widget area from aside to inline?

0 Views

Here is my website:
http://steelpony.com/shop/shop-by-look/

The header is trying to kill me. I have tried everything in my knowledge base in the header.php, page template, style.css, index.php and function.php to get rid of most of the white space, place the shopping cart and shopping cart search widgets inline with the navigation menu and nothing is working. Here is what I want the header to look like (minus the top line – don’t really care about that): http://www.shopthreedots.com/Home.aspx

Read More

I believe that the way to change the position of the widget areas is by changing the <aside> attributes but is it to display=inline that I change it? Here is the header code: 

</head>

<body <?php body_class(); ?>>

<div id="page" class="hfeed">

    <header id="branding" role="banner">
    <div align=center><div id="topcontent">

<div class="topcart">
        <div id="secondary" class="widget-area" role="complementary">
            <?php if ( ! dynamic_sidebar( 'sidebar-1' ) ) : ?>

                <aside id="archives" class="widget">
                    <h3 class="widget-title"><?php _e( 'Archives', 'twentyeleven' ); ?></h3>
                    <ul>
                        <?php wp_get_archives( array( 'type' => 'monthly' ) ); ?>
                    </ul>

                <aside id="meta" class="widget">
                    <h3 class="widget-title"><?php _e( 'Meta', 'twentyeleven' ); ?></h3>
                    <ul>
                        <?php wp_register(); ?>
                        <li><?php wp_loginout(); ?></li>
                        <?php wp_meta(); ?>
                    </ul>
                                </aside>

            <?php endif; // end sidebar widget area ?>
        </div><!-- #secondary .widget-area -->
<div align=center><strong><a href="/products-page/checkout/">Checkout</a></strong></div>

</div><!-- topcart -->

So, what do I change to

  1. get the widget areas inline and looking like the desired ex given vs my current page reality and

  2. How do I re divide up the header to eliminate the white space and create a logo area like in the example I gave?

Correction: changing the attributes from <aside> to <div display=inline> but I do not know if that is how to get the widget area on the same line as the navigation menu on line with those category tabs …

Post Views: 0

Related posts

Leave a Reply

1 comment

  1. I inspected your code. Go to your CSS file. You want to edit the id main content (#maincontent) to decrease the white space. I noticed that the height of this is 956px. You should decrease this amount, which should get rid of the white space.