Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #16781

    Hi,

    I’m trying to add content above my products on my WooCommerce Shop page, the width seems to stop right before the “sort by” drop down. How can I get the content to span the entire width of the container and flow under the sorting dropdown?

    See: http://kitticraft.staging.wpengine.com/shop/

    Thanks,

    Lawrence

    #92822

    Hi,

    You would have to rebuild multiple templates. There are not many themes out there that offer this functionality. You have to place the entire sidebar price structure right on top of the store, in a div and then use floats, margins, padding to keep it in place while making room for the content. blackjackchamp.com uses such a structure to keep the right sidebar in place but the code will crash every single css validator despite somehow working in all browsers. Most sites just leave that empty space alone, or place something sticky there that stays with the visitor as they scroll up and down.

    Thanks,

    Nick

    #92823

    Hi Nick,

    Thank you for taking a look at my problem; I accept that often what appears to be simple is not simple to implement. I however am not sure if I have described my requirement properly, so I have chosen to make a mockup image to better illustrate what I am trying to achieve.

    Currently when I put content into my “Shop” page, the content appears left justified with a large space on the right as shown here(indicated by the red outline):

    http://kitticraft.staging.wpengine.com/download/KCImg1.jpg

    What I am trying to achieve is to have the content take up the remaining space on the right as shown here:

    http://kitticraft.staging.wpengine.com/download/KCImg2.jpg

    Is this unobtainable as you describe above?

    Thanks,

    Lawrence

    #92824

    Hi Lawrence,

    Thanks for the visual, Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    #top.archive.woocommerce-page .title_container {
    padding-right: 0;
    }

    That should do it!

    Regards,

    Devin

    #92825

    Hi Devin,

    Thank you very much, that’s exactly what I was looking for…

    Best regards,

    Lawrence

    #92826

    Hi Lawrence,

    Glad that Devin helped you. :)

    Cheers,

    Ismael

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Content Width above WooCommerce Products’ is closed to new replies.