• I added a template php to my WordPress site, showing a basketball image from url, I’d like this to be the thumbnail of my website when sharing on social media

    My php template-

    <?php
    
    /*
    *Template Name: demo
    *Template Post Type: post, page
    */
    
    get_header();
    
    $image = 'https://ff.com/basketball.jpg';
    $imageData = base64_encode(file_get_contents($image));
    echo '<img src="image/jpeg;base64,'.$imageData.'" alt="“image" />';
    ?>

    When I load my website , I see a basketball image thanks to this template. But when I share my website I have no thumbnail

    • This topic was modified 3 years, 12 months ago by bcworkz.
Viewing 5 replies - 1 through 5 (of 5 total)
  • In order to control what preview image and text for instance Facebook will show, you need to include so called “Open Graph” tags in your HTML output. If you google that term, you’ll probably find lots of information.
    Facebook has a useful tool that lets you examine what information your site provides: https://developers.facebook.com/tools/debug/
    Note that not all Social networks look for the same things. Even if you want to code everything into your own theme, I suggest that you temporarily install and activate some existing plugin that can provide the necessary tagging and analyze your HTML to see what you’d need to include. (Yoast SEO, for instance)

    The tag for the “sharing image” should be og:image and it should contain the URL to the image in question (so you should not try to inject the image inline in your HTML code).

    Thread Starter rethgil2

    (@rethgil2)

    Where do I include the <meta property=”og:image” content=”https://example.com/image/src.jpg”/&gt;
    ?

    I tried to this in my code editor, Facebook still generates a different thumbnail, i don’t know how to override it

    Try fetching it again here:

    https://developers.facebook.com/tools/debug/

    Moderator bcworkz

    (@bcworkz)

    Meta tags properly belong in the HTML <head> section. Since WP themes typically use the same template file as the head section of all pages, the image source URL needs to be determined dynamically.

    FWIW, many SEO plugins will generate appropriate structured data (including OG tags) for you. However, for them to work correctly the image would need to be properly designated as a WP featured image (“post_thumbnail” in PHP code). Some plugins might grab the first image in a post if there is not a designated featured image.

    Due to caching, it can take some time before changes in OG tags show up in FB. Hence the suggestion for the FB debug tool to verify that you have the correct tags or not.

    Due to caching, it can take some time before changes in OG tags show up in FB.

    Also: Facebook caches the sharing image and text for at least a week. By using their tool, you can force Facebook to update their cache.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to set the featured image / website thumbnail from my php code?’ is closed to new replies.