Skip to main content

How can I force a specific image to feature when sharing my links on Facebook?

Nadav Ofir
Updated

Facebook provides a dedicated API to personalize the preview of shared links.

Specifically, the og:image property allows you to specify the image which will displayed as thumbnail. Populating this tag using a Cloudinary URL will help you to make sure that the image is quickly delivered via CDN and displayed using the appropriate dimensions and composition according to the transformation you have provided.

For example:

<head>
...
<meta property="og:image" content="http://res.cloudinary.com/demo/image/upload/w_100,h_100,c_thumb,g_faces/couple.jpg" />
...
</head>

Related articles

Comments

3 comments

Date Votes
  • Mirha Masala
    Edited

    I have the following code in Rails. Unfortunately, the width attribute doesn't seem to be taking.

    ```
    <% content_for :meta_image, cl_image_path(@recipe.photo.key, width: 1200, quality: "auto") if @recipe.photo.attached? %>

    ```

    What am I missing?

    0
  • Aleksandar Kostadinov
    Edited

    Hi Mirha,

    The width parameter is not being reflected in the URL since width/height relies on another parameter being present - "crop" - which controls what type of cropping to apply. You could try to set - crop: "scale" - in your cl_image_path and that will use the "scale" mode and the width and crop mode parameters would be added to the URL.

    Please see the below section in the documentation that provides more details on the different crop modes available so that you can find the best one for your requirements (as it may not be "scale" which was just an example) -

    https://cloudinary.com/documentation/image_transformation_reference#crop_parameter

    0
  • Mirha Masala

    Oh, got it! That makes sense. Thank you. 🙂

    0

Please sign in to leave a comment.