Home >

Example 3 - Custom Output

The plugin uses a basic template system, which offers some options to add/remove content from the stream items as well as change the order in which these content blocks appear. This can be modified using the "out" option.

jQuery Code

$(document).ready(function($){
	$('#social-stream').dcSocialStream({
		feeds: {
			twitter: {
				id: 'designchemical',
				out: 'intro,text,user,share'
			},
			rss: {
				id: 'http://feeds.feedburner.com/DesignChemical',
				out: 'intro,title,user,share'
			},
			stumbleupon: {
				id: 'remix4',
				out: 'intro,title,user,share'
			},
			facebook: {
				id: '157969574262873',
				out: 'intro,title,user,share'
			},
			google: {
				id: '111470071138275408587',
				out: 'intro,title,user,share'
			},
			delicious: {
				id: 'designchemical',
				out: 'intro,title,user,share'
			},
			vimeo: {
				id: 'brad',
				out: 'intro,title,user,share'
			},
			youtube: {
				id: 'FilmTrailerZone/UUPPPrnT5080hPMxK1N4QSjA',
				out: 'intro,title,user,share'
			},
			pinterest: {
				id: 'jaffrey,designchemical/design-ideas',
				out: 'intro,title,user,share'
			},
			flickr: {
				id: '',
				out: 'intro,title,user,share'
			},
			lastfm: {
				id: 'lastfm',
				out: 'intro,title,user,share'
			},
			dribbble: {
				id: 'frogandcode',
				out: 'intro,title,user,share'
			},
			deviantart: {
				id: 'isacg',
				out: 'intro,title,user,share'
			}
		},
		twitterId: 'designchemical',
		iconPath: 'images/dcsns-dark/',
		imagePath: 'images/dcsns-dark/'
	});
});

HTML

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

The social stream is inserted into the "social-stream" div tag when the page loads.

Demo Dark