Slight headline element bug

Support
#1

Hey Pro-fessors!

So there’s something I’ve noticed with headers in that they do not reflect the editor version to the live version.

I uncovered this in another install some time back and ignored it with a quick fix - setting colours manually in the text editor and size but this is not how it should work.

When selecting Base Font Size & Tag - set the tag to ‘p’ because not everything displayed as a header should have a header tag. Looks as it should in the editor - go to the live version and it actually outputs the ‘p’ tag inheriting the default colours instead of the preset colours.

In this particular install I’ve noticed that the GAP element isn’t working but this may be because I am using CSS to make the container full screen (i removed the ‘flex’ CSS because ROW1 and ROW2 end up next to each other instead of stacking on top of each other)

I am going to leave you with login credentials to this test install so that you can see. There are two headers at the top of the page in the first section. First look at the live version and then look at the editor version and you will encounter the same problem :slight_smile:

Be interesting to know what the problemo is here - FYI remember I have encountered this in a couple of other installs so definitely something to iron out on the next versions.

Thanks for taking a look

#2

Hi J,

Thank you for writing in, the issue is within your Text element, the text element tag is already set to <p> and then you wrapped the “Green Planet Nutrients” text again in a p tag, resulted to a nested p tag and causing that issue.

<p style="text-align: center;">Green Planet Nutrients</p>

Another issue on that section is you set the height to 100vh, that section content exceed the to 100vh causing the lower part of the section (“Steve & Justin”) overlap with the second section. Please update the height you set in the first section from height: 100vh; to min-height: 100vh;

Hope it helps,
Cheers!

#3

Thanks Friech,

Appreciate the advice and was hoping you would notice the error there - I was actually provided that CSS by Pro support a few tickets back so I’ll change that on a few sites.

Don’t suppose you can take a look at the counters at the bottom of the homepage for me? Can’t get them to align straight for some odd reason. I’ve embedded them in rev slider using a global block which took some work getting them aligning properly but not impossible. I tweaked one setting and as a result they are staggered downwards now and I can’t get them to re-align again.

I literally had them perfectly in a row before and for some reason they have just decided to step down like a set of stairs. Talking about the green classic counters at the bottom of the homepage only.

Thanks again.

#4

Hi J,

I still see a lot of your content nested with unnecessary tag, please refrain from doing that or you’ll encounter strange (hard to see) issue like above.

Regarding your slider, it seems your slider is generating a lot of <br> tag. Please add this to your Global Block CSS

.x-global-block br {
	display: none;
}

Please do note that the Revolution Slider version that is fully compatible with the theme as of now is 5.4.8.3.

Thanks,

#5

Yes unfortunately it sometimes defaults to html when setting a headline element and adds it’s own tag.

Thank you - that CSS worked perfectly. Not sure where the linebreak tags have come from but themepunch have released so many updates since their new java site relaunch - heavy stuff but much better than what they were with all the bad press they were getting.

Still can’t seem to align the Pro classic counters under the “GO GREEN” paragraph though - no matter where I situate the global block shortcode it hides them under the gradient layer :frowning:

#6

Hello @j300bac,

I am another staff checking in. I have checked the pages and I could not locate the counter which is under the “GO GREEN” text. To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Regards.

#7

Hi @RueNel

You’re a lovely guy and I know you try to help when you can but often you’re pasting these generic messages without reading. Why would you want me to re-type written word?

If you don’t want to help using the information that has already been provided perhaps don’t bump my threads. I have over 20 licences and I don’t ask for assistance often - please don’t let the good support advisors down by continuing to do this so regularly.

J

#8

Hi J,

Sorry about that, but there is really a complexity on your setup and on top of that we are still getting in the new Revolution Slider interface.

Regarding the Slider Global Block Counter shortcode/layer issue, please set the wrapping tag to rs-layer

And then adjust the Size and Position of that layer where you want it to be.

Hope it helps,
Cheers!

#10

Hey Friech,

Not sure of the complexities - everything I use is bundled with X and Pro…

Thanks for the advice but naturally I had already tried rs-layer, along with every other out of the box variation on offer.

As you can see it just bundles the elements together. Any other ideas before you’re compatible with the latest Rev Slider release? (which I imagine will be soon as old versions are prone to hacks) :frowning:

Thanks

J

#11

Hey J,

The Global Blocks relies on the size of its container. In the Global Blocks Builder, the content area is the container and its width is defined and its height is set to auto so the columns are divided in desktop and will stack to 1 column in mobile.

In Slider Revolution, the layer’s width is auto by default and because the Global Block relies on its container and does not have it’s own width, it collapses. Friech pointed out previously that you need to adjust the Size and Position of the layer.

I made the container wider by dragging the resize handles.

Here’s what it looks in desktop now:

You will still have a problem or have some work to do in mobile. With the default responsive behavior of the layer, the columns with counter elements will look like this:

Turning all the Responsive Behavior off will make the layer behave like a normal content area with a defined width and auto height.

With that said, the columns will now look like this:

That still ain’t pretty so you’d need to configure positioning of the layers per screen size.

Maybe you could try using Slider Revolution’s Column settings instead of the Global Block columns. Because it’s native to Slider Revolution, it might work well.

Hope that helps.

#12

You tha man Christian!

Thank you for helping with that - funnily I already did that but didn’t have the correct html tag :weary:

I’ve disabled the counters on mobile devices - that’s a can of worms I don’t want to spend anymore time on.

Thanks so much for your time and efforts

#13

You’re welcome!
We’re glad @Christian were able to help you out.

#14

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