How to Embed a Twitter Feed into Ghost

Twitter offers various customizations to help you change the look and feel of what you want your embedded twitter to look like. I am going to show you the steps to just create a basic embed and how to put it on your site and leave it up to you to style and place wherever you wish.

  1. Log into your Twitter account and click on the cog and then settings in the top right corner.

  2. In the left hand sidebar, click on "Widgets" and then click on "Create New" at the top.

    Ghost Embed Twitter Feed

  3. Create your widget however you would like, and then click on "Create Widget".

  4. Twitter will give you some code that we are going to use shortly. Go ahead and keep that window open.

  5. I am going to add this Twitter widget at the bottom of my home page, so I am going to open up my index.hbs file.
    The location of this widget will be different for everyone, so use these steps as an example, and then you can add the widget wherever you would like.

  6. I am editing the default Casper theme, so at the very bottom of the index.hbs, right below {{> "loop"}} I am going to insert the code that Twitter gave me.

  7. Restart Ghost

  8. Now, when I reload the page, I see the Twitter feed below my posts:

    Ghost Twitter Embed

Now, this is not in anyway styled, but the way it looks will be different for each person, so that portion is up to you :). Hope this helped you out, and check out our next section on where to get help if you have a customized Ghost setup not covered on this site!