How To, Tweet Button sample code help? - javascript

i'm trying to implement a Tweet Button from this page http://dev.twitter.com/pages/tweet_button
and it looks like ti doesn't working very well for me. if my website is www.xxx.com the script should be:
Tweet
the graphics load but the count is 0.
i don't understand what could be wrong.
any ideas?
Thanks

Try this code, using jQuery
<img id="tweetButton" style="cursor:pointer;" title="Share this on Twitter" src="http://a3.twimg.com/a/1294785484/images/goodies/tweetn.png" />
$("#tweetButton").click(function () {
window.open("http://twitter.com/share?url=xxx", "tweet", "status=0,toolbar=0,width=500,height=300");
});

You need to go register for this feature on the twitter developers site. Once you do that it should generate some sort of number or code for you to put on your page that will link everything together and start counting as it should.

Related

Adobe Muse - Event Listener in Custom HTML embed wont work properly after being added to muse?

I'm having a pretty weird problem while trying to design this page inside of adobe muse. I'm not an adept at coding javascript, so don't get mad if something is wrong, but here is what i'm trying to accomplish.
I decided to design this website with adobe muse, because the company I work for decided that the in-browser editor that came along with muse was the perfect solution for what we were doing. I shortly after figured out that designing things around using muse can sometimes be quite frustrating, and this is one case that I just cant wrap my head around.
I'm running several kinds of searches on the site, and for now, since I didn't have much time I thought the easiest way to incorporate all 3 different searches into 1 page was to design a custom search embed, that had tabs to toggle though all 3 kinds of searches, then I would write some super simple javascript that takes the text inside of an input, and plugs it into a url that redirects the page to wherever the search results were for the said word.
<script>
function storeSearch(x) {
location.href = "http://gistsilverbuckle.com/store.html#!/~/search/keywords=" + (x) + "&offset=0&sort=relevance";
}
document.getElementById("ecwidSearch").addEventListener("keyup", function(event) {
event.preventDefault();
if (event.keyCode === 13) {
document.getElementById("ecwidSearchButton").click();
}
});
</script>
<div class="ecwidStoreSearch">
<div class="searchContainer">
<div class="searchFormContainer">
<form>
<input type="text" class="searchField" id="ecwidSearch" placeholder="Search the Store">
</form>
</div>
<div class="searchButtonContainer">
<div class="customSearchButton" id="ecwidSearchButton" onclick="storeSearch(document.getElementById('ecwidSearch').value)">
<svg class="searchButtonIcon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12.55 12.82">
<title>Looking Glass</title>
<path d="M306.8,264.12a3.54,3.54,0,0,0,.1-5h0a3.53,3.53,0,0,0-5-.1h0a3.54,3.54,0,0,0-1.08,2.48,3.49,3.49,0,0,0,1,2.5h0a3.48,3.48,0,0,0,2.47,1.08,3.56,3.56,0,0,0,2.52-1Zm2.17-2.46a4.59,4.59,0,0,1-1.05,2.84l4.35,4.51-.78.76-4.35-4.51a4.63,4.63,0,0,1-2.88.93,4.59,4.59,0,0,1-3.23-1.4h0a4.64,4.64,0,0,1,.11-6.53h0a4.62,4.62,0,0,1,6.53.12h0A4.64,4.64,0,0,1,309,261.66Z"
transform="translate(-299.73 -256.95)" />
</svg>
</div>
</div>
</div>
</div>
Fairly simple, right? That's what I thought too, it worked for me when I tested it inside of dreamweaver, but as soon as I embedded the code inside of muse, the base function works if you click the search button, but it doesn't work if you hit enter?
I'm probably doing something extremely dumb, so maybe you could point it out to me.
Here is my jsfiddle: https://jsfiddle.net/fosterboytron/3aba7gsa/
here is the link to the page i'm creating. http://gistsilverbuckle.com/search.html
Hope I included enough information, if you need any more, just respond and i'll add whatever you need.
Thank you for whatever help you can offer!

Making a hyperlink for Angularjs

