How do I update the preview image that is shown when I post a link to my Webflow site on social media and text messages?

Published on
September 22, 2023

To update the preview image that is shown when you post a link to your Webflow site on social media and text messages, you can customize the Open Graph settings in Webflow. The Open Graph protocol allows you to specify meta tags that control how your website appears when shared on various platforms. Follow these steps to update the preview image:

  1. Open your Webflow project in the Webflow Designer.
  2. Click on the "Pages" tab on the left-hand panel.
  3. Select the page for which you want to update the preview image.
  4. In the right-hand panel, click on the "SEO" tab.
  5. Scroll down to the "Open Graph" section.
  6. Click on the "Add Open Graph Property" button.
  7. From the dropdown menu that appears, select "og:image".
  8. In the field next to the "og:image" property, enter the URL of the image that you want to use as the preview image. Make sure the image is hosted and accessible on the web.
  9. Click outside the field to save the changes.
  10. Repeat steps 6-9 for any additional Open Graph properties you want to add or modify.
  11. Publish your site for the changes to take effect.

By updating the Open Graph image for your Webflow site, you can ensure that the desired image is displayed when sharing links on social media platforms and text messages. This can help improve the visual representation of your site and attract more attention to it.

Note: It may take some time for the changes to be reflected when sharing your site on social media platforms, as the platforms cache the preview image. You can use tools like the Facebook Debugger to force an update of the preview image.

Additional questions:

  1. How do I update the meta description for my Webflow site?
  2. Can I customize the title that appears when sharing my Webflow site on social media?
  3. What are some best practices for optimizing my Webflow site for social media sharing?