Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Add twitter card metadata #432

Closed
tarasglek opened this issue Feb 9, 2024 · 3 comments · Fixed by #459
Closed

Add twitter card metadata #432

tarasglek opened this issue Feb 9, 2024 · 3 comments · Fixed by #459
Assignees
@rjwignar

Comments

@tarasglek
Copy link
Owner

Silly twitter doesn't render OG in our shared chats, eg https://chatcraft.org/api/share/tarasglek/5szbfO7gPyjwQLzJE96wb

Need to add twitter-specific cards mentioned in https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards
@rjwignar
Copy link
Collaborator

@tarasglek Can you help me understand the issue?

I've looked at the chat and I don't see any embedded tweet:
image

Silly twitter doesn't render OG in our shared chats, eg

What does the original chat look like?

@rjwignar rjwignar self-assigned this Feb 11, 2024
@humphd
Copy link
Collaborator

humphd commented Feb 12, 2024

@rjwignar he means that Twitter won't use OpenGraph data to render a share. Here is what we have in the head of the shared chat:

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="Web-based AI Assistant for Software Developers" />
    <meta name="og:site_name" content="chatcraft.org" />
    <meta property="og:image" content="https://chatcraft.org/favicon-32x32.png" />
    <meta property="og:url" content="https://chatcraft.org" />
    <meta property="og:title" content="chatcraft.org" />
    <meta property="og:description" content="Web-based AI Assistant for Software Developers" />
    <link rel="apple-touch-icon" sizes="180x180" href="[/apple-touch-icon.png](https://chatcraft.org/apple-touch-icon.png)" />
    <link rel="icon" type="image/png" sizes="32x32" href="[/favicon-32x32.png](https://chatcraft.org/favicon-32x32.png)" />
    <link rel="icon" type="image/png" sizes="16x16" href="[/favicon-16x16.png](https://chatcraft.org/favicon-16x16.png)" />
    <meta name="theme-color" content="#ffffff" />
    <title>ChatCraft</title>

To fix this, we need to add Twitter Card meta tags as well: https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards

You can use the Twitter Card validator to test a URL: https://cards-dev.twitter.com/validator

@tarasglek
Copy link
Owner Author

But the idea of rendering OG inside chatcraft is interesting . We could offer that for when urls are present and offer a "scrape" link to make our scrape functionality more discoverable

@rjwignar rjwignar mentioned this issue Feb 16, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@rjwignar rjwignar

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Add twitter card metadata tarasglek/chatcraft.org
3 participants
@humphd @tarasglek @rjwignar