• Resolved tomgreeen

    (@tomgreeen)


    Hi there, great plugin!

    I’m using Yoast with a WPGraphql for a headless wordpress site. Is there a hook to get the URL for the generated image so I can include it in my graphql schema to access on the front end?

    Thanks

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Internetbureau Clearsite

    (@clearsite)

    Hi @tomgreeen

    first off; thank you ??

    then; You can get the URL for the image in two ways;

    Option 1; you can just add /social-image.jpg/ to the URL.
    Although technically this name (social-image) and extension (jpg) could change, we probably will not ??
    Option 2; use Plugin::get_og_image_url($post_id);
    You will need to “use” the class; on top of the php file (but below any namespace declaration, if applicable) add
    use Clearsite\Plugins\OGImage\Plugin;

    Both options, however, create an image url for a post regardless of the enabled-status. So even if there is no image configured, or has been disabled using the post-meta settings, the URL is still the same.

    To know if a post actually has a properly configured social image, you can use
    Plugin::go_for_id($post_id);

    So in total;

    <?php
    // on top of the file (but below any namespace declaration, if applicable)
    use Clearsite\Plugins\OGImage\Plugin;
    
    // your code here
    if (Plugin::go_for_id($post_id)) {
      $image_url = Plugin::get_og_image_url($post_id); 
      // do something with the image url here.
    }
    

    if there is another class named Plugin in the code, you can alias the class like this;

    <?php
    // on top of the file (but below any namespace declaration, if applicable)
    use Clearsite\Plugins\OGImage\Plugin as BSI;
    
    // your code here
    if (BSI::go_for_id($post_id)) {
      $image_url = BSI::get_og_image_url($post_id); 
      // do something with the image url here.
    }
    

    Please realise that while we will always do our best to keep new versions of the plugin backward compatible, we cannot 100% guarantee these function calls will not change in the future.

    For example; we are working on compatibility with categories and tags, which probably will change the method signatures to something like
    Plugin::go_for_id($object_id, $object_type, $base_type) {};
    Plugin::get_og_image_url($object_id, $object_type, $base_type) {};

    So keep an eye on the release notes and check before updating.

    Hope this helps, please let us know if it does not, or also if it does ??

    ^RP

    Thread Starter tomgreeen

    (@tomgreeen)

    Wow you guys are awesome ! Thanks for the snippets, I have go_for_id working inside my graphQl resovler, but the only issue is that as this is a headless site, my front end lives on a completely different domain (actually the WP install is on a subdomain of the front end with no public access) – so my-post/social-image.jpg/ doesn’t lead to a valid location.

    I understand this is very likely outside the scope of this plugin but there isn’t a way to filter the URL of the image is there?

    Plugin Author Internetbureau Clearsite

    (@clearsite)

    This is indeed outside the scope of our plugin, but let me think about this for a minute, perhaps I can help, although “off the record” ??
    What would you need to get this working?
    How do you currently serve images on your website?

    Thread Starter tomgreeen

    (@tomgreeen)

    That is very kind of you!
    Currently, images live on S3 in the WP media library, but are served on a Cloudfront CDN – all relatively standard.
    My headless front end (nextJS) queries WP via WPGrapqhl, to get the CDN path to the image – for, say, a featured image. So to try the above, I added a custom resolver adding ‘socialImage’ to the data graph, so that I could query that. The resolver ran get_og_image_url and returned the URL.

    I’m not sure how the BSI image is generated so hard to know what should happen instead – is it always on the fly, or generated once and then stored in a filesystem? I guess ideally whatever logic runs when a browser requests XXXXX/social-image.png would run inside my socialImage resolver. Or something!

    Plugin Author Internetbureau Clearsite

    (@clearsite)

    Ideally (but this is based on my limited understanding of your set-up) you would want the social image cached in the CDN or in S3.

    There is an action fired after building the image,
    do_action('bsi_image_cache_built', $cache_file);

    so with

    add_action('bsi_image_cache_built', function($cache_file) { 
      //... some code here
    }

    you could upload the cached image to the CDN/S3.

    Then you would need to rewrite the urls ending in /social-image.jpg/ to that uploaded file somehow…

    Trying to do this all in my head without knowing anything about the software is a challenge, so I hope I’m making sense here …

    In any case, the /social-image.jpg url on the WordPress side is a virtual image url, the image itself is built on first call and cached (cleared out when post is edited) but that cache is not directly accessible over the web.

    Thread Starter tomgreeen

    (@tomgreeen)

    This is excellent, thanks. I’ll have a go saving the file from bsi_image_cache_built to S3 and then create my own URL rather than needing to rewrite the urls ending with /social-image.jpg/ before calling get_og_image_url – seems like an unnecessary step.

    When you say it’s cleared out after post edit, does that mean bsi_image_cache_built simply runs again and overwrites the old one ?

    Will let you konw if I’m successful, if of interest.

    Huge thank yous on this !

    Plugin Author Internetbureau Clearsite

    (@clearsite)

    When you say it’s cleared out after post edit, does that mean bsi_image_cache_built simply runs again and overwrites the old one

    Effectively; yes.
    The cache is cleared, after which upon the next call the the image-url, the new image is built, and then the action bsi_image_cache_built is triggered.
    So there must be a http call to the image-url to build the image.

    I guess that could be a problem, so you could prime the cache on a post_save, if you need to.

    maybe something like

    add_action('save_post', function($post_id) { // cache is cleared on this action
      // so bind the shutdown to be "last"
      add_action('shutdown', function() use ($post_id) {
        $link = get_permalink($post_id) . 'social-image.jpg/'; // quick and dirty
        // do something with link here so it points to the "internal" url
        // which, I would assume, is available for the WordPress install
        wp_remote_get($link, [ 'blocking' => false ]);
      });
    });

    This all hinges on the idea that WordPress _can_ make web-calls to itself.
    If not, you would need to do a whole lot more to build the image…

    I will register a feature request for the option to prime the cache after clearing. Don’t know how feasible this is, but it is worth investigating …

    Will let you know if I’m successful, if of interest.

    Would very much appreciate it!, thank you ??

    ^RP

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Hook to get URL for generated image?’ is closed to new replies.