Generate social images

[gastaldi]

• Fixes Customize the preview image for guides #1723

[github-actions]

😭 Deploy PR Preview failed.

[gastaldi]

Marking as a draft since the images generated in _site/assets/images/social are being deleted during the build

[maxandersen]

yeah jekyll needs to know about the images - you can't just dump them into directories that comes from direct copies.

I had this issue in the past - trying to recall what was the fix...

[maxandersen]

so yeah, now i recall - you need to have it be a full plugin OR commit them to the actual repo.

Did you try see if https://github.com/boyvanamstel/jekyll-gensocial might just work?

[maxandersen]

actually gen-scoial could be useful for the blog style content. maybe https://github.com/jekyll/jekyll-seo-tag in combination would be good?

for ascidoc might just steal the approach of gen-social to generate into the source dir that could be in a git ignored folder?

[gastaldi]

I've given https://github.com/boyvanamstel/jekyll-gensocial a try and here are my impressions:

Pros

• It works for blog posts
• It lets you override the default settings per blog post (https://github.com/boyvanamstel/jekyll-gensocial#overrides)

Cons

• It only works for blog posts (Under _posts)
• You MUST have an image: attribute in the blog post otherwise nothing happens
• Files are generated inside assets/images, changing your source tree (that's why the generated images are not deleted during the build)
• The generated text isn't center-aligned

In case you're curious, I've pushed a working configuration in https://github.com/gastaldi/quarkusio.github.io/tree/jekyll_gensocial

[gsmet]

@gastaldi what's the status of this?

[gastaldi]

It works, but the generated files' sizes surpass the maximum allowed upload size in surge.sh

[holly-cummins]

This might help: https://github.com/marketplace/actions/imagemagick-action. I've used ImageMagick in the past to resize images. In that case they were pictures of fish I was batch-processing, but the principle would be similar.

... or we could do the equivalent in code, maybe with this: https://github.com/rmagick/rmagick. That would have the advantage of being the same locally and in GitHub ... and the disadvantage that ImageMagick has some native components, so the install might be a bit fiddly. Or it might not be - I haven't tried it via a gem.

[gastaldi]

@gsmet according to your suggestion, I added a config that skips the social image generation during preview and it seems to work.

[maxandersen]

boy this is slow locally ...how long does it take you to build?

[gastaldi]

The first build is slow indeed. The subsequent ones are faster

[maxandersen]

I run this locally and it generates social images but I only see "quarkus_card.png" in og:image of blogs is that expected?

[gastaldi]

I run this locally and it generates social images but I only see "quarkus_card.png" in og:image of blogs is that expected?

Yes, because I am only generating social images for guides. See https://github.com/quarkusio/quarkusio.github.io/pull/1725/files#diff-41b71bd8e56b7f1670ccca46cbf0dec0b906a961b0a9c140914425009ecc879aR36 and https://github.com/quarkusio/quarkusio.github.io/pull/1725/files#diff-41b71bd8e56b7f1670ccca46cbf0dec0b906a961b0a9c140914425009ecc879aR11

[maxandersen]

mkay - but aren't the blog posts the most shared ones for social images?

why only guides?

[gastaldi]

So far I have only shared guides in my chat messaging apps (which is why I made this change). That may work, need to improve the script to read from the blog directory too.

[maxandersen]

@gastaldi fun - i rarely share guides - its more blog posts :)