Social Media and Open Graph Tags!
•
0 likes•74 views
Open Graph tags and Twitter Cards allow websites to control how their content is displayed and shared on social media. Open Graph tags embed metadata like images and descriptions that Facebook uses to generate preview cards when links are shared. Twitter Cards similarly attach additional media and information to tweets. Plugins like Yoast can help set up both Open Graph and Twitter Cards with just a few clicks to improve social sharing and drive more engagement.
Recommended
Recommended
More Related Content
What's hot
What's hot (19)
Similar to Social Media and Open Graph Tags!
Similar to Social Media and Open Graph Tags! (20)
More from MeetEdgar
More from MeetEdgar (15)
Recently uploaded
Recently uploaded (16)
Social Media and Open Graph Tags!
- 1. Open Graph Tags Make your content stand out on Social Media!
- 2. The Why: Social Media is becoming more visual as we speak! Gaining the attention of your followers relies heavily on your images!
- 3. The How: Meta tags - specifically OG:image tags - are what allow Facebook to take a boring ol’ URL and transform it into a beautiful link preview.
- 4. What does OG stand for? By definition, Open Graph “enables any web page to become a rich object in a social graph.” So your images will populate from the links you share and you will not end up with a dull post like this:
- 5. Same Post with proper OG:IMAGE tags set up!
- 6. The Open Graph tags go between the <head> </head> section of the webpage. On chrome: View menu > Developer > View Source Code
- 7. You can set this up easily with a plugin on your blog! https://wordpress.org/plugins/wordpress-seo/ You don’t have to be a developer to do this!
- 8. PRO TIP: Improve your SEO by naming your image file with Keywords! Google takes into account image names.. So think “Snowflake-on- mountain.jpg” rather than “9827dksm.jpg”
- 9. Wondering if you set this up right? Use Facebook’s share debugger to see any errors and your image in action! https://developers.facebook.com/tools/debug/sharin g
- 10. Remember… Even though you have your Facebook previews rockin’… It’s still important to introduce your blogs and links to spark meaningful comments in your status update!
- 11. Twitter Cards Twitter Cards allow you to go beyond the 280-character limit of the platform and attach media experiences—such as photos or videos—to Tweets. There are five types of Twitter Cards: 1. Summary Card 2. Summary Card With Large Image 3. App Card 4. Player Card 5. Lead Generation Card
- 13. Drive engagement from your Tweets with the right card choice! Summary Card: Title, description, thumbnail, and Twitter account attribution. Summary Card with Large Image: Similar to a Summary Card, but with a prominently featured image. App Card: A Card to detail a mobile app with direct download. Player Card: A Card to provide video/audio/media.
- 14. Back to YOAST! Install the WordPress SEO by Yoast plugin to enable Twitter Cards too!
- 15. If you already use Yoast, then you will find it very simple! 1. Go into Yoast. 2. Click on the Social setting under the menu. 3. Click on the Twitter tab. Check the option that says ‘Add Twitter card meta data’, input your Twitter username and select the default card type you want to use
- 16. Not using YOAST? No worries! In most cases, it takes less than 15 minutes to implement. 1. Choose a card type you want to implement 2. And add the pertinent meta tags to your page. 3. Run your URL against the validator tool to test. If you are working with a Player Card, request approval for whitelisting. 4. After testing in the validator or approval of your Player Card, Tweet the URL and see the Card appear below your tweet in the details view. 5. Use Twitter Card analytics to measure your results.
- 17. If you’ve gone through the process of setting up your Twitter Cards, it’s important to make sure they work. Once your meta tags are live, the Twitter Card Validator ensures everything is running smoothly….
- 18. https://cards-dev.twitter.com/validator Simply copy and paste the URL of the page with the meta tags in order to ensure they’re working properly. If they are, you’ll see a preview of the Card associated with your site as well as details about how many meta tags are installed and whether they’re loading successfully.
- 19. Edgar's Preview Tab shows you what your posts will look like before you publish them too!
- 20. Email support@meetedgar.com TWITTER: @meetedgar Or try an Edgar free trial today: ed.gr/hello