How to Control What Appears on Facebook When Sharing a Link to Your Divi Website
24 Aug 2017
Open graph info is what appears on search engines and social media when you share a website link in a post. For example, if you enter a website address into a Facebook post, you'll see an image and description pop up...that is the open graph info. You can control what is shown...and you should. If you don't set it, Facebook will just pull in whatever is first on the page.
Here are instructions on how you can change what is shown...AND how you can force Facebook to show the updated info immediately! Note, these instructions are for those using the Divi theme only. If you are using a different theme, you will need to contact your theme developer or consult the documentation on how to add/edit SEO meta data. Also, if you are using a SEO plugin, you can likely control open graph within the plugin settings.
To set Open Graph information in Divi:
1. In the admin panel, go to: Divi > Theme Options > SEO
2. Ensure the Enable Custom Title and Enable Custom Meta toggles are set to Enabled
3. Enter the title you want displayed
4. Enter the meta (description you want displayed). I recommend limiting this to 170 characters or about 2 sentences
5. Click the Save Changes button at the bottom of the page
To set the Open Graph Image in Divi: (Facebook recommends you use an image that is at least 1200px X 630px...rectangular). If you do not set an image, it will pull in the first largest image...your logo).
1. Go to Media > Library
2. Find the image you want to use and click on it
3. Copy the URL field on the right
4. In the admin panel, go to: Divi > Theme Options > Integration
5. In the "Add code to the < head > of your blog" section, enter (or overwrite): <meta property="og:image" content="https://your-image-url-address.jpg" />
6. Be sure you replace the "https://your-image-url-address.jpg" part with the image URL you copied
7. Click the Save Changes button at the bottom of the page
Force Facebook to Crawl Your Updated Open Graph Information
2. Enter the full URL of the website into Sharing field
3. Click the Debug Button
4. If a brand new website, click the Fetch New Information Button
5. Click the Scrape Again button (you have to click this button a couple times, but don't go crazy...otherwise it will get locked)
6. If the correct OG image does not appear, click the Scrape Again button one more time
That's it!