Tips

Website Performance

WordPress Development

How to fix your broken Twitter stream widget on WordPress

June 12, 2013

Many of you who own a WordPress website with a Twitter stream widget might have been impacted by the Twitter API 1.1 version update. Effective June 11th 2013, any code that utilized the older API will not be supported which results in an empty stream.

There are basically two options to solve this issue:

Option #1. Remove the widget and optionally replace it with something else.

This is actually a good option for those who no longer tweet and having the widget actually makes you look worse than not having one to being with. If you also don’t see much value in Twitter stream, this is a good time to just let go of that function and gain from time saving and improved website performance.

Option #2. Replace the old widget with new Twitter Widget

In our research we found the Display Tweets plugin developed by Matthew Ruddy which works with the new Twitter API 1.1 and is very easy to setup.

#1. Login to your WordPress and go to Plugins > Add New

#2. Search “Display Tweets” which should come up as first on list (by Matthew Ruddy), click “Install Now”. Once installed, click “Activate Plugin”

#3. Go to Settings > Twitter Feed

#4. Click “register an application here” link or visit http://dev.twitter.com/apps/new

#5. Login or make sure to login as Twitter account used on website to display tweets

#6. Type the following on input fields. [screenshot]

Name: [Company Nickname] Display Tweets
Description: Display twitter feeds on website
Website: [Your website URL]
Callback URL: (leave blank)

#7. Check on “Yes, I agree” and fill the CAPTCHA

#8. Once application is setup, copy and paste following back to Twitter Feed Configuration back on your website. [screenshot]

#9. Click “Create my access token”, and copy following back to Twitter Feed Configuration back on your website. [screenshot]

#10. On the Twitter Feed Configuration page on your website, change Screen name to your Twitter ID without @ symbol. [screenshot]

#12. Go to Appearance > Widgets, and open up the Widget section on far right and find the old Twitter widget.

#13. Just under that old Twitter Widget, drag and drop the new “Tweets” widget from left “Available Widgets”. [screenshot]

#14. Add any Widget title you want “Follow Us” etc and remove the old Widget

#15. Confirm the Tweets loading on website

Elisha Terada

Front-End Developer

Elisha Terada is the "ninja" who solves tough missions with his tech, design, and business skills. In his relaxation time, Elisha enjoys shooting portraits with his camera and playing music with his guitar and bass.

  • Curry 2 U Granville

    appreciated you sharing this. it was really helpful. Thanks

  • ComCoAgency

    This was really helpful. Thanks for explaining this step by step!

  • blueprintds
  • kristin

    thanks for posting regarding the new twitter api. do you have any suggestions for updating twitter feeds that are embedded in the theme options? I don’t use a widget for my twitter feed. Instead the theme has a menu option to use a “blog & tweets” section to the homepage and I am trying to get an update from the developer but don’t have a solution yet.

    • Unfortunately the developer of your theme would really have to rewrite the code so that it works with the latest Twitter API. Once the developer has done that will need to go through the similar process written in this blog to obtain keys and secret codes.

      This is one of good reasons why you want to buy a theme from a developer who has history of updating theme often which you can see in version history.

      One thing you can do is to create your Blog & Tweets section with shortcode which works similar to Widget except you can use that in pages and posts. The Display Tweets plugin I introduced in this post have that option available:
      http://wordpress.org/plugins/display-tweets-php/installation/

      For blog post, your theme might give you shortcode to list posts or you might look into other plugins that gives you shortcode with settings to display list of posts.

      Hope this helps!

      • kristin

        Thanks Elisha. I thought that would be the case that I would have to wait for a theme update. This developer has been reliable and I know he will update but I don’t know when. Meanwhile I’ve taken the steps to set up my auth tokens and I’ve tested them in a twitter feed in my footer area using a widget -and all is working.

        Thanks for all the info!

  • Peter Booker

    It is great to see people offering solutions after the old Twitter API shutdown.

    For those who don’t want to have to create a Twitter App manually, I have created a WordPress plugin which deals with all the API business for you. You can find it here: http://wordpress.org/plugins/kebo-twitter-feed/

  • Wendy Perkins-Shoef

    Thanks a bunch for this easy tut.

  • taylorwalsh

    Thanks for simple fix!

  • thx 4 this very helpful post, it worked on my (German) wp blog 🙂

  • John Early

    I receive the message “No tweets found. Please make sure your settings are correct.” I’ve followed the steps 3 times now. Is there some advice you could give as why I’m receiving that message? I’m using the Resolution template in WordPress.

  • Rita Norton

    interesting problem – it works but the twitter feed is not mine!! Any suggestions?

    • Assuming you’ve done step #10 correctly and entered your user name, you might need need to post an issue on the forum to see what the author says:
      http://wordpress.org/support/plugin/display-tweets-php

      I’ve posted about the issue on tweeted time mismatch and the author updated his widget to solve the issue.

      • Rita Norton

        I worked on it more last night and fixed my error – completed step #10 but was hasty and misspelled – after reviewing all the steps again I saw the error and corrected. Thank you for your reply.

  • This was super useful. Explains a lot. Thanks!

  • Henry Mangult

    Finally I have come across a proper step by step on migrate to twitter API v1.1

  • Post-Haste Reed Duo

    “Go to Appearance > Widgets”: Widgets don’t appear for me under Appearance. All I see is Themes, Customize, Menus, Editor. Please help.

  • Darko Noir

    I tried this plugin and works very well and shows tweets in slide. So cool! Twitter slider & User card for WordPress

    http://bit.ly/185iUWQ

  • This was so helpful Elisha! Thank you so much for sharing.

  • ARTZU Gallery

    Your ‘how to do’ was probably the very best I’ve ever come across on the web – so clear! The only problem was when I’d installed this plug in there was no link for people to click on to actually go to our twitter account…. so a bit useless really as I want people to be inspired to follow…. is there any way to add this to this plugin or do I need to find another?

  • Graeme Boxwell

    Thanks Elisha, this worked really well. Straightforward and clear instructions that helped me to create the necessary twitter feed. The screenshot links didnt work for me, but I still managed it fine. Thanks again.

  • Byron Walker-Mills

    Twitter wont allow you to create an app unless you now add a mobile phone to your Twitter profile. https://dev.twitter.com/discussions/25637

  • This was extremely helpful, thank you!

  • Amit Kapoor

    Hi
    Thanks for post . It is helful and I have a Really Simple Twitter Widget for your wordpress, Blog & website and get Twitter Reach. all are use this Twitter plugin for WordPress https://wordpress.org/plugins/twitter-widget-with-sentiment-analysis/

  • WHW

    Wonderful blog & good post. It is really helpful for me, awaiting for more new post. Keep Blogging!

    White Hat World | White Hat Worlds | Search Engine Optimization | White Hat SEO lllllll

  • Liz Devela

    Hi, thank you so much for this. It really worked! 🙂

  • Liz Devela

    Hi, thank you so much for this. It really worked! 🙂

You might also like...

3

Jun.

Top 12 PHP Development Tools and Tips

Most developers have their go-to PHP development tools, libraries, and best practices to streamline workflows and create clean, lean code. So, we asked our developers to let us in on their favorites. Here are their top tools, tips, and tricks to help you create great apps. 1. Use PHPUnit for unit testing to catch bugs. –Elisha, Front-End Developer 2. Utilize the PHPStorm text … Continued

19

May.

A Fresh Launch

In the wee hours of February 15th, our office hummed with activity: last-minute design tweaks, another edit, one more proofread, furious coding. The President’s Day holiday was traded for unlimited coffee and extra time off later so that we could stick to our deadline. All hands on deck – hours of hard work – willing … Continued

12

May.

11 of Our Favorite JavaScript Developer Tools

From JavaScript debugging tools to our favorite JS libraries, here are some of the resources that enable us to write better, cleaner code. Eight of Fresh’s devs weigh in on their choices for JavaScript developer tools. 1. ESLint helps everyone to write clean JavaScript code! –Steve, CTO   2. Client/Server data synchronization library for Node.js I created … Continued