• Features
  • Integrations
  • Pricing
  • Help
Sign in Sign up EN
  • Features
  • Integrations
  • Pricing
  • Help
Sign in Sign up EN

Choose your language

English Polski
Home / Website / What is an Open Graph Image and how can you set it up in Calendesk?

What is an Open Graph Image and how can you set it up in Calendesk?

2 min , 7 sec read 0

Open Graph Image is a hidden HTML meta tag used by social media or online messengers to present a shared link of a website. This feature allows website authors to control how a website or an online booking system presents itself when shared. You can choose an image and description of your website.

Open Graph Image example

In Calendesk, you can select an Open Graph Image URL for your website or an online booking system in the website builder in the “General” tab. Then, paste a URL link to your image in the Open Graph Image URL field. Finally, don’t forget to publish the changes.

Website Builder - General

Please notice that social platforms and online messengers store website images in their temporary files (cache). Refreshing an OG image may take up to several days. You can try to speed up this process by using some tools provided by social media platforms:

  • Facebook Sharing Debugger: https://developers.facebook.com/tools/debug/
  • Twitter Card validator: https://cards-dev.twitter.com/validator

Open Graph XYZ also shows the preview of Open Graph Images for different social platforms. We recommend testing your Open Graph Image there as well.

Where do I get from the URL for the OG Image?

Go to the “Add-ons–Files” tab in the Calendesk Admin Panel and add an image with a size of 1200 × 630 pixels. The image size is quite important. If you add a picture of the wrong size, some platforms may not display your image correctly.

Calendesk - Files

 

How can I adjust the image size?

You can use our simple image editor in the Files tab. The editor can help you to crop images. Hover your cursor over the image you want to crop, then click the brush icon to open an additional cropping tool.

Calendesk - Files crop image

 

You will see the size of the current crop area at the top of the editor. First, crop the image to 1200 × 630 px by selecting the crop area with your cursor. Then click the button “Save”. You can also use your local applications on your computer like Paint in Windows or Preview on MacOs to crop the image.

Calendesk - Files crop image with size

Where can I find the URL to my image?

Go to your image gallery again in the Files tab and hover on the selected image. Next, click the magnifying glass icon, which will open a popup with the chosen picture and display additional information with the URL.

Calendesk - Files zoom in image

You will see the URL to your image at the bottom of the selected picture. Please copy the URL. You will need it in the next step.

Files image URL

 

What should I do with the URL?

Go to the “Websites” tab and click on the website you want to edit.

edit-template

Then, in the “General” tab of the website builder (select it at the top of the builder), scroll to the field called “Open Graph URL”. Paste the copied URL and publish the changes. Finally, you can test the new image using, e.g., the Facebook tool (https://developers.facebook.com/tools/debug/).

Please remember that changes may appear with a delay of up to several days.

The “General” tab in the Website Builder contains additional fields you may need:

  • Favicon URL: A favicon is a small 16×16 pixel icon that serves as branding for your website or online booking calendar. Its primary purpose is to help your customers locate your website easier when multiple tabs are open in their browser. You can set an URL to the favicon the same way as you did with the Open Graph URL. Just remember about the smaller size (16×16 px).
  • Website description for robots (SEO): Use this field to set a description of your website (maximum 160 characters). This description can be displayed in the search engines, e.g., Google or Bing, or when sharing your website link on social platforms or via online messaging services such as WhatsApp, Skype, Slack, Discord.

Website Builder - General

Website

Related Articles

  • [Technical] Listen to events on the website
  • How do you create discount codes?
  • How to add Google Analytics, Facebook Pixel, and other custom scripts to Calendesk?
  • How to add an Online Booking System to WordPress?

Categories

  • 3Add-ons
  • 7Customers
  • 2Employees
  • 2General
  • 8Integrations
  • 11Online booking system
  • 3Profile
  • 6Services
  • 5Settings
  • 1Store
  • 2Subscriptions
  • 1Upsells
  • 9Website

Most viewed

  • Customers – Newsletter 8486
  • A quick overview of all features 2287
  • Customers – Profile 1795
  • Dashboard – Quick configuration and statistics about your company 1769
  • Add-ons – Files – upload, edit and use your pictures 1657
© 2023 MPR Sp. z o.o.

  • Features
  • Integrations
  • Pricing
  • Help
  • Blog
  • Contact
  • Terms and Conditions
  • Privacy Policy