WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce - excelling eCommerce
[resolved] Sidebar sitting below content on product page. (10 posts)

  1. imtylerporter
    Member
    Posted 1 year ago #

    I am using the Lucid Theme from elegantthemes.com .

    After installing woocommerce to my theme my sidebar dropped into my footer. With a little research I was able to use hooks to raise my side bar back into the proper space. However, the styling in my footer is now not showing properly. This is the code I placed into my functions.php file:

    remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10);
    remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10);
    
    add_action('woocommerce_before_main_content', create_function('', 'echo "<div id=\"main-area\">";'), 10);
    
    add_action('woocommerce_before_main_content', create_function('', 'echo "<div class=\"container\">";'), 10);
    
    add_action('woocommerce_before_main_content', create_function('', 'echo "<div id=\"content-area\">";'), 10);
    
    add_action('woocommerce_before_main_content', create_function('', 'echo "<div class=\"clearfix\">";'), 10);
    
    add_action('woocommerce_before_main_content', create_function('', 'echo "<div id=\"left-area\">";'), 10);
    
    add_action('woocommerce_after_main_content', create_function('', 'echo "</div>";'), 10);

    With this code the page is still showing a little screwy.

    Here is how it should look:
    http://www.iputtheforkdown.com/about

    Here is how the shop page looks now with the messed up footer:
    http://www.iputtheforkdown.com/shop

    Any help is greatly appreciated!

    http://wordpress.org/extend/plugins/woocommerce/

  2. Roy Ho
    Member
    Posted 1 year ago #

    Not too sure what you mean "messed up"? I clicked both links and they look identical to me?

  3. imtylerporter
    Member
    Posted 1 year ago #

    There are actually not identical. As the products do not sit in the content body properly.

    I ended up deleting all code out of my functions.php then I duplicated my page.php file, renamed it woocommerce.php and uploaded it to my theme folder.

    I then Deleted the code:
    '<?php get_template_part('loop', 'page'); ?>'

    and added:
    '<?php woocommerce_content('loop', 'page'); ?>'

    That is where both links currently stand. It's not pretty, but it functions.

  4. Roy Ho
    Member
    Posted 1 year ago #

    I am confused...You asked us to look at the footer...That's what I was referring to.

  5. imtylerporter
    Member
    Posted 1 year ago #

    Right, at which point I wasn't getting anywhere with the code I had originally posted so I updated it with the code above. As instructed on the Woocommerce support docs, I tried both methods, first the hooks now the duplicate of the page.php.

    Now, it's not sitting in the body properly.

  6. Roy Ho
    Member
    Posted 1 year ago #

    Ok can you point out exact what the issue is so I can see what you're seeing so I can help you?

  7. imtylerporter
    Member
    Posted 1 year ago #

    You bet, I appreciate the help!

    Here is a screenshot:
    http://iputtheforkdown.com/screenshot.jpg

    I would like to be have my products sitting in the body like my video is in my about section. I believe the div id for that area is "left-area." This is the code I have plugged in on my woocommerce.php

    '<?php get_header(); ?>

    <div id="content-area" class="clearfix">

    <div id="left-area">
    <?php get_template_part('includes/breadcrumbs', 'page'); ?>

    <?php woocommerce_content('loop', 'page'); ?>

    <?php if ( 'on' == et_get_option('lucid_show_pagescomments') ) comments_template('', true); ?>
    </div> <!-- end #left-area -->

    <?php get_sidebar(); ?>
    </div> <!-- end #content-area -->

    <?php get_footer(); ?>'

    Thanks again!

  8. Roy Ho
    Member
    Posted 1 year ago #

    Assuming what you want is that box around the content like the one with the video, then it is because you're missing <article> tag with the class of "entry". The class "entry" is what is giving that style.

    So in your case all you need is wrap the "LOOP" with either <article class="entry"> or a <div class="entry"> and don't forget to close it after the "LOOP".

  9. imtylerporter
    Member
    Posted 1 year ago #

    That's exactly the class that I was missing! Thank you for you help!

  10. hamzahali
    Member
    Posted 1 year ago #

    Hello,

    can you give me the exact code u used to make is usable.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.