Responsive e-commerce components within page wrapper

Steve Sedlock · September 2017

Hello! Looking at: http://give.uakron.edu/site/Ecommerce?store_id=1321 We're a newer Luminate customer (about 2 years), and implementation training was almost non-existent, so apologies in advance if this is an elementary question.

The page wrapper is responsive. Good there. In creating the store, in step 12 'Configure Standard Pages" all of them have Layout as Responsive in the drop down. But, as we see, the Store Home Page, Product Detail Page, check out, etc., are not behaving responsively.

I did change in step 2 "Store Availability" TeamRaiser Deployment and then the components (sloppily) become responsive, but then we lose all institutional branding.

Any ideas or suggestions?

Thanks!

Steve Sedlock · September 2017

And for the curious, here's the disastrous out-of-the-box "responsive" TeamRaiser wrapper and components: http://give.uakron.edu/site/Ecommerce?store_id=1341

Romany Nassief · October 2017

The page is not fluid due to a static div.responsive width definition "width: 896px;" in your css. However, in your TeamRaiser case, you have CSS override in your page header that force the width of div.responsive selector to 100%.

You can make the same override within your wrapper CSS or inside "Additional HTML Tags for HEAD Element"


div.responsive {
width:100% !important;
}

Steve Sedlock · October 2017

Perfect! Thank you, Romany!

Responsive e-commerce components within page wrapper

Comments

Categories