|
I've been seeing more and more beautifully presented links popping up in my Twitter feed recently, so decided to research further. I do struggle with the limitations of Weebly's blogging features occasionally, but I managed to get this working well so thought I'd post in case there are any other Weebly users in a similar position.
A bit of quick digging around on Google revealed that these links are called Twitter Cards, and there's a full tutorial from the developers on that page. As usual, it's written for people who can access and edit the HTML for their page, but the fiddle to make this work for Weebly was surprisingly easy. |
|
Here's how I created my first Twitter card (you can see a pic of it on the right) using Weebly's Embed Code feature. Scroll through for a step-by-step tutorial.
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@yourtwitterhandle">
<meta name="twitter:title" content="POST TITLE max 70 characters">
<meta name="twitter:description" content="POST DESCRIPTION">
<metaname="twitter:image:src" content="URL OF IMAGE">
<meta name="twitter:site" content="@yourtwitterhandle">
<meta name="twitter:title" content="POST TITLE max 70 characters">
<meta name="twitter:description" content="POST DESCRIPTION">
<metaname="twitter:image:src" content="URL OF IMAGE">
Once you've added all of this information to your blog post, Twitter will automatically show this card whenever your URL is posted. It's worth noting that you can only have one card per URL.
It's also worth noting that the Twitter Card will not show up like this on summary feeds; it's only when your tweet is clicked and expanded that the full details are shown.
It's also worth noting that the Twitter Card will not show up like this on summary feeds; it's only when your tweet is clicked and expanded that the full details are shown.
RSS Feed
Thanks for the instructions for creating a twitter card.
Thanks for the instructions. You're very kind.
Not a problem - I know how difficult it can be finding sensible instructions for Weebly!
The verification technique does have got a useful intent. Twitter brims with bogus or parody accounts. So when customers are sifting by way of an index of likely usernames, it helps to get alerts to assist discover the genuine human being they want to adhere to.
The verification method does possess a sensible intent. Twitter brims with bogus or parody accounts. So when customers are sifting by way of a summary of opportunity usernames, it helps to have alerts to help you locate the real particular person they need to adhere to.
Thanks for the tutorial! It "broke" my them, but I did find a workaround. It's one I've used for other posts.
The problem is, when I have the draft, the text is all normal. With the twitter card added via "add code", lots of the text would be gibberish. Lots of random unicode symbols next tot or in place of words.
Solution:
Add the same code to a picture, ANY picture. Add it as the "caption. You can even add it to the end of the caption. It wont appear as the code, but still performs the same.
Thanks again!
Thank you for this, I was looking for something similar.
This was exactly what I needed. Thank you for taking the time to write these easy to follow instructions :)
Thanks so much for these lovely instructions! However, I wanted to bring this to your attention: the last line of code for the image is missing a space between "meta" and "name". This kept causing the wrong image to show up in one of my own cards. It took me 45 minutes to figure out why! Adding the space fixed it. :)
Thank you so much for sharing this information. Do you by any chance have suggestions on great weebly "plugins" to use to increase blog exposure? I know that WordPress uses something like Yoast. Are there any apps you could recommend for Weebly?
Thanks so much for taking the time to make instructions to help weebly users make twitter cards! I have been trying to figure this out for a few days now and am at a total stumbling block. Whenever I add the embed code to the blog page or blog post itself, the twitter card is showing up with a grey box with a url to our site next to it. Im sure the only part of the code I havent changed of yours is the 'summary large image' part. I really hope you can help!
Thanks so much,
Nick
This was so helpful thank you! so concise and easy to follow.
I'm having a hard time with the image URL, I'm copying and pasting it for a specific picture but it keeps pulling a different image from my blog...
Thank you so much for sharing this!