When sharing a post from a forum on Facebook, ran across a minor issue I would like to solve. When sharing new posts with an image, the image shows up along with the title. But when you go to post it and hit enter the image is replaced with the flatboard.png image from the theme/bootstrap/assets/img folder and the post image does not show up.

***Scroll down for the fix! *Which no longer works

Thought this fix was working but the next day it reverted back to to same small image added when actually sharing the post. FB debugger still shows the post image though. Spent hours on this one and it's making me crazy. lol could be something unrelated to the flatboard software.

Looked and looked and can't find any og-tags anywhere that may be overriding this. I'll keep tweaking and really hope to solve this.

Yet when you add a reply to an existing post, the image is included although smaller, and it works perfectly.

Does anyone know which file would handle this?

If I can figure it out, I'll share what I did to fix it.


Here is what shows up when a post is shared.

=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-==-=-=-=-=-=-=

HERE's THE FIX FOR BETTER FACEBOOK AND SOCIAL MEDIA SHARING

First, we will need to modify the header.tpl.php file in the theme/bootstrap folder.

In the file, right above the closing </head> tag, paste the following open graph code. You'll need to modify a few lines, to suit your forum name.

Now change this line and replace chitchat with the name of your forum: $fixedTitle = 'chitchat'; be sure to leave the quotes and the rest of the syntax intact.

Finally, add your website address to this line: $topicURL = 'https://yoursite.com' . $_SERVER['REQUEST_URI'];

This will now share the site name, topic photo and URL of your forum posts. Also, a customized forum name, and the post title. Nothing is duplicated and it uses the first post image correctly now instead of the flatboard logo.png file each time.

Really appreciate Fred and the rest of the developers here that made this what it is. My hope is that nicer social shares can make this awesome software even more popular.

Here is the Code

    <!-- Your OG tags code snippet -->
<?php if ($cur === 'viewTopic'): ?>
    <?php
    // Extract the first image URL from the content if available
    $topicContent = ""; // Replace this with your actual topic content
    preg_match('/\[img\](.*?)\[\/img\]/', $topicContent, $matches);
    if (isset($matches[1])) {
        $topicImageURL = $matches[1]; // Use the first matched image URL
    } else {
        $topicImageURL = ''; // No image found, use an empty URL
    }
    
    // Construct the topic URL using the current page's URL
    $topicURL = 'https://yoursite.com' . $_SERVER['REQUEST_URI'];
    
    // Set a fixed title for Open Graph tags
    $fixedTitle = 'chitchat';
    ?>
    <meta property="og:title" content="<?php echo $fixedTitle; ?>">
    <meta property="og:image" content="<?php echo $topicImageURL; ?>">
    <meta property="og:url" content="<?php echo $topicURL; ?>">
<?php endif; ?>