How to make the perfect social media sharing image - part 4 Image Examples
After the last entry, I wanted to show you the social media images that were created by ColdFusion. Each of these images match the exact recommended size and the ratio aspect that are recommended by the various social media platforms. I'll show you the actual images that were created, and how the social media platform displayed the images after I shared the previous article.
The first image to the left is the original image that was uploaded. This is a picture of my dog, Toby, a super-smart, 13 y.o. bundle of energy running in the snow. The second image, in the middle, is the Facebook social media image, and the image to the right is the Twitter social media image. All of the social media images are copies of the original.
Galaxie Blog will automatically take the image that you want to post, and create Facebook and Twitter social media images that are sized per the social media's recommendations. The Facebook social media image is 1200 pixels wide, and 630 in height. Twitter is similar, but just a hair shorter. They are 1200 pixels wide, and 628 pixels in height.
How the page renders on social media sites
Below are the social media sites render the page when it is shared. The images below are actual screen shot's of the last post I shared in part 3 of this series. Again, the image to the left is the original. The middle image is how Facebook presents the site, and the image to the right is how Twitter displays the share.
Both Facebook and Twitter will take the images that were created by Galaxie Blog, and resize them into their own format. As long as the images either meet the maximum or minimum dimensions as they do here, the site presentation of the share will look good.
Note: this approach works for Slack and LinkedIn sites, but this is outside of the narrow Facebook and Twitter scope that I wanted to blog about.
Next up in this series, how to properly use the meta tags for social media sharing.
- How to make the perfect social media sharing image - part 1 Background
- How to make the perfect social media sharing image - part 2 Getting the Size Right
- How to make the perfect social media sharing image - part 3 Get the code...
- How to make the perfect social media sharing image - part 5 Essential Meta Tags
- How to make the perfect social media sharing image - part 6 Validation tools and tips
- Sharing Video's to Facebook and Twitter
This entry was posted on November 2, 2019 at 1:45 AM and has received 1532 views.