UPDATE: TWITTER HAS MADE THEIR OWN
RE: @venturebeat i totally wrote this service way before them http://j.mp/bQjwjt so lame twitter stole my idea :( but … http://disq.us/dm2zk
its a pretty simple service called Blackbird Pie you just paste in tweet url and boom embed code is ready... so ends my development on this but i may stell make my conversation embed code... we will have to see
Heres the original... i readdy did make it first (look at the dates)
Everyone is going nuts for twitter... everyone has an account and everyone seems to be tweeting... and something that i noticed was that news stories are staring to have more and more screen shots of interesting or news worthy tweets and not including links to the original tweet... i think this is kinda lame because we cant see where it came from and taking a screenshot of tweet to just include it in a post is a waste of time in my opinion. So i went looking for an easy way to embed tweets into websites and surprisingly i came up empty handed :( thats where being a programmer has its advantages... i looked up the twitter API and got to work. i wanted something that would still look like a tweet so mimicked the layout of tweets from a stream and had it do some neat stuff like pull the users profile link text and colors so it was styled correctly and such and now when cool people like @mattcutts tweet about you you can show off the tweet without even having to take a screenshot
thats one of the reasons i think witter is so cool... its like you can just reach out and talk to companies and celebrities to interact with people who you probably would have never met. so after that way cool demonstration above heres the code
<script src="http://cartercole.com/embedtweet.asp?tid=6610422429"></script>its that easy! tid is the tweet id from the tweets url like the one aboves url is
http://twitter.com/mattcutts/status/6610422429 the part after /status/ is what you want. thats the unique id for that tweet and should be the tid=someidhere parameter that tells the javascript which one to pull...please dont forget to tweet this like id like to get some good visibility on this gadget so we can stop seeing screenshots of tweets Original post on Easily embeding tweets
i also added some other cool features into it:tid= is a required parameter for which tweet to pull but you can also usewidth= is an optional parameter for how wide the div that is written should beshowreply=t is an optional parameter that adds a reply link so you can respond to the embedded tweet (also accepts showreply=true)bgclr= is an optional parameter that is the background color of the tweet div. default is white so use bgclr=transparent to turn it off or to another colorshowbdr=f is an optional parameter that turns top and bottom borders off (also accepts showbdr=false)here is an example of the different parameters being used:
and then there was code...
<script src="http://cartercole.com/embedtweet.asp?tid=8062317551&width=550px&showreply=t"></script>
i intended this gadget to be used for people writing webpages and blogs and you usually have the ability to write a
<script> but if you dont you can use the iframe version (for things like google sites) heres an example:
and again the code:
<iframe src="http://cartercole.com/embedtweet.asp?tid=8117878735&iframe=t" height="66" scrolling="no" frameborder="0" width="570"></iframe>it takes all the same arguments as javascript version but you pass the parameter
&iframe=t and use an iframe tag instead of script... id also recommend turning off borders and scrollbars. the default tweet height is about 66 but you may have to adjust as iframes cant resize themselves (note &iframe=true works too)i had a few challenges when coding this... i wanted to make it super small and efficient without having to load a bunch of external javascript of css so i used code to emulate the
a:hover pseudo-class and used all inline CSS. i also compressed the code with Google's Closure Compiler to get the javascript as tiny as possible. also twitter api returns the tweet text plain so i hacked up some regex i found so it would properly display the @username and #hashtag as well as whatever urls happen to appear. last problem i had was making the time messages that say like "about and hour ago" but an article i found had a good idea to steal some js from the twitter gadget so i borrowed and modified a small snippet of that so my time codes looked like twitters... i hope you find it useful and enjoy!you may also like my script to embed all tweets about an url too

14 remarks:
hey, thanks for this tool!
unfortunately, while it was working this morning, it doesn't seem to do so right now.. i'm using the iframe-version btw
i dont see issues in chrome or IE get me on twitter... ill help you out and see whats wrong... it could be tweet was deleted i haven't added detection of that yet
hi!
i might know what the problem is: i wanted to post all my tweets form an event. that might have represented a capacity problem for my (blogger)blog.. so i had to recur to another way of embedding tweets, did it with a friendfeed-embed..
but thx for wanting to help me! i'll keep that tool in mind for embedding single tweets, but something like 50-60 seems to be too much!
yep each embedded tweet makes a separate callback to the twitter API... if there is a hashtag that collects all the tweets then it would be only one callback and be easier for the page to load but 50 tweets is a bunch of round trips to the API while the page is loading and thats probably what is breaking the script.
and if i used a hashtag, where in the script would i have to insert it?
twitter has this search widget and the query you use is the #hashtag you want to show... i may update my script in the future to allow for searches (i have a few other features planed too) but it dosent do it yet :( sorry
This is ucking cool mate! Thanks!
You. Are. The. Man.
Again.
Awesome tool! Once you implement the search feature, I can see making a lot of use of this on my blog.
worked for me for a while then all my embedded tweets weren't viewable. why is that?
umm where is your code? what tweet id?
Could this be put to use on a Twitter conversation thread?
yep its a common suggestion i plan to develop that code soon
this is some amazing stuff, nice work! Too bad wordpress dot com blogs won't allow us to use it
Post a Comment
Link to this post if you found it usefull