Raw content in invisible section still visible

Hi again,

I put a raw content element (for appointments) into some sections that should be invisible on some screeens. Nonetheless they all appear on the desctop screen. Can you tell me how can I prevent that?

Hello @blueprint,

Thanks for asking. :slight_smile:

Can you please confirm whether or not you have selected the appropriate screen sizes under Hide based on screen width? Upon checking the Contact I see that you haven’t selected Desktop icon under Hide based on screen width.

I also see Sorry! Something went wrong. This page didn't load Google Maps correctly. See the JavaScript console for technical details. for Google Maps. Looks like you haven’t entered Google maps API key as in dev console I see Google Maps API error: MissingKeyMapError. Please take a look at following article to get the API key:

https://developers.google.com/maps/documentation/javascript/get-api-key

Please make the necessary changes again and see how it goes.

Thanks.

Yes, I ch
. The raw content el

Yes, I checked it again. The section I’m talking about is the one after the contact form - “Termin Buchung”. The raw text element contains a html code for an appointment calendar.

Regarding the google map - I get this message in Cornerstone. but on the page it is loading all right. Can you replicate that?

Hi There,

The issue is being caused by the script you added.

<script src="https://www.jameda.de/api/otb-widget/?refid=81469304_1" async></script>

I have removed this part from your code in the raw content and it seems to work fine.

Please take a look.

Thank you! Yes it works. I copied this code from the provider oft the calender. Will erverything still work without the part you removed?

Does not seem to work. Without the part that you removed. The calender won’t load. But as soon as I use the full code again, the calenders of all the hidden sections appear on the desktop view.
Any other idea? (site goes online in the night, so I’d be greatful for a soon reply!)

Hello There,

Thanks for writing in! First you must correct your ID. Please be advised that an ID must be unique and that there is no other element having a duplicate ID.

On the other hand, if the raw JS code you have inserted forces the section to show up, it will just simply override the “Hide During Breakpoints” settings, does making the section visible in desktop screens.

Hope this helps.

Thank you. Im not sure if I understand.
Each setion has a unique name:
terminbuchung
terminbuchung-mobile-3
terminbuchung-mobile-4
terminbuchung-mobile-4

regarding the JS- I don’t know what to do (no skills in that area). I just copied the code for the calender from the provider…
Can you guide me through?

Hello There,

We will fix your element IDs first. You must understand that an ID must be unique. Yes each of you section has a different ID name. The problem is that in each of you section, in your row container settings, you also added the same ID name. So you now have a duplicate ID, the section ID and the row container ID.

Please edit your page and make sure that all your ID is unique and no duplicates.

Please let us know how it goes.

I now removed all the ID’s from the custom headline elements. Thanks for that!
Now the sections have their unique ID’S. Also I edited a unique ID to every raw content element. Than I tried to remove the code again:
<script src="https://www.jameda.de/api/otb-widget/?refid=81469304_1" async></script>
but it stll all showed up on desktop…

Hi There,

It was confirmed that it was the script that is causing the issue right? Then please remove that from the <body> content and let’s add it to the <head> part instead. To do this, add the code below on your child theme’s functions.php file.

/*add something on the <head>*/
add_action('wp_head','my_script');
function my_script () {  ?>
<script src="https://www.jameda.de/api/otb-widget/?refid=81469304_1" async></script>
<?php }

Hope that helps,
Cheers!

By this

you mean to remove that part of the code from the raw content element and put it into the funktions.php file?

Yes, I mean remove this from your page content / RAW content element.

<script src="https://www.jameda.de/api/otb-widget/?refid=81469304_1" async></script>

Then let’s add it via child theme’s functions.php file using the code I provided above.

Thanks,

Thanks, but it didn’t work.

Hi There,

What did you mean it did not work? I am still seeing that line on the body part, that line should go to the head part and the rest of that code should remain on the RAW content element. Please consult the documentation or contact the author/support of that widget as we cannot continue providing support for 3rd party scripts, due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s script.

This seems to be a 2 fold issue hence I am seeing a nested section on your page source (which it should not)


Please check all your content desktop/mobile for any unclosed HTML tag. Also look for an empty section, it should have at least one Row.

Also please understand that this becomes hard to investigate for us because of too much use of the Hide Base During Breakpoints feature, for example, this section:


Don’t do your pages like this, you will be having a hard time maintaining your pages like this in the future (or even now).

Thanks,

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