[Support request] Hide sidebar in one product page

[Pedro]

Hello! On my site I have the template set up like this:

Sidebar / Content

I have seen that in each product, you can choose to show and hide, I have selected for the sidebars to hide them.

The problem is that although I keep the changes, the product that I have hidden the sidebar keeps showing.

How can I hide the sidebar for that single product?

[Leo]

Hi there,

You should be able to Edit product and use the layout metabox:
https://docs.generatepress.com/article/sidebar-layout/#different-sidebar-layouts-for-individual-pages-and-posts

I just tried and it works.

Make sure you clear WP Rocket cache.

Let me know 🙂

[Pedro]

Hi leo! Thanks for answering.

Those steps that you indicate to me already I have done them previously, I have cleared cache but it continues showing itself the lateral bar in the product that I want to hide it.

[Leo]

Can you link me to the actual page in question?

And do you mind doing this first?
https://www.screencast.com/t/sAZU8h7bUcE

[Pedro]

Sure, the product page is: https://www.celuganga.co/producto/soporte-adhesivo/

[Leo]

And you’ve chosen No sidebar in the metabox of that page?

Any Layout Elements that might be conflicting?

And again, please disable WP Rockets for now.

[Pedro]

Hi leo! Thanks for answering.

If I have disabled the sidebar for this product, it was the first thing I did before opening this post in the forum.

I have already disabled WP Rocket before and it is not the problem, anyway I will leave it disabled in case you need it.

And with respect to conflicts, there should not be.

[Leo]

Very weird.

The metabox worked fine on my Prime install but doesn’t work on Target install for some reason.

I’ll do some more digging.

Did you happen to import Target for your site by any chance?

Trying to find some lead..

[Pedro]

Hi Leo! Thanks for answering.

The template that I am using on my site is the one that comes by default in GP, ​​I have never imported any template in that site.

What I have done, is to add something of the CSS code of other templates, if you want to check the code is the following:

/** Ocultar cupon en carrito**/
.coupon{display:none;}

/** Ocultar estimación de gastos en carrito **/
p.woocommerce-shipping-destination {
    display: NONE;
}

/** Texto blanco para actualizar carrito **/
.woocommerce button.button[name="update_cart"]:disabled {
    color: #fff;
}

/** Tamaño correcto botón seguir comprando **/
.woocommerce-page table.cart td.actions .button {
    box-sizing: border-box;
}

/** Añadir al carrito botón grande**/
.woocommerce div.product form.cart div.quantity {
    float: none;
    width: 100%;
    margin-right: 0;
}

.woocommerce div.product form.cart .button {
    width: 100%;
    margin-top: 10px;
    padding: 20px;
}
@media (max-width:768px) {
    .single-product .do-quantity-buttons div.quantity {
        justify-content: flex-start !important
    }
}

/** Botón checkout en página de carrito **/
.woocommerce .proceed-to-checkout-above-cart .checkout-button {
    float: right;
    margin: 0 20px 1em 0; /* 20px adjusts the right hand offset */
}

@media (max-width: 768px) {
    .woocommerce .proceed-to-checkout-above-cart .checkout-button {
        display: block;
        float: none;
        text-align: center;
        margin-right: 0;
        padding-top: 20px; 
        padding-bottom: 20px;
    }

}

/** Mostrar porcentaje de ahorro en página de producto **/
.sale-perc {
    display: inline;
    margin-left: 10px;
    padding: 2px 10px;
    background-color: #181818;
    color: #fff;
	  font-size: 15px; /* Adjust font size */
}
.woocommerce div.product p.price, .saved-sale {
    display: inline-block;
}

/** Sección de confianza después de contenido principal **/
.flex-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.flex-col {
    padding-left: 40px;
    padding-bottom: 20px;
    position: relative;
    flex: 1 0 25%;
    box-sizing: border-box
}

.col-icon {
    position: absolute;
    left: 0;
    top: 0;
}
/* Title Styles */
.col-title {
    display: block;
    color: 121212;
}
/*Text Styles */
.col-text {
    color: #878787;
}

@media (max-width:768px) and (min-width:420px) {
    .flex-col {
        flex: 1 0 50%
    }
}

@media (max-width:419px) {
    .flex-col {
        flex: 1 0 100%
    }
}

/** Reubicación iconos en menú principal **/
@media (min-width: 768px) {
    .main-navigation ul {
        display: flex;
        justify-content: center;
    }
    .main-navigation li.wc-menu-item {
        order: 100;
    }
}

/** Linea horizontal antes de menú principal **/
.site-header {
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

/** Estilo para texto y botón de header **/
a.button.home-hero {
    color: #363636;
    background-color: #fafafa;
    box-shadow: 1px 5px 4px rgba(0, 0, 0, 0.5);
}
a.button.home-hero:hover {
	  color: #ffffff;
    background-color: #121212;
}
.page-hero.home-hero h1 {
    text-shadow: 1px 5px 4px rgba(0, 0, 0, 0.5);
}

[Leo]

Hey! We believe we have this fixed in the next version of GPP 1.8.3.

Are you ok to wait? If not I can also send you a copy?

[Pedro]

Hi leo! Thanks for answering!

And by when would the new version of GPP come out?

[Leo]

No idea yet. Give us a shout if you want the new version to test it out first 🙂

[Author]

Posts