X Pro Header

Support
#1

Hi,

I’m currently using X Pro to build the header. I was wondering if I can insert the header in a section of the content area?

Tony

#2

Hi Tony,

What you built on the header builder is intended for the header position only. Thinking of the end result you want, what you have achieve in the header can also be achieve using the content builder. To achieve this with ease, you may save element as preset so you can easily design it in the content builder. Hope this helps.

#3

The heading has the “content scrolling” enabled so I’m trying to insert the header into content area. There’s absolutely no way to do this?

#4

Hi @wtony,

Can you share the site URL with this setup? And please share where you want to add it and how exactly. The domain where you are using PRO on your site is not accessible. We would love to check further before giving a detailed suggestion. Thank you.

#5

I wanted to put the feature part inside the content area

#6

Hi @wtony,

Yes, content scrolling is only applicable on header. If you want it on content builder, that is possible with customization. You might want to check this. Hope this helps.

#7

can you suggest which code to use in the link that you’ve suggested? Where do i insert the code?

#8

Will theme X ever put content scrolling in the content area. I think this feature is quite useful.

#9

Hi @wtony,

You can try adding the following CSS on a section where you want overflow. Inspect section > Customize tab > Element CSS:

$el{ overflow-x:scroll;}

I will add this as a feature request. Though we can’t promise it will be implemented right away. Thank you.

#11

almost there, how do I have the section columns not collapse in mobile view?

#12

Hello @wtony,

Thanks for updating the thread. :slight_smile:

Please inspect the Section > Column under Customize > Setup > Class add a class name. After that add following CSS under X/Pro > Theme Options > CSS:

@media only screen and (max-width: 600px) {
  .x-column {
    width: auto !important;
    float: left !important;
    margin-right: 2% !important;
}
}

Note: Please change class name x-column-mobile-layout as per your requirement.

To learn more about media queries please take a look at following resource.

https://www.w3schools.com/css/css_rwd_mediaqueries.asp

Thanks.

#13

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