Navigation
Archive / Make woocommerce related products full width of screen
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • March 20, 2017 at 11:08 pm #1414582
    waterbarry
    Participant

    The related products section at the bottom of the product page seems to be contained within the main left div, which means it isn’t the full width of the screen. Is there any way to make it the full with of the screen without running into the dange of it overlapping the content of the sidebar?

    March 20, 2017 at 11:10 pm #1414583
    waterbarry
    Participant
    This reply has been marked as private.
    March 21, 2017 at 8:42 am #1414903
    Joao
    Moderator

    Hi There,

    As you have a side bar the products wont go over the sidebar.

    If you want to have them full width you need to remove the side bar and have a full width page.

    Hope it helps

    Joao

    March 21, 2017 at 11:34 am #1415168
    waterbarry
    Participant

    Hi Joao,

    I’m looking to move the related items out of that section, can it be done in the templates?

    March 22, 2017 at 12:52 am #1415841
    Friech
    Moderator

    Hi There,

    Add this on Custom > Global CSS

    footer.x-colophon.top {
	margin-top: 25px;
}

    And this on Custom > Global JavaScripts.

    (function($) {
   $(".single-product .related.products").insertAfter(".single-product .offset.cf");
})(jQuery);

    Thanks.

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1414582 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>