Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1422518

    I’ve obtained the iframe code to embed a Google Map and entered it into a code block. While the iframe content does display, whenever I try to open the code block again for editing, it turns completely white and I’m unable to make any edits. The same issue occurs when I input the code into a text block. What could be causing this and is there a solution?

    #1422520

    can you post the code you inserted to that code-block ( use code tag here please to better inspect the code)

    #1422524

    thank you
    For the sake of my client’s privacy, I cannot provide the exact address used in the map, but it’s a general iframe code similar to the one below. I’ve also discovered that the same issue occurs when entering CSS or other codes. I’m unsure of the cause.
    <iframe src="https://www.google.com/maps/embed?xxxxxxxxx" width="800" height="600" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>

    #1422525

    yes – the code is correct and seems to be achieved via the standard way using the google map share button on the map.
    I am asking this because it sometimes happens that my fellow participants transfer something like this manually and then errors occur (like not closing tags).
    I therefore think that you should first try to reinstall the theme (maybe something went wrong during the installation) – and at the same time perform an update (if not already done).

    #1422574

    Hi,
    Thanks for your question, I tried to recreate this error with a Google Map iframe for Boston Ma in a code block element,
    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d188820.5492695243!2d-70.97028399999999!3d42.31434995!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89e3652d0d3d311b%3A0x787cbf240162e8a0!2sBoston%2C%20MA!5e0!3m2!1sen!2sus!4v1697385152217!5m2!1sen!2sus" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
    I also tested in a text element and tried to edit the page many times, make changes and save and view the frontend and then edit again, but I was not able to create an error.
    My test site has no plugins, so perhaps yo can try disabling your plugins. If that resolves the issue, reactivate each one individually until you find the cause.
    Sometimes javascript in a code block element will run in the backend (editor) and cause errors, if you have any other code blocks on the page with javascript try removing them and checking again.
    If you find it’s a plugin or something else that you can’t do without, you can try to add the map iframe as a shortcode as a workaround.
    For example, try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

    function custom_iframe_shortcode($atts) {
        $iframe_src = esc_url($atts['src']);
        if (!$iframe_src) {
            return 'Please provide a valid src URL in the shortcode.';
        }
        $iframe_html = '<iframe src="' . $iframe_src . '"width="100%" height="600px" frameborder="0" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>';
        return $iframe_html;
    }
    add_shortcode('iframe', 'custom_iframe_shortcode');

    notice in the code above I set the iframe width to 100% and the height to 600px, you can adjust to suit.
    Then in your code block add this shortcode: [iframe src="https://www.example.com"] I added my map url like this:
    [iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d188820.5492695243!2d-70.97028399999999!3d42.31434995!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89e3652d0d3d311b%3A0x787cbf240162e8a0!2sBoston%2C%20MA!5e0!3m2!1sen!2sus!4v1697385152217!5m2!1sen!2sus"]
    Perhaps this will help you.

    Best regards,
    Mike

    #1422605

    But he wrote that even css code does not work correctly. So – my guess is that there is a generall installation error.
    the code he quoted above corresponds to what Google itself outputs as embed code. Therefore, this error can be excluded.

    #1422608

    Hi,
    Thanks for the feedback Guenni007, I didn’t see that he was having trouble adding css to a code block, perhaps he didn’t wrap it in <style> for CSS or <script> for jQuery, I’m not sure he didn’t share an example.
    But your advice to try reinstalling the theme is good advice, thank you.

    Best regards,
    Mike

    #1422735

    Thank you for your suggestions. I plan to try out a few of the methods you provided. I’ve already built a significant portion of the site. Would reinstalling the theme have serious repercussions?

    #1422784

    Hi,

    Thank you for the update.

    The methods provided above should not lead to critical errors as long as you proceed with caution and create a back up of your site before making any major changes. Reinstalling the theme can be done, but it’s important to make sure you have a restore point in case you need to revert to your previous setup. Additionally, make sure to keep a list or backup of the customizations or content you’ve added to the site in order to ensure they are not lost after the reinstallation process.

    Best regards,
    Ismael

    #1423671

    “Thank you for the advice.
    After various tests, I’ve realized that the issue isn’t with the code or the way it’s embedded, but rather with the homepage itself.
    The iframe works fine on other pages.
    It seems there’s a bug with a specific section placed on the homepage.

    Even after recreating the color section, the bug doesn’t get fixed.
    I will send the reference URL to the master.
    The display in section9 is wrong
    I can’t figure out the cause. Please help.”

    #1423825

    Hi,
    Thank you for your patience and the link to your page, when I look at your #av_section_9, the section that begins with the title: ACCESS the only issue that I see is that the section is not centered, this is because of some custom css that you have added:

    #av_section_9 .container {
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    If you remove this the section will show correctly.
    If this is not the issue that you are talking about, please explain further and include a screenshot and admin login in the Private Content area so we can be of more assistance.

    Best regards,
    Mike

    #1423943

    Thank you very much.
    I thought I had checked everything, but it seems I overlooked a setting I had made myself.
    The problem has been resolved!
    I will close this thread.
    I express my deep gratitude.

    #1423960

    Hi,

    Great, I’m glad that Mike could help you out. I’ll go ahead and close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘code block trouble’ is closed to new replies.