🎉 Happy 4th of July! Get 15% off GP Premium with the discount code: 4THOFJULY2020

[Support request] Register local site for embedded images

Home Forums Support Register local site for embedded images

  • This topic has 8 replies, 2 voices, and was last updated 5 months ago by Tom.
Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #1149858
    Martin

    I’m having a problem getting this white list function to work (my register code is from the oEmbed providers generator at https://generatewp.com/oembed/ ) to display my Types custom embedded image field for images (videos from youtube work fine but my self-hosted images are only showing links instead of rendering the image):

    // Register oEmbed providers
    function custom_oembed_icasc() {
     
        wp_oembed_add_provider( 'https://icasc1a.local/*', 'https://icasc1a.local/wp-content/uploads/public_html/sites/default/files/featured_media/', false );
     
    }
    add_action( 'init', 'custom_oembed_icasc' );

    I must be having an error in the url to my images. Can you see it? I tried it with regex=true as well. Here is an example url of one of my self-hosted images (same website as the .local one I’m developing on):

    https://icasc1a.local/wp-content/uploads/public_html/sites/default/files/featured_media/M-ED-640.jpg

    I’m linking the image with the Toolset Types shortcode below which shows a youtube video just fine but not an image:
    [types field=’common_featured_media’][/types]

    GeneratePress doesn’t offer an easier way to do this does it? many thanks!

    #1149912
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    I don’t have a lot of experience with this, unfortunately.

    I did some looking around and found this: https://wordpress.stackexchange.com/questions/334402/what-is-the-correct-oembed-provider-base-url-for-self-hosted-wordpress-sites/334432

    If the answer there is correct, you could implement it with this function:

    add_action( 'wp_head', function() {
        if ( is_singular() ) {
            $output .= '<link rel="alternate" type="application/json+oembed" href="' . esc_url( get_oembed_endpoint_url( get_permalink() ) ) . '" />' . "\n";
    
            if ( class_exists( 'SimpleXMLElement' ) ) {
                $output .= '<link rel="alternate" type="text/xml+oembed" href="' . esc_url( get_oembed_endpoint_url( get_permalink(), 'xml' ) ) . '" />' . "\n";
            }
        }
    } );

    Let me know 🙂

    #1149927
    Martin

    I tried it but it didn’t work for me (no change with the code):

    [types field=’common_featured_media’][/types] – shortcode alone did not work for image it gave the link only. But an image does output with html:
    <p class=”embedded-video”></p>

    Video DOES output with the shortcode:
    [types field=’common_featured_media’][/types]

    I’ll contact Toolset and see if they can help and let you know.

    I wonder if I can do a test to see if the embedded field contains an image and then have it render the html which works, and if it is not an image have it render the shortcode alone. Suggestions for this approach?

    Thanks so much Tom!

    #1150558
    Martin

    Toolset said:
    The embedded field simply uses WordPress’s in-built embedded media handling, which has a white-list of external sources that are supported: https://wordpress.org/support/article/embeds/#okay-so-what-sites-can-i-embed-from

    If your images were coming from a site such as imgur then they would be handled automatically.

    Evidently they are not.

    But in that case then the correct way to handle this situation is to register a handler for where the images are hosted, including if that is from your own site.

    You can see details and an example in the official documentation:

    https://codex.wordpress.org/Function_Reference/wp_embed_register_handler

    You can register your own site, for example, and return the HTML of an img tag with the src the URL itself.

    Your website is likely not configured to be an oembed provider—to automatically return the required markup whenever a particular URL is reached—and that’s not what I was directing you to do.

    You need to register your own handler, where the URL refers to your own site, and you register a function that will spit out the markup you need, in this case an image tag.

    It does require some familiarity with regular expressions.

    You might want to browse the WordPress stackexchange site where others have been asking for help with that function (or ask a question yourself): https://wordpress.stackexchange.com/search?q=wp_embed_register_handler

    ****************

    I’ll try this. Looks tricky for me…

    #1150714
    Tom
    Lead Developer
    Lead Developer

    That does look like the right advice.

    This might also be useful: https://wordpress.stackexchange.com/questions/238330/wp-embed-register-handler-not-working

    It’s not something I’ve ever done, unfortunately.

    #1150718
    Martin

    Ok, I’ll look. I posted a question too:
    https://wordpress.stackexchange.com/questions/357635/register-an-embed-handler-for-self-hosted-images

    I just don’t understand this stuff either!

    #1150925
    Tom
    Lead Developer
    Lead Developer

    It’s a part of WP I’ve never really played with. Hopefully someone can shed some light on it 🙂

    #1153570
    Martin

    Got this shortcode from toolset which perfectly solved the problem in a simple and elegant way:

    “OK, registering the embed handler is a valid option, but you could try registering the following shortcode instead:

    add_shortcode('is-local', function ($atts = [], $content = null) {
     
        if ( !is_null($content) ){
     
            $site_url = get_bloginfo( 'url' );
            $content = do_shortcode( $content );
     
            $is_local = strpos( $content, $site_url );
        }
     
        return ( $is_local === 0 ) ? 1 : 0;
    });

    I’m working on the same principle, i.e. checking that the URL corresponds to the current site URL (is local) rather than is some external URL (e.g. youtube).

    You use it like so:

    Local: [is-local][types field='embeds' output='raw'][/types][/is-local]
    It will return 1 for local files (your local images, whether they are jpg, png etc.) and 0 for external files, which you can then use in wpv-conditional shortcodes.”

    #1154344
    Tom
    Lead Developer
    Lead Developer

    Very cool, thanks for sharing the solution! 🙂

Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.