Sticky header contact info on mobile only for all pages

Thank you again for the nice theme and great support.

I am using Header and Footer scripts and implemented the Header Contact Info as you can see (see ***.com).

I need to make this Header Contact Info sticky on mobile, not only on the home page, but when visiting all pages. By sticky I mean that when the user scrolls down, the top of the page still shows the Header Contact Info.

  1. How do I achieve this on mobile only?
  2. If I ever wanted to do this for mobile and also desktop, what do I need to add to question #1 to do this on desktop?

I saw other threads talking about this, but they were too convoluted and didn’t find anything specific to mobile.

Thank you in advance.

Hello there,

Try doing the below steps:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box

      if( $('.header-contact').length ) {

  1. Update
  2. Add this CSS code to Appearance > Customize > Additional CSS from dashboard.
    .site-header {
      padding-top: 0;

    .site-header .header-wrap {
      margin-top: 20px;