I am working on a mobile site. I have created a hyperlink that works and was written in basic javascript.
'Go to Tour info '
This code works fine. But I wanted to change the code too better work with angularjs. I tried rewriting it just as...
'<a ng-href="/tours/'+$scope.tourmarkers[i]._id+'">Go to Tour info </a>'
where i cut off part of the of the url that was already being used. I changed the href by adding the ng in front. But I do not feel this is an angular statement. How can i make my original hyperlink be written for angularjs??
try this:
<a ng-href="{{'/tours/' + $scope.tourmarkers[i]._id}}">Go to Tour info </a>
try this
<a ng-href="/tours/{{$scope.tourmarkers[i]._id}}">Go to Tour info </a>
OR
in your controller
$scope.path = '/tours/' + $scope.tourmarkers[i]._id
now in view
'<a ng-href="{{path}}">Go to Tour info </a>'
since ng-href binds dynamically

how to make a twitter-bootsrap popover on an HTML image map

I am making a website, in the website i haven an image with an image map.
I am stuck on this point, the popover is working perfectly in an tag but not in the tag. does anyone know how to get the twitter-bootstrap popover work on an image map?
I think it has someting to do with this line: $('#example').tooltip(options) tooltip exaple
the twitter-bootstrap pover
Thanks (i hope my English is understandable)
Turn your image map into something like (fill the ...px with actual dimensions):
<div id="#map" style="position:relative;width:...px;height:...px;background-image:...">
<a id="map-link-1" href="/path/url/for/target/or/#"
style="position:absolute;top:...px;left:...px;width:...px;height:...px"> </a>
<a id="map-link-2" href="/path/url/for/target/or/#"
style="position:absolute;top:...px;left:...px;width:...px;height:...px"> </a>
...
</div>
Then deal with the anchors like you are used to.

Javascript variables

I'm learning Javascript right now. Can anybody tell me why the second code block traces a empty path for -launch(this)- but using the first code block it gives me the right path?
"<form action='"+launchwebsite+"/subsite/' method='post' target='_blank' onsubmit='launch(this)'>"
and this not:
"<a onclick='launch(this)' title='launch' class='iblack' /></a></div>"
Best
Uli
The this refers to the the element it is attached to. In the first snippet it is the <form>- and in the second the <a>-element. Also the <a> lacks a href-attribute.
I'm not shure but if the code you put is exactly what you are testing you are missing a ;
<a onclick='launch(this)' title='launch' class='iblack' /></a></div> <-- You're Version
<a onclick='launch(this);' title='launch' class='iblack' /></a></div>
Else I never really did an onclick on a html control I usually do href="" to call another page php per exemple and in that page to the treatment I want.
Another point I`ve looked at is to catch this command in javascript you would need you to call and "blank" page as of
<a href="#" onClick='launch(this);' title='launch' class='iblack' /></a></div>
This last code acutally worked for me! Keep me in touch, wanna see if this works out for you!!
Patrick

How do I add a hashtag to a custom tweet button?

I'm trying to create a custom tweet button with a popup, this part works. However, I am unable to get it to post hashtags in the text area.
Tweet content
url=http://www.mywebsite.com&text=mytweetcontent&via=mytwitterusername
In the &text= I've experimented with using mytweetcontent+#myhashtag as well as trying the URL encoding %23 (which corresponds with #); however, I am still unable to get a hashtag to appear. Any ideas on what I can do? I would prefer to have a custom image, which is why I am not using the proprietary twitter jscript button. Thanks very much for your help!
Full code for reference:
<img src="twitter-logo.png" border="0">
Edit* Response to comment
thanks for the suggestion! i didnt try with hashtag, just normal, but changing the & to ? removes the content area, code below. Top line is the result in the tweet box, below is corresponding url.
mycontent http://t.co/nKb4nWC via #myusername
http://twitter.com/intent/tweet?text=mycontent&url=http%3A%2F%2Fwww.mywebsite.com&via=myusername
http://t.co/YzrDfzX via #myusername
http://twitter.com/intent/tweet?url=http%3A%2F%2Fwww.mywebsite.com%3Ftext%3Dmycontent&via=myusername
What's wrong with using the following?
<a href="http://twitter.com/intent/tweet?text=Text%20%23hashtag&via=JohnDoe"
onclick="return !window.open(this.href, 'tweet', 'menubar=no')">
<img src="twitter-logo.png">
</a>
Twitter
<script type="text/javascript">
$('.socialLinkTwitter').click(function (e) {
e.preventDefault();
var sTwitterShare = $(this).attr('href');
window.open(sTwitterShare,'Share','width=550,height=450');
});
</script>

Categories

Resources