Support

Account

Home Forums ACF PRO Best Option for iFrame Embed

Solving

Best Option for iFrame Embed

  • I have an iFrame video that is from a service not supported by oEmbed. What’s the best option for embedding this iFrame?

    I’m considering a textarea. But I don’t have an option in my ACF 5 to make a text area HTML. I have add p tags, add <br> and no formatting.

    Thanks in advance!

  • The best option for is a text field with no formatting. No formatting means whatever you put in there is what’s output by the field so this works good with any kind of code that a service tells you to add to a page.

  • What about escaping the output for security? I assume since you need the “raw” code on output you cannot use the esc_html or esc_js functions, but does that pose a possible security risk?

  • I know this is a few months old but I came across this while searching for how to escape an iframe and wanted to share my solution. I ended up using the url field and then outputting the iframe in my custom template. I also added two additional text fields for width and height so my final code looked like this:

    <?php echo ( '<iframe style="width:'. esc_attr( get_field( 'iframe_width' ) ) ."; height:" . esc_attr( get_field( 'iframe_height' ) ) . ';" src="' . esc_url( get_field( 'iframe_url' ) ) .'" frameborder="0" allowfullscreen></iframe>' ); ?>

    Hope that helps!

  • And I missed the question.

    @bandonrandon‘s solution works if you need to have more security and that’s the way I would go.

    For example, one of our client needed a way to embed Wistia videos, which are not supported by wistia. In this case I provided them with a field to enter the video ID and then coded what was needed into a function/shortcode type of thing.

    I usually do not supply fields like this to people that could put things in there that they shouldn’t and textarea fields usually work for my purposes.

  • I am stuck in a similar scenario. I need to embed vimeo livestream sessions (which are iframes) into CPT’s built with ACF Fields. The Vimeo code is:

    <div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://vimeo.com/event/XXXXXX/embed" frameborder="0" allow="autoplay; fullscreen" allowfullscreen style="position:absolute;top:0;left:0;width:100%;height:100%;"></iframe></div>

    And I’d like to have the ACF as only the src URL which is https://vimeo.com/event/XXXXXX/embed

    @hube2 Do you have resources/links on how to build the function/shortcode you mentioned?

  • @blakemiller in this case I would probably use a format value filter on a URL field

    
    add_filter('acf/format_value/name=vimeo_url', 'vimeo_url_to_iframe', 20, 3);
    function vimeo_url_to_iframe($value, $post_id, $field) {
      if (!$value) {
        return $value;
      }
      return '<div style="padding:56.25% 0 0 0;position:relative;"><iframe src="'.$value.'" frameborder="0" allow="autoplay; fullscreen" allowfullscreen style="position:absolute;top:0;left:0;width:100%;height:100%;"></iframe></div>';
    }
    
Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.