Example 3 - Creating static tabs

Other Demo Options

Feed Ticker Controls

The demo also shows a good example of the feed ticker controls when hovering over the feed items.

Click "pause" to stop the feed rotating and play to resume again. You can navigate through all of the items manually using the up/down icons.

To turn off the auto-rotation feature just set the delay value to zero.

Show All Content For Facebook & RSS

Use the facebook & RSS options to switch the feed item text from the default snippet to the complete text.

The full text option will also include any images inserted into the original post.

Add Twitter Avatar

set the twitter "thumb" option to "true" to add the profile's avatar image.

Show A Twitter List

If you want to show a twitter list, which then covers many tweeters you can just include the list ID in the twitterId settings prefixed by a "/" symbol. To include your twitter user name, which will be used for the "follow me" button and the header text link just place this before the "/"

twitterId: 'designchemical/9927875'

The above setting will show the twitter feed from list ID 9927875 and link the follow button to designchemical.

<script type="text/javascript">
	$(document).ready(function($){
	$('#social-tabs').dcSocialTabs({
						method: 'static',
						width: 450,
						height: 600,
						rotate: {
							delay: 8000,
							direction: 'down'
						},
						widgets: 'google,facebook,fblike,fbrec,rss,twitter,pinterest,delicious,tumblr,youtube,linkedin',
						googleId: '111470071138275408587',
						facebookId: '157969574262873',
						fblikeId: '157969574262873',
						fbrecId: 'http://www.designchemical.com',
						rssId: 'http://feeds.feedburner.com/designmodo',
						twitterId: 'designchemical/9927875',
						pinterestId: 'designchemical',
						deliciousId: 'designchemical',
						youtubeId: 'wired',
						tumblrId: 'richters',
						linkedinId: '589883,http://www.linkedin.com/in/leechestnutt',
						start: 5,
			rss: {
				text: 'content'
			},
			twitter: {
				thumb: true
			}
		});
});
</script>

<div id="social-tabs"></div>