Header problems with X Pro

Support
#1

Hi there

I am using your X Pro theme but am still unable to make the header and website as I am used to with normal X theme and as I would like it.

I switched to X Pro because I wanted more options for header design but I cannot seem to make it work as I would like it.

Therefore I switched to another theme but I would really like to use X Pro for my website.

To see my current website with X Pro:

http://earpleasure.audio

To see the front end use this password: ovsXL2017 (case sensitive)

I would like my header to be exactly like you can see here (using a different theme):

https://eartreasures.shop

To see the front end login with password: ovsXL2017 (case sensitive)

So here’s a summary of what I would like:

  1. header should be completely responsive. Not the case at all right now.

  2. Top bar with secondary menu on the right (font type Pathway Gothic, color black, hover blue) and address, e-mail & phone on the left (also font Pathway Gothic, color black, hover e-mail & phone link blue). I can’t seem to change the font, the color, etc in header builder pro. Right now the secondary menu is white and not visible.

  3. main navigation below header. Also font Pathway Gothic. Color White. Blue hover. Not able to change this either?? I would like to use a home logo next to menu item home (I changed it in menu setting but nothing seems to happen?)

  4. USP’s below header also responsive. Not the case.

  5. Page titles are missing on all pages. How do I set page titles again when using my custom header made with Header Pro?

If you want I can send you all my login credentials and FTP info via a private message. I would LOVE to have support on this.

Hope you could help me!

Greetings

#2

Hey there,

1 - Responsive display might require manual setup.

For 2-3. Please follow along (pause, slow down and rewind as needed) with these screen recording of steps. It is quite lengthy if I write it down. It would also be beneficial if you also review Pro tutorials in our Knowledge Base.

4 - Not sure what part is the USP. If you mean the texts with green check icon, it behaves like your other site. Please provide more details.

5 - This is currently not a feature available in Pro. This could be possible with custom development. I will give you a guide but please note that this requires custom code so issues arising from the use of it and any enhancements would be outside the scope of our support. Go to http://spidergems.com/create-shortcode-wordpress-page-title/ and copy the title shortcode function to your functions.php. To display the page title, insert the shortcode in a Headline element

I’ve tested it and it works. Please note that this currently involves custom code. A similar feature request has been sent previously so our core developers might add an official way to get the post title.

Thanks.

#3

Hi there @christian_y

Thanks for your very nice video’s!! I’ve implemented everything you showed in the video. You can see result here: http://earpleasure.audio (login with pass: ovsXL2017)

BUT… Regarding my USP’s: I’ve made them in my header again but they are not responsive. When the screen gets smaller the text is pushed to the top, over the bar with my header image element. How can I sort this so it stays in the same bar and remains visible on all sizes?

Thanks in advance! :slight_smile:

#4

@christian_y

I have some more questions. Hope you can answer them :slight_smile:

  1. I implemented the page title shortcode as you suggested. But the title now also shows on my home page. I tried to edit the home page and select “disable page title” but this does not work. How can I disable it?

  2. The page title for my Blog page does not show “Blog”. Instead it shows the title of the latest post.

  3. My webshop does not show the webshop title but instead shows the title of the first product.

  4. I also implemented breadcrumbs. They show correctly, but also on the home page. I would like to disable breadcrumbs on the homepage.

Hope you can help me :slight_smile: And I also hope that X Pro will implement a feature that makes breadcrumbs and page titles behave like normal X theme does. This is a basic feature available in almost all Wordpress themes. Strange that a premium theme like X does not have that featured!

Thanks in advance for your help :slight_smile:

#5

Sorry for another post @christian_y but otherwise I might forget. Some more questions:

  1. I would like the active link to remain highlighted in the “interaction” color so when on a certain page my visitors know where they are. So when you click “home” the navbar menu item needs to remain blue. The same for all other links on my website like secondary menu etc…

  2. I would like to show a “home” icon in my main navigation next to the home navbar item. I edited the menu and added the correct icon there, but nothing seems to happen. How can I get a home icon next to the home menu item?

1000 times thanks! :slight_smile:

#6

Hi there,

Would you mind providing how your USP should look like? It’s not responsive since it’s a raw content, a content you made with no relation with the header layout. For it to respond, it needs to have a responsive layout and styling. And the reason it’s overlapping has you added height to your header bar where the USP is, you should set its height to auto.

  1. You should use blank template, edit your page and go to Page attribute section and change its template to an Blank template.

  2. You should duplicate your header and assign static text for the title which is “Blog”, then assign that header to your blog/posts page.

  3. Same goes here, you may do #2 too. The page title shortcode will only work for post types, and not for archive pages such as blog page, archive page, and etc. Unless you can modify the shortcode and add conditional which static text will be display when it comes to archive pages.

  4. You may try #2 again, duplicate your header and assign it to your home page, then remove the page title.

  5. About the active/highlight color, it’s a bug which can be fixed temporarily by adding this code to your global custom javascript, or in your header custom javascript

setInterval( function() {
jQuery( '.current-menu-item a' ).each( function() {
jQuery(this).addClass('x-interactive');
jQuery(this).parent().find('a > span > span').addClass('x-active');
} ); }, 300);
  1. I can see a home icon beside the Home text. Is that what you’re trying to do? Else, please provide some screenshots.

Thanks!

#7

Thanks for your support. Header is perfect now! Thanxxx :slight_smile:

#8

You’re welcome! Glad to hear it.