Return to previous page

Single Product Layout new version"interior"

This topic has 4 replies, 2 voices, and was last updated 7 years ago ago by Rose Tyler

Olexi

Participant

December 7, 2017 at 14:01

Hi,

just have checked your new version “interior” and totally like the single product page layout with the big product image that goes also below the header.

https://www.8theme.com/demo/xstore/interior/product/ajanta-digital-wall-clock-3/

What configuration is needed to get this view for my existing store?

Would be great if you could give some advice so we don’t have to find out everything by testing.

Many thanks 🙂

#179582 Copied

3 Answers

Rose Tyler

Support staff

December 7, 2017 at 14:33

Hello,

Please see screenshots of single product settings from our demo http://prntscr.com/hkbpai http://prntscr.com/hkbpi0
Let us know if you need any further assistance.

Regards

#179585 Copied

Olexi

Participant

December 11, 2017 at 10:44

Hi and many thanks … and what header configuration is used for that?

#179839 Copied
Rose Tyler

Support staff

December 11, 2017 at 10:58
Hello,

You’re welcome!
Please see screenshots http://prntscr.com/hlwefw http://prntscr.com/hlwejn http://prntscr.com/hlwenz http://prntscr.com/hlwesq
Also, in the interior version we use this custom css code for the header and fixed header (Theme Options > Styling > Custom css):
```
.fixed-header{
    border-top:none;
}
.header-color-dark .cart-summ:hover .cart-bag .badge-number{
    color:#fff !important;
}
.page-heading.bc-size-large .title {
    margin-bottom: 10px;
}
.template-container .page-heading .col-md-12 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: column-reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
}
.navbar-header.show-in-header{
    width:125px !important;
}
.header-xstore .menu-wrapper, .header-xstore .header-logo, .header-xstore .navbar-header {
    width: auto;   
}
header.header ul li,
.fixed-header ul li{
    padding:0 24px !important;
}
header.header ul li a:after,
.fixed-header ul li a:after{
    background-color:#302e2e !important;
    margin-top:5px;
}
```
Regards
#179841 Copied
Viewing 4 results - 1 through 4 (of 4 total)