Can I add custom styles to my embedded Twitter timeline?

Want to customize your twitter timeline to the branding of your website?
Need to delete the media from showing in the embedded feed?
With this simple function, you can customize all kinds of styles to have it fit in seamlessly with your website.

The HTML for the Twitter Feed:

<div class="twitter-block">
<a class="twitter-timeline" data-width="270" data-height="300" data-link-color="#000" data-theme="light" href="https://twitter.com/YourTwitterHandle" data-chrome="noheader transparent nofooter nofooter noborders">Tweets by YourTwitterHandle</a>
</div>


The javascript/jquery for the Twitter Feed:

jQuery('.twitter-block').delegate('#twitter-widget-0','DOMSubtreeModified propertychange', function() {
//function call to override the base twitter styles
customizeTweetMedia();
});

var customizeTweetMedia = function() {

//overrides font styles and removes the profile picture and media from twitter feed
jQuery('.twitter-block').find('.twitter-timeline').contents().find('.timeline-Tweet-media').css('display', 'none');
jQuery('.twitter-block').find('.twitter-timeline').contents().find('img.Avatar').css('display', 'none');
jQuery('.twitter-block').find('.twitter-timeline').contents().find('span.TweetAuthor-avatar.Identity-avatar').remove();
jQuery('.twitter-block').find('.twitter-timeline').contents().find('span.TweetAuthor-screenName').css('font-size', '16px');
jQuery('.twitter-block').find('.twitter-timeline').contents().find('span.TweetAuthor-screenName').css('font-family', 'Raleway');

//also call the function on dynamic updates in addition to page load
jQuery('.twitter-block').find('.twitter-timeline').contents().find('.timeline-TweetList').bind('DOMSubtreeModified propertychange', function() {
customizeTweetMedia(this);
});
}



Have questions? Comment below!