Skip to content

chore(website): make docusaurus show twitter card image #5253

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

connorlurring
Copy link
Contributor

PR Checklist

Overview

Twitter Card docs reference

  • Added Twitter card image (logo-twitter-card.png) with a 2:1 aspect ratio as per the Twitter Card docs.
  • Configured the docusaurus meta-image property to show this card image.
  • Added alt tag for the image to give support for screen readers.

@nx-cloud
Copy link

nx-cloud bot commented Jun 26, 2022

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 9094615. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch


✅ Successfully ran 47 targets

Sent with 💌 from NxCloud.

@typescript-eslint
Copy link
Contributor

Thanks for the PR, @connorlurring!

typescript-eslint is a 100% community driven project, and we are incredibly grateful that you are contributing to that community.

The core maintainers work on this in their personal time, so please understand that it may not be possible for them to review your work immediately.

Thanks again!


🙏 Please, if you or your company is finding typescript-eslint valuable, help us sustain the project by sponsoring it transparently on https://opencollective.com/typescript-eslint. As a thank you, your profile/company logo will be added to our main README which receives thousands of unique visitors per day.

@netlify
Copy link

netlify bot commented Jun 26, 2022

Deploy Preview for typescript-eslint ready!

Name Link
🔨 Latest commit 9094615
🔍 Latest deploy log https://app.netlify.com/sites/typescript-eslint/deploys/62b869da4b71b800083cd785
😎 Deploy Preview https://deploy-preview-5253--typescript-eslint.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@connorlurring connorlurring changed the title docs(website): make docusaurus show twitter card image chore(website): make docusaurus show twitter card image Jun 26, 2022
Copy link
Member

@JoshuaKGoldberg JoshuaKGoldberg left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Super, thanks for this @connorlurring! 🚀

Although view-source:https://deploy-preview-5253--typescript-eslint.netlify.app/ points to the now-404ing https://typescript-eslint.io/img/logo-twitter-card.png for the image, https://deploy-preview-5253--typescript-eslint.netlify.app/img/logo-twitter-card.png does indeed work. So this should be fine when it hits main.

@connorlurring
Copy link
Contributor Author

That's correct Josh, docusaurus uses the base URL set in the config to create the path to the meta image URLs.

When writing it I replaced the base URL with the one to my ngrok tunnel and all worked as expected on the Twitter card tester.

@JoshuaKGoldberg JoshuaKGoldberg merged commit 2600f7f into typescript-eslint:main Jun 26, 2022
@connorlurring connorlurring deleted the docs/twitter-card-image branch June 26, 2022 16:23
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jul 27, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Website: missing Twitter card image
2 participants