I've been trying to implement a Facebook Like button on my blog like this:
$("#fblike").append(" <iframe src='http://www.facebook.com/plugins/like.php?app_id=217624258276389&" + window.location.href + "&send=false&layout=box_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=60' scrolling='no' frameborder='0' style='border:none; overflow:hidden; width:50px; height:60px;' allowTransparency='true'></iframe>");
And adding this to the <head> of my HTML source file:
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
The problem is that when I try to test the Like button it shows 1 instead of 0 and a second later goes back to 0. Nothing changed at my Facebook profile neither. What's wrong and how to correct this?
PS: I'm running this on a localhost server, in my case http://nathan-camposs-macbook-pro.local/~Nathan
I think the events go something like:
You click the button.
Javascript sends the like request to FB.
Facebook tries to access your page ("localhost").
It can't access it so the request is denied.
UPDATE:-
I noticed that your src attribute starts: 'http://www.facebook.com/plugins/like.php?app_id=217624258276389&" + window.location.href + "&
i think it should be: 'http://www.facebook.com/plugins/like.php?app_id=217624258276389&href=" + window.location.href + "&
notice the href=
I've had problems testing the like on sites using temp urls - Facebook doesn't like it when the associated app_id value is not related to the url of the page you're trying to like. But I could be wrong. If you temporarily expand the width to something beyond 50 (like 300-350), there should be an "error" link that pops up that will give you some more valuable information...
If you use fbml then you will not need the application ID. Using fbml you can configure several things. I think you already have a look at-
http://developers.facebook.com/docs/reference/plugins/like/
You can try the following code
<head>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
</head>
Then in the body
<div id="fb-root"></div>
<fb:like href="http://yoururl" send="true" width="450" show_faces="true" font="">
</fb:like>
Related
I would like to a HTML code with the following functions if you guys can help , please.
Once the page loads, after 1 second to auto click on a hyperlinked text , how do I do this ? For the new website to be opened in the same window.
I have this code but this one is sending me to a new window and the pop up is blocking - not good
<!DOCTYPE html>
<html>
<body>
<head>
<script>
function autoClick(){
document.getElementById('linkToClick').click();
}
</script>
</head>
<body onload="setTimeout('autoClick();',700);">
<a id="linkToClick" href="http://www.google.com" target="_blank">GOOGLE</a>
</body>
</body>
</html>
Thanks
Instead of using <a href=> you should try just setting the variable window.location.href. So your code should look something like this:
<body onload="window.location.href='http://www.google.com',700);">
https://www.w3schools.com/howto/howto_js_redirect_webpage.asp
Let me preface this by saying this is extremely questionable when it comes to web design, and generally regarded as a shady or bad practice. That said:
$(window).on('load', function(){
window.location = 'http://example.com'
});
OR (vanilla JS)
window.onload = function(){ window.location = 'http://example.com' };
Again, be careful with this. If you want to do something like this, you need a pretty good reason why.
Possible duplicates:
Redirect from an HTML page
HTML redirect on page load
I am using a LinkedIn share button, but it is not getting content/image from my web page, it is just getting website url and that's all. I am using the following code, please see and let me know what is problem with it.
<script src="//platform.linkedin.com/in.js" type="text/javascript">
lang: en_US
</script>
<script type="IN/Share"
data-url="http://www.websiteurl/blog/2014/03/obamacare-health-plans-may-prove-costly-cancer-patients/"
data-counter="right">
</script>
As far as the image goes, it might not be the right minimum size (80 x 150 px, according to the link below). You might also want to try explicitly setting which image to use using metadata tags described in the link below, for example:
<meta property="og:image" content="http://www.websiteurl/images/blah.png" />
More:
https://developer.linkedin.com/documents/setting-display-tags-shares
For LinkedIn share button, content/image.
Try the link u will get some idea.
https://developer.linkedin.com/documents/share-api
It seems that firefox has disabled the ability to run a javascript: from the URL...does anybody know of a way around this?
My site requires an id pulled from the html of another site when that user is logged in. Instead of having the user search the 'view source' page I devised a javascript link to scrape it and send it to the site automagically, but it doesn't work on firefox.
The actual code I'm trying to run:
javascript:void(window.open('http://mysite.com/login?u=' + encodeURIComponent(window.location) + '&s=' + SessionId));
Scrapping the session id from the game in order to pull data for the player, nothing like a facebook hack or anything malicious.
I'd have to see your code but you really shouldn't have a problem doing what you're attempting to do. If you need another option though I have one you could try. If the content of the page you're scraping is within the same domain as your other site you could use an iframe to get the ID.
Here's some code to consider:
Your data collecting page:
<!DOCTYPE html>
<html>
<head>
<title>Disable Firefox 7.0.1 javascript in url security</title>
<script type="text/javascript">
function scrapeData() {
var frame = document.getElementById("otherPage");
var otherPagesObj = frame.contentWindow.document.getElementById("otherContent");
alert("Your data: " + otherPagesObj.innerHTML);
}
</script>
</head>
<body onload="scrapeData();">
<iframe id="otherPage" src="otherpage.htm" width="1" height="1" />
</body>
</html>
Your page to be scraped (otherpage.htm):
<!DOCTYPE html>
<html>
<head>
<title>Other Page - Disable Firefox 7.0.1 javascript in url security</title>
</head>
<body>
<div id="otherContent">1</div>
</body>
</html>
Using the above code you can see "1" alerted from the div of another page. This is a simple, cross-browser compatible option for what you're attempting to do.
Hope this helps.
I have an open web page dialog. From there, what I'd like to do is when the user clicks on a link, refresh the contents of the dialog with modified query string parameters. The problem I am running into is that rather than refresh the same web page with new parameters, a new browser window pops up.
Here is the page used to open the dialog:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function ShowPopup() {
var popWinFeatures = "dialogWidth: 800px;dialogHeight:600px;center:yes;status:no;scroll:no;resizable:yes;help:no";
window.showModalDialog("webPageDialog.html","PopUpWin",popWinFeatures);
}
</script>
</head>
<body>
Click For Modal
</body>
</html>
and this is the code within the webpage dialog that attempts to refresh the webpage with changed query string parameters:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="scripts/jquery-1.6.4.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var queryString = "?ab=123";
var newURL = window.location.protocol + "//" + window.location.host + "/" + window.location.pathname;
$('#testLink').attr('href', newURL+queryString);
});
</script>
</head>
<body>
Please Click Me
</body>
</html>
I've also tried using window.open as well as setting window.location. And I've also tried setting window.location.href but the result was the same.
the new browser window displays exactly what I expect. It's just not in the same window.
Thoughts?
Since posting this question, I came up with two possible solutions. In case anyone comes after me and wants to know what I ended up doing, here you go!
The first was just to make the popup non-modal. Removing the modal piece gave me the behavior exactly like I expected it. This didn't work in my situation however for a different reason... It seems that the session cookie was not carried over which in this web app, would cause the log-in page to be displayed before then displaying the correct page. This struck me as odd, but ran out of time to investigate why that was happening.
Second (and this is the solution i ended up going with) was to use an iframe, and display what i needed within the iframe. Definitely not my favorite, but it works!
I have a website which I host myself. I do not have a static IP address so I have all traffic for my domain forwarded with masking to my DDNS account. The resulting page looks like this...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>mydomianname.com</title>
</head>
<frameset rows="100%,*" border="0">
<frame src="http://myddns.dyndns.org/mydomainname" frameborder="0" />
<frame frameborder="0" noresize />
</frameset>
</html>
How can I update the URL of the "parent" frame as users navigate within the "child" frame?
UPDATE: Success?
I have tried doing this with javascript but had an issue getting the correct href to my javascript function with out having adverse side effects (having two windows open up, having my main window go to the wrong location, or making it so the back button didn't work right). All I needed was an attribute of my a tag to hold a value that I could use in my javascript, but would do nothing else at all. Adding the attributed value event though it is not a native attribute to the a tag works great.
The a tag...
<a onclick="url_update(this);" value="test/test.html" href="javascript:void(0);">test link</a>
and the javascript function...
function url_update(element){
base_url = 'http://mydomain.com/';
window.parent.location.href = base_url + element.getAttribute('value');
}
the resulting updated URL is...
http://mydomain.com/test/test.html
... and there are none of the previously mentioned side effects.
The only "side effect" that I would like to fix is display of the link in the info bar at the bottom of a browser window. Right now it says javascript:void(0); because that is what is written in my href attribute, but I would like it to show the updated URL when the link is hovered over... any thoughts?
It would be even better if I could scrap all of this javascript and use IIS 7 URL Rewrite 2.0 to do this instead... but I have yet to master the black art of URL rewriting.
javascript:
window.top.location = 'anther url'
--UPDATE to your updated question
use element.getAttribute('value') instead of element.value
--UPDATE #2
Use the href attribute, however, add a return false; to the onclick function:
<a onclick="url_update(this);return false;" value="test/test.html" href="test/test.html">test link</a>
Once you are doing that, you might aswell skip the value attribute and just use the href property, update your url_update function to use element.href instead of element.value
It's hard to tell from your question exactly which frames are doing what, but if The Scrum Meister's solution works for you, than you can easily implement what you want by adding this to each of your A tags.
target="_top"
Your example modified.
test link
You could also do this with jquery...
On the page where all A tags should have target="_top" you can implement the following jquery code on the page and it will dynamically add the target to all links.
<script language="javascript" type="text/javascript">
$(function()
{
$("A").attr("target","_top");
});
</script>
That is assuming that you have normail A tags with the href attribute, you can get rid of the onclick all together, no other javascript is required with the target solution.
First you need to be on the same domain... otherwise for security reasons you can not change it.
Declare and call this function in your child frame
function change(theUrl){
window.parent.reloadContent(theUrl);
}
In your parent have the following function :
function reloadContent(theUrl){
if (theUrl != ""){
document.getElementById("frameID").src= theUrl ;
}
}