Demo not the same as when installed

I am totally stucked and getting almost frustrated.

I installed a demo only to see that the demo doesn’t look exactly as it is.

The header is completely different and I don’t seem to find a way to edit it to look like the demo.

Help.

See the demo.

How do I set the header to look just like the demo’s?

I want the header to be sticky on all versions (desktop, tablet, mobile etc).

I also want to include a search bar on all versions and I’d want the search bar to be visible on Android (i.e., not inside the menu button but beside it).

Please, how do I set it to look like the demo and using the colour I’d prefer?

I had to deactivate all the plugins and turned them ON one after the other. I just found out that the problem is as a result of Uber Menu. How do I fix this issue without deactivating Uber Menu?

Also, the menu is not sticky for mobile. How do I make it sticky?

Thanks.

Hi Barry,

Thank you for writing in, the standard header can only be sticky on desktop, it would cause some issue if you make it sticky for mobile, also you can not modify the search item on the menu.

You have two options to achieve what you need either upgrade to PRO so you will have a Header/Footer Builder, with the Header/Footer Builder you can customize the header.

Or you can utilize the UberMenu and create a flexible menu header.

Cheers!

Okay. Thanks.

I need clarification on something.

I discovered that all of the TYPOGRAPHY settings (except BODY FONT) do not affect two important elements I am getting familiar with right now which are HEADLINE and TEXT.

Both elements have ADVANCE FEATURES which are really nice but the CLASSIC ELEMENTS do not have advanced features.

Well, I observed that the CLASSIC ELEMENTS are affected by the settings (colour, font etc) in the typography. But due to the fact that they lack more controls (advance features), I find them (the CLASSIC ELEMENTS) less efficient and not really cool to use.

My problem with the other elements like HEADLINES and TEXTS is that I am not able to control all of them at the same time.

I mean, if I use these elements on different places and I managed to use the same settings all through the various pages and I someday decided to change settings (colour, font, margin etc) for all of them, I’d have to change the settings on individual elements.

Let’s say I have HEADINGS all over my pages, I’d have to edit them one by one in order to change colour, font, margin etc.

Is there not a way I can use a GENERAL SETTINGS for these elements, so when I change the GENERAL SETTINGS it will affect all of the HEADINGS?

Thanks.

I saw this :point_down:t4:

Hello Barry,

The Typography settings in the Theme Options will only be applied to classic elements. For v2 elements such as headline, text and other v2 elements, it has it’s own default font settings. Click on the element and find the text Format option in the element settings.

tiAghmSsQfagOHNiDo8wvw

If you don’t see some of style options, you need to turn on the Advanced Mode by going to the Settings > Preferences > Advanced Mode

Hope this helps.

Oh thanks but I know that already.

What I am saying is: is there a way to use Global Block for v2 elements?

Hi Barry,

I understand your issue and the Global Block is not the answer.

Here’s what you need to do, you need to define the Font Families and Color that you’re going to use on your site first.

Font Manager
Color Manager

You will see these defined fonts and defined color on the element’s font-family dropdown and color picker. When you set up a text or any element use this defined font-family and color. Now when the time comes that you decide to change font or color to use, you just go to the font manager and color manager to change those colors and the elements that using it will follow.

Here’s another trick that will make your workflow faster, configure an element that you commonly use (e.g. text, headline, button, etc.) style it the way you want it to look throughout your site, now after you done styling it, save it as a Preset element (more details here), take a look on the video below to see it in action.

Presets as Elements: Using a Design System

If you find that video helpful, please subscribe for more tips and tricks video.

Cheers!

Regarding that WooCommerce outdated copies of some template files, don’t worry about that as most of the time that is harmless, just keep your WooCommerce to version 3.8.1 for now as that is the latest supported version of the theme.

Actually, on the recent release version of X (7.2) and PRO (3.2) that has been already fixed. see changelog here.

Cheers!

Okay. Thanks. I’ll check out those and let you know…

How do I activate static menu for mobile?

I tried the CSS code in the doc but it didn’t work.

How do I get the html code of a particular design I made in corner stone?

Thanks.

Hello Barry,

By default, there is already a mobile menu and it is static. Do you want the mobile menu to be fixed on top while you scroll the page?

Meanwhile, you can create your designs in X > Global Blocks. You can then use your global block shortcode if you want to display the design in your sidebar or anywhere on the page.

Regards.

Yes I want the mobile menu to be fixed while scrolling.

I’m considering upgrading to Pro. Do the header and footer builders have different learning curves?

Hi Barry,

I already answer that above:

No, we can not provide a custom CSS or custom JS for that.

It has some differences in terms of layout, but in terms of elements it’s just the same with the Content Builder.

The Difference Between X and Pro

Cheers!

How do I create a button that when clicked upon will pop up a modal containing some elements? I don’t intend using external plugins.

Thanks.

Is the logo below an image?

If it isn’t, how can I make similar for my logo and use it for my website?

Thanks

Hello Barry,

1.) If you need a modal popup in your page, you can create your page with Cornerstone or Pro Editor and then insert a Modal Content element. You can then insert any code in this element to display in the modal popup.

2.) The logo is an SVG file. You convert your image to an SVG. Please check this out:

Hope this helps.

Okay thanks. I upgraded to pro yesterday.

This theme is nice but has a tough learning curve.

See the screenshot below

It’s the footer builder in Pro.

I want the “FOLLOW US…” text to be in a different line in the third container.

FOLLOW US…
:1st_place_medal: :fire: :dart: :headphones:

How do I go about it?

This website: https://lumos.digital has sticky header on mobile and it uses pro. But you said I cannot use sticky header.

Please take a look.