Search This Blog

Adding a Twitter feed to your website or Blogger

posted on Tuesday, February 21, 2023


To connect my blog with my Twitter profile, I wanted to add a Twitter feed in my About page to show that I have a Twitter profile and what type of tweets I post. 

Through the Twitter Publish tool this was super easy to do, so it's going to be a very short post today. 

Let's get started and set this up!

  1. Go to publish.twitter.com to generate the url to embed.

    Use Twitter Publish to build your own embedded Tweet, timeline, or button


  2. You can use this tool to embed a tweet, a profile, a list, a handle or a hashtag. In my case, I want to embed my profile feed. So I enter my profile url, e.g. https://twitter.com/CouldBeUseful. You can learn about the different options here: https://developer.twitter.com/en/docs/twitter-for-websites/timelines/overview

    Twitter Publish options to embed Tweet, profile, list, handle or hashtag

  3. In display options, I choose the Embedded Timeline option. You can also choose to embed Twitter Buttons.

    Twitter Publish display options

  4. Next, you can customize the result. This is quite limited, to heigh/width, light/dark mode, language and opt-out for data collection.

    Twitter Publish - customization options such as height, width, dark/light mode, language and opt-out

  5. Once you customized to your wishes, click "Update" to generate the url to embed.

    Twitter Publish - after customization a custom url will be generated to embed

  6. Click "Copy Code" to copy the url that you need to embed on your site. As I'm on Blogger, there are several options to do so; add via an HTML/Javascript Widget, in a page directly or through the HTML directly. As I only want my feed to show up in the "About" page, I'll add it to the page directly.

    Twitter Publish - copy the custom embed url to add to your website or Blog

    For my scenario, the generated url looks like this:
    <a class="twitter-timeline" data-height="500" data-theme="light" href="https://twitter.com/CouldBeUseful?ref_src=twsrc%5Etfw">Tweets by CouldBeUseful</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
  7. I open the page and enable the HTML mode, then I paste the url where I want it to show up. Hit "Publish" and there you go; your custom Twitter feed!

    Switching the Page mode to HTML to add the Twitter feed embed url

    Adding the Twitter feed embed url to my Blogger page

    Twitter feed embedded in a Blogger page

Do you have a Twitter account or other social media channels? How do you promote your blog? Are you already following This Could Be useful on Twitter? Let me know in the comments!

Could be useful, right?

No comments:

Post a Comment