Tips for embedding twitter on your website

Update (2013-05-31): this post has been updated to reflect recent changes in how twitter handles widgets.

Sandvox┬áhad (it’s gone now with version 2.7.7) an useful “twitter” object for embedding a twitter timeline on your website with just a click.

You can still use an HTML raw object to use twitter’s own presentation and have a finer control on what’s published. Moreover, you can also embed a single interesting tweet anywhere, for example inside a post.

First of all, let’s go into your twitter account and open your settings:

Twitter settings

Create a new widget:

Create a widget

Select “User timeline” and insert your (or any other) twitter account name. You also have some customization options.

widgets_configurator

Some code will be created for you:

Get the code

Save changes and copy that code.

Now back to Sandvox. Create an HTML raw object and paste there the code:

Create an HTML object

I prefer this timeline to be in the sidebar, so I’ll move the object there:

Move it to the sidebar

Single tweets

If you want to embed a single tweet somewhere, there’s an option for this as well. From twitter choose “Embed tweet”:

 

Embed a single tweet

Again, twitter will create the code and show you a preview:

Get the code

As before, create an HTML raw object and fill it with the new code:

See the result

In this case I kept it inside my main page.

You can experiment with different styles, options, timelines, hashtags…