Twitter Widget

You can show your Twitter Feed from a Username anywhere on your website. Some of the important attributes you’ll require while setting up this widget are listed below:

Code Example

<ul class="iconlist twitter-feed" data-username="envato" data-count="2">
	<li></li>
</ul>

Settings

Private Content

You must be logged in with your Envato Account for Free in order to view this Content.

Login with Envato

Twitter Feed Avatars

You can also show the Twitter User Avatars on a Twitter Feed. .twitter-feed-avatar

<ul class="iconlist twitter-feed twitter-feed-avatar" data-username="envato" data-count="2">
	<li></li>
</ul>

Code Sample for a Twitter Feeds Scroller

<div class="fslider customjs testimonial twitter-scroll twitter-feed" data-username="envato" data-count="2" data-animation="slide" data-arrows="false">
	<i class="i-plain i-large color icon-twitter nobottommargin" style="margin-right: 20px;"></i>
	<div class="flexslider" style="width: auto;">
		<div class="slider-wrap">
			<div class="slide"></div>
		</div>
	</div>
</div>

Twitter oAuth Authentication Setup

The new Twitter API v1.1 no longer supports unauthenticated User Timeline calls so you’ll have to now authenticate to OAuth so that you can show your Twitter Feeds on your Websites. Follow the instructions below to setup your authentication:

  1. Visit https://dev.twitter.com/apps/ and sign in using your Twitter username and password. This doesn’t have to be the username or password of the stream you need access to, just a Twitter account you control.
  2. Select Create new application and enter the application details.
    1. The name and description can be anything you like really, but you can’t use ‘Twitter’ in the name.
    2. The website field can be your main website and doesn’t have to be the site where your Twitter feed or feeds are located.
    3. Callback URL can be left blank
  3. Enter the CAPTCHA info and click create
  4. On the next details screen, click Create my access token. You may need to refresh the page after a few seconds if it doesn’t appear automatically.
  5. Make a note of the Consumer key, Consumer secret, Access token and Access token secret as highlighted below.

Twitter Feed OAuth Authentication

Follow these steps after you create your Twitter APP successfully as described above:

  1. Open the include/twitter/tweets.php file.
  2. Enter your Twitter APP Details as mentioned below: 
    $consumerkey = ""; // Twitter App - Consumer Key for OAuth
$consumersecret = ""; // Twitter App - Consumer Secret for OAuth
$accesstoken = ""; // Twitter App - Access Token for OAuth
$accesstokensecret = ""; // Twitter App - Access Token Secret for OAuth

    and Save the file.

Note Remember to set the permissions of the include/twitter/cache folder to 755 so that the Twitter Feed cache files can be saved otherwise your Twitter Feeds won’t work.

Last Modified: February 10, 2020

Need Help?