Social Card not working on Github pages #6130

gopisaba · 2023-10-03T21:12:40Z

gopisaba
Oct 3, 2023

We recently migrated to mkdocs and hosting it on the Github pages.
We are using github actions to build and publish the page.

# .github/workflows/docs-release.yml
...
      - name: Install Python Packages
        run: pip install -r requirements.txt

      - name: Build Documentation
        run: mkdocs build

      - name: Upload Github Artifacts
        uses: actions/upload-pages-artifact@v2
        with:
          path: site

      - name: Deploy to GitHub Pages
        uses: actions/deploy-pages@v2

We want to setup the social card. So I configured like,

# mkdocs.yml
...
plugins:
  - search
  - social:
      cache_dir: site/.cache/plugin/social
...

I could see the cards and fonts are generated on site/.cache/plugin/social but when we share the link, it still shows as github page. Could someone please help me?

squidfunk · 2023-10-03T22:16:00Z

squidfunk
Oct 3, 2023
Maintainer

The cache directory is not meant to be located inside the site directory. Remove cache_dir, make sure the image processing requirements are installed and everything should work as expected.

4 replies

gopisaba Oct 4, 2023
Author

Thanks for the reply. I tried removing the cache_dir but still no luck. I could see the images are in the artifacts but not displaying when I share the link on Slack (or other social media)

> tree artifact/assets/images/social
artifact/assets/images/social
├── gha
│   ├── runners.png
│   └── update.png
├── terraform
│   └── run-terraform.png
└── kubernetes
    └── index.png

squidfunk Oct 4, 2023
Maintainer

Please create a minimal reproduction, so we can understand what you're doing.

kamilkrzyskow Oct 4, 2023
Collaborator

@gopisaba
Please check the shared links with
https://www.linkedin.com/post-inspector/
or
https://developers.facebook.com/tools/debug/

Consider also that Slack could cache the image of the page (or the state of no image) and it could take some time for it to update and retrieve the newly generated image.
I had the same issue with Discord, it took a few hours and a couple of re-shares before it updated the image.

Apart of that I would check the <head> contents of the page source and check if the link to the social card in the <meta> tag correctly resolves instead of checking the git artifacts.

gopisaba Oct 4, 2023
Author

Thanks @squidfunk @kamilkrzyskow. Those links really helped.

I think the problem is the github page is set to private and has permissions to view only for the members of the org. As the URL redirects to the github auth page, it gets the default github image.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Social Card not working on Github pages #6130

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment 4 replies

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Uh oh!

Social Card not working on Github pages #6130

Uh oh!

gopisaba Oct 3, 2023

Replies: 1 comment · 4 replies

Uh oh!

squidfunk Oct 3, 2023 Maintainer

Uh oh!

gopisaba Oct 4, 2023 Author

Uh oh!

squidfunk Oct 4, 2023 Maintainer

Uh oh!

kamilkrzyskow Oct 4, 2023 Collaborator

Uh oh!

gopisaba Oct 4, 2023 Author

gopisaba
Oct 3, 2023

Replies: 1 comment 4 replies

squidfunk
Oct 3, 2023
Maintainer

gopisaba Oct 4, 2023
Author

squidfunk Oct 4, 2023
Maintainer

kamilkrzyskow Oct 4, 2023
Collaborator

gopisaba Oct 4, 2023
Author