Content Area Modal opens in Cornerstone, but not on frontend

Support
#1

Hello all,

I have created a contact form 7 element, linked to the “button” on the right on this page:

The form is loaded in a content area modal element and opens perfectly in Cornerstone, but does NOT open on the frontend.

Any ideas where to start?

#2

Hello Franziska,

Thanks for posting in! I have investigated your page and I found out that you have inserted a broken HTML code. There is an orphaned </a> tag. You have this:

<figure><img src="https://frauenaerztin-moeller.de/wp-content/uploads/EFH2130-scaled-e1610819099300.jpg" alt="Dr. med. Franziska Möller Gynäkologin am Stachus" width="682" height="1024" class="size-large wp-image-2505" /></a><figcaption>Ihre Frauenärztin [x_icon type="copyright"] Dr. Möller // eigene Darstellung</figcaption></figure>

The correct one only be:

<figure>
      <img src="https://frauenaerztin-moeller.de/wp-content/uploads/EFH2130-scaled-e1610819099300.jpg" alt="Dr. med. Franziska Möller Gynäkologin am Stachus" width="682" height="1024" class="size-large wp-image-2505" />
       <figcaption>Ihre Frauenärztin [x_icon type="copyright"] Dr. Möller // eigene Darstellung</figcaption></figure>

Please also check your other entries. You may inserted other broken codes as well.

Kindly let us know how it goes.

#3

Hi Team,

I checked All Elements / Text areas w/ a html checker, but the modal still does not open in the frontend.

I do not understand the different behaviour with and without Cornerstone.

#4

Hello Franziska,

There is something wrong in your page. It could be how your elements were set up or any broken code inserted in the element. I have copied your page and tested only the section with the modal button. I have remove the section for smaller screens. It is working perfectly on my test. You can check it here:

I have a hunch that the issue is cause somewhere in the section, row or column that only displays in smaller screens. I would highly recommend that you recreate the page using the new Section/Row/Column elements. Use only at least one layout to avoid duplicate text contents (which is not good for SEO). You can utilize the Responsive Element Styling of the new elements to change the styling or look of the elements for smaller screens. If you are not familiar with the Responsive Styling, please check this out first:

Best Regards.

#5

Hi team,

setting up a whole new page did not help. Finally, I found something:

I am using Yoast SEO plugin. When I enter a meta description, the modal does not open. Without meta description, everything works fine. This is very strange - as far as I understand the code behind, only one “meta property”-line is added in the HTML doc.

Have you ever heard of such a strange behaviour, or even better, an idea how to fix?

#6

Hello Franziska,

Do you have HTML codes in your meta description? It could be an HTML code or a particular character added in the meta description that might have caused the issue.

Cheers.

#7

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