Can I move product text to center or left side of page?

Hi,

I have disabled the left hand image space and now I would like to move the product text to the center or left side of the product page. Can this be done?

Hello @chevril,

Thanks for writing in! :slight_smile:

To achieve these layouts, add either of the following codes to X > Theme Options > CSS:

  1. For the centered text layout:
.woocommerce div.product .summary {
    float: left !important;
    clear: both !important;
    width: 100%;
}
.woocommerce div.product .images {
    width: 100%;
}
.woocommerce div.product .images
.woocommerce div.product .images img {
    margin: 0 auto;
    display: block;
}
  1. For the left side text/right side product layout:
.woocommerce div.product .summary {
    float: left !important;
    clear: left !important;
    width: 48%;
}
.woocommerce div.product .images {
     float: right !important;
}
.woocommerce div.product .images figure [data-thumb]:nth-child(4n+1) {
     margin-left: 20%;
}
@media (max-width: 767px) {
     .woocommerce div.product .images figure [data-thumb]:nth-child(4n+1) {
          margin-left: 0;
     }
     .woocommerce div.product .images {
         width: 100% !important;
     }
   .woocommerce div.product .images
   .woocommerce div.product .images img {
        margin: 0 auto;
        display: block;
    }
    .woocommerce div.product .images {
        float: none !important;
    }
}

Hope this helps.

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.