[jgavilanParticipant]

Dear X theme staff,

I am trying to make one of the rows I have created to stick on top of the page under the header. I am not a coder but a wordpress super admin with design and art degrees.

I am interested in doing this because I need our phone and other details to appear on page at all times, but I also want the header to appear all times in some pages. I mean both things. Due to the further development that I will have to work on in the next weeks I might need to include any kind of content: text, image etc inside that fixed row.

I would like to be able to choose one or multiple rows to stick and get fixed on top of the page under the header.

I have tried to add the position CSS tag in the style css location provided in each content band, but since I am not a coder I am not sure if that is the thing to do.

I have several plugins but I am not able to find any that gives us the funcionalities we need.

Is there any way to achieve my goal? Do you have any idea that could help? if so I’d be inmensely grateful.

Thanks in advance and warmest regards,

J Gavilan

[NicoModerator]

Hi There,

Thanks for writing.

Would you mind sharing us some screenshot of whay you want to achieve so that we could suggest code easily and could not affect something else which are not included to what you want.

Don’t forget to set it as private reply and also your URL.

Thanks

[jgavilanParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi there,

Thanks for your kind words and trusting in our work.

Please add the following CSS under Customize -> Custom -> CSS :

.x-slider-container.above {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
}

.x-slider-container.below {
  position: fixed;
  top: 50px;
  left: 0;
  right: 0;
  z-index: 1030;
}

Hope it helps.

[jgavilanParticipant]

This reply has been marked as private.

[ZeshanMember]

Hi there,

This is because the header is created in a content band. You can try using following CSS code along with the above provided CSS:

.x-slider-container.below+.x-main {
    padding-top: 75px;
}

This will add padding top to the main content.

Thanks.

[jgavilanParticipant]

This reply has been marked as private.

[ChristopherModerator]

Glad we could help you and you are welcome.

[Author]

Posts