![]() These meta tags were originally created and used by Facebook, but are now also used by other social media sites like Twitter. " />įor other frameworks, they’ll likely support meta tags in some fashion, so you’ll want to check how it works for your application. To add social media-specific meta tags, we can use Open Graph meta tags. import React from "react" įor WordPress, you can configure this with a plugin, or add some PHP to your header.php file. You can of course use standard JSX syntax to replace any of the values with values from your page’s state. In React, you can do this easily with a package called react-helmet, which goes in your main App() component. Sending them to yourself to debug isn’t the best idea-many platforms will cache the response, making it harder to make quick changes. You can also set the site name manually, if the title doesn’t give that away. There’s also og:video and og:audio tags that work the same way, but for video and audio respectively. Images have a lot of configuration options: If you want an image to show with your embed, you’ll need to set that as well. You’ll also want to set the URL tag to link back to your site. ![]() Various music related tags, some of which are whitelisted on sites like Facebook.įor optional parameters, you need to add a separate meta property with the parameter name.There are also tags for movies and TV shows, with their own parameters. video.other, which represents a video.profile, which represents a user, and has options for first_name, last_name, username, and gender.article, which represents a news/blog post, and has the optional parameters of published_time, modified_time, author, section, and tag.It also allows different kinds of optional parameters depending on the type. Then we’re moving from the left to the right in our diagram. setting) it will add a noindex meta tag in the typeforms HTML code and. The og:type tag is also very important, because it tells sites what kind of content you’re linking, and how it should be formatted. When someone shares that page on twitter, facebook, or other social media, the preview image will be displayed. text and image that appear when you share your typeform on social media or. Optionally, if your title doesn’t get the job done, you can add an extended description: Even if your embed is representing an object instead of a page, it should still have a title explaining what it is. this is an extremely simply tag, but is necessary for everyone. Twitter will recognize OG tags, but it’s worth noting that they also have their own tags as well which will take priority. You can find the full list of them on the Open Graph website, but we’ll cover the important ones here. It’s a simple format, but there’s quite a few options that most websites will recognize. This results in a simple embed like the following: This sets the image, title & link, description, and tells sites that it is a website. ![]() For example, a basic setup for most websites looks like the following:
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |