How does IH generate social sharing thumbnails?
When sharing links to IH posts on social media a thumbnail with the post title is generated, how is @csallen doing this?
I tried googling, but I can't find anything relevant.
When sharing links to IH posts on social media a thumbnail with the post title is generated, how is @csallen doing this?
I tried googling, but I can't find anything relevant.
Every thread gets its own page like this:
https://www.indiehackers.com/shareable-image/thread/4349889c34?variation=5
You can change the number in the
?variation=#part of the URL to change the design… 1, 2, 3, 4, and 5 are supported. When someone creates a thread, edits it, or responds to it, their browser will ping an AWS Lambda function I have set up, which will take a screenshot of the URL above and store the resulting image on S3. And the thread page references this S3 URL in its HTML:<meta property="og:image" content="https://580157013239-us-east-1-chromeless.s3.amazonaws.com/thread-shareables/4349889c34.png">I used to have the Lambda function use a random variation number in the URL, but this meant any given thread's image would change every time someone made a comment or something and the Lambda function got pinged to update the screenshot. What I'm doing now is hashing the thread ID into an integer in a large range, then condensing that range down into one of 5 buckets. So now threads will consistently hash to the same variation number.
thanks, that's so ingenious! will try to make something like that!
I was wondering the same thing, I should've just asked ;) great in-depth response!
Pieter Levels has written a tutorial on how he generates thumbnails with PhantomJS:
https://levels.io/phantomjs-social-media-share-pictures/
Funnily enough, I pinged Courtland an email asking this question literally two days ago.
I was wondering whether there was some kind of little SaaS service that could be created that would allow people to generate this sort of thing dynamically.
Thing is, not really sure how useful this would be. Not convinced that it's a particularly big problem, and how many people would actually have it.
Anyone else have thoughts on this?
Had the same thought. Wonder if other sites or services would want something like this.
Ah, I had considered doing this with an image-creating library, eg. ImageMagick. The screenshot method seems less painful.
This is totally a post I would favourite on here.
If looking to test your meta tags you can try this tool - https://mobilecavalry.com/lookout
Or use this tool to create the tag previews - https://mobilecavalry.com/lookout/website-preview-builder-meta-tag-generator
This comment was deleted 6 years ago