I am trying to embed the latest tweets from a Twitter account on a website - www.CochlearImplantOnline.com on the sidebar. I am using this code:
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://api.twitter.com/1/statuses/user_timeline/cochlearimplant.json?callback=twitterCallback2&count=3"></script>
When I implemented this code, it doesn't show up at all. What could I be doing wrong?
This doesn't look like the code from the twitter widget for embedding a feed. Are you sure you copied it from that widget? This is what it looks like when I copy the widget embed code on my account:
<a class="twitter-timeline" href="https://twitter.com/marycamacho" data-widget-id="275430111547887616">Tweets by #marycamacho</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
Go to publish.twitter.com and put your twitter URL into the search box eg. https://twitter.com/Twitter
Then you get your embedded code for your twitter feed. You can also customize.
Related
So I recently started learning jQuery mobile framework and I've been practicing from my mobile phone with a code editor and everything is working fine.
I have added the jQuery libraries to my index.html page head like so:
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
If I use the "multi-page" approach inside my index file everything seems to work perfectly but when I try to create an external file like: about.html and try to link to it, the framework would give me an "error loading page" message. The same happens when I try to link images, they won't show up.
All files are inside the same root folder so there's no need for slashes. How could I fix this and keep practicing with relative path files? I don't like having many pages inside a single document.
You can very well have multiple html, multiple js files as controllers...
In your index.html you have the below div:
<div data-role="page" id="pageIndex"></div>
Load all the respective js files which acts as controllers.
In device ready or in subsequent controllers use change page:
$.mobile.changePage("login.html");
Each individual html page will have page id:
<div id="pageLogin" data-role="page">
And its respective controller will have pageshow event to load the correct html on change page.
$(document).on("pageshow", "#pageLogin", function() { // code for page login };
I put a javascript function in my ruby on rails4 web page but it didn't work properly. My page not shows the map when I open my webpage but when I reload my webpage then map show properly. I put my javascript tag in body of my webpage. What should I do for proper working of code and where should I put my code that it can works properly?
<script type="text/javascript" src="http://www.webestools.com/google_map_gen.js?lati=31.546678&long=74.330942&zoom=18&width=675&height=400&mapType=normal&map_btn_normal=yes&map_btn_satelite=yes&map_btn_mixte=yes&map_small=yes&marqueur=yes&info_bulle=" type="text/javascript"></script>
Try disabling Turbolinks.
If that works, figure out how to make your code work with Turbolinks. If it doesn't, best of luck!
I pasted the Twitter generated code for an embedded timeline in a Text widget in WordPress. It causes a rendering issue in IE8 whereby links are being replaced by the tweet button.
Screenshot:
http://www.48thave.com/clients/ntp/shotshow/test-twitter.png
WordPress test page:
http://shotshow.com/test-twitter/
Code:
<a class="twitter-timeline" style="border:0" href="https://twitter.com/nssfshotshow" height="300" data-widget-id="336534911341166596" data-chrome="noheader nofooter noborders transparent">Tweets by #nssfshotshow</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
</script>
Anyone have a solution?
Thanks!
This issue was resolved today by Twitter patching a recent release of their script.
https://dev.twitter.com/discussions/21893
One page app, where there are user-profile pages(that you change dynamically).
This doesnt work, it appears as link
<a href='https://twitter.com/{{user.twitter}}' class='twitter-follow-button' data-show-count='false' data-size='large'>Follow #{{user.twitter}}</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
If it reinitializes the code it doesn't work either
<div ng-show="user.twitter" ng-bind-html-unsafe="user.twitter|followButton">
I'm currently working on an Angular app where I need to implement such widgets - from Facebook, Twitter, Google+ and Pinterest.
Although I wasn't able to make the Facebook button work without using its iframe form, the other three work like charms (read on).
The real issue with Angular seems to be the asynchronous Javascript codes these platforms usually provide (which dynamically create a script tag calling the actual JS code needed to make the button work). If you call the right JS file directly (and synchronously), it works great.
Example for Twitter :
<!-- This won't work : -->
Tweet
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<!-- This will (note I'm using the same URL for the script) : -->
Tweet
<script src="//platform.twitter.com/widgets.js"></script>
I forgot about Iframe, there's no option on twitter when you generate the button. So it works!
<iframe ng-show="user.twitter" allowtransparency="true" frameborder="0" scrolling="no"
src="//platform.twitter.com/widgets/follow_button.html?screen_name={{user.twitter}}"
style="width:300px; height:20px;"></iframe>
Also very important: iframes update history. To solve this problem I generate element iframe dynamically and then appendChild it to the location where it is supposed to be.
Here's a good example: http://nirlevy.blogspot.com/2007/09/avoding-browser-history-when-changing.html
How do I embed a youtube channel that will show the latest video from that user?
Say for instance, the latest video on this page: http://www.youtube.com/citizentube
Please don't tell me to go to http://www.youtube.com/custom_player because that page is dead. And please don't reference http://code.google.com/apis/youtube/overview.html unless you have a specific example. I've looked, haven't found anything.
This is crazy frustrating. Apparently there was embed code right on the channel/user page back in 2010. But it is nowhere to be found now.
Thanks,
Peter
I made a script that find the latest videos from any youtube user of your choice. It contains of both html, php and javascript code. What it basically does is it read the rss feed ( http://www.youtube.com/rss/user/citizentube/videos.rss ) from that user and build a list you can click and watch the videos from. The very last video will load as default. You can try it by adding these few lines of javascript into your website:
<script language="javascript" type="text/javascript" src="http://lablogic.net/scripts/infotube/webtube.js"></script>
<script language="javascript" type="text/javascript"> init(470,65,"citizentube",300,220); </script>
or you can go to: youtube webviewer and customize your own. Just type your channelName behind "channel" and hit "Try it". My php script will then generate the short javascript you need. You can also move the channelviewer with your mouse.
The following page documents a 3 step procedure to do this, using Yahoo Pipes:
http://x10hosting.com/forums/tutorials/161362-how-automatically-embed-latest-video-youtube-channel-your-site.html