Dynadot

Why won't the Facebook like button work on my page?

NameSilo
Watch
Impact
227
Here's the HTML (Facebook code is in red):

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title>Ole Maria's Mexican Restaurant</title>
	<link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />	
	
</head>

<body>



[COLOR="Red"]<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>[/COLOR]



<div id="wrapper">
	<h1><span class="hone"><em></em>OleMarias.com</span>
	    <span class="htwo">WELCOME</span>
	    <span class="hthree">COME ENJOY OUR DELICIOUS FOOD!</span></h1>
	<div id="head-1"></div>
	<div id="head-2"></div>
	<div id="nav">
		<ul>
		  <li><a href="index.html">HOME</a></li>
		  
<li><a href = "javascript:void(0)" onclick = "document.getElementById('light3').style.display='block';document.getElementById('fade3').style.display='block'">DIRECTIONS</a>
<div id="light3" class="white_content3">

<img src="http://www.namepros.com/images/map1.jpg" alt="May">

<a href="http://maps.google.com/maps/ms?ie=UTF&msa=0&msid=
100716794170399456000.00049653ae57ce8a66354">CLICK HERE </a>

to go to Google Maps or

<a href = "javascript:void(0)" onclick = "document.getElementById('light3').style.display='none';document.getElementById('fade3').style.display='none'"> (X) to CLOSE</a>
</div>

<div id="fade3" class="black_overlay3"></div></li>
		  <li><a href="http://www.namepros.com/images/menu.pdf">OUR MENU</a></li>
		 
 <li><a href="https://www.google.com/calendar/embed?src=olemarias%40gmail.com&ctz=America/Chicago">CALENDAR</a>

		  


<div id="fade2" class="black_overlay2"></div></li>
		  <li class="last"><a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">CONTACT US</a>
<div id="light" class="white_content">

<div id="poptitle">Contact Us</div>
<div id="poptext"><p>We are located at 13655 North Wintzell Avenue in the city of Bayou La Batre, Alabama, directly next to the drawbridge.</p>
	<p></p>
	<p>Our phone number is 251-824-2444.</p>
	<p></p>
	<p>We are currently the ONLY full-service Mexican restaurant in the city of Bayou La Batre!</p>
	<p></p>
	<p>Please call us or click "Directions" on our homepage if you are having trouble finding our restaurant.</p></div>

<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'"> (X) Close</a>
</div>
<div id="fade" class="black_overlay"></div></li>
		</ul>
	</div>
	<div id="body-left">
		<h2><em>G</em>allery</h2>
		<div id="gallery">
			<div class="gal" id="gzero"><a href="https://www.facebook.com/ole.marias/photos_albums"><img src="http://www.namepros.com/images/pic_1.jpg" width="221" height="163" alt="Pic 1" /></a></div>
			<div class="gal" id="gone"><a href="https://www.facebook.com/ole.marias/photos_albums"><img src="http://www.namepros.com/images/pic_2.jpg" width="57" height="41" alt="Pic 2" /></a></div>
			<div class="gal" id="gtwo"><a href="https://www.facebook.com/ole.marias/photos_albums"><img src="http://www.namepros.com/images/pic_3.jpg" width="57" height="41" alt="Pic 3" /></a></div>
			<div class="gal" id="gthree"><a href="https://www.facebook.com/ole.marias/photos_albums"><img src="http://www.namepros.com/images/pic_4.jpg" width="57" height="41" alt="Pic 4" /></a></div>
			<div class="clear"></div>
		</div>
	</div>
	<div id="body-right">
		<h2><em>T</em>hanks</h2>

		<p>for visiting our homepage! We pride ourselves on serving the best mexican food made fresh every day.</p>
        <p>Our specialty is the Bayou Burrito. This delicious seafood burrito is sure to satisfy your appetite for seafood with a unique Tex-Mex flavor!</p>
        <p>Check out our calendar to see what events we have coming up for this month. Karaoke is an area favorite! Our calendar will also let you know which specials we are running each week.</p>
        <p>Click on "Menu" to open/print a PDF file of our menu. It's loaded with choices with a selection to satisfy any craving.</p>
        <p>We are looking forward to meeting you and introducing you to our delicious cuisine!</p>


<div class="clear spacer"></div>


[COLOR="Red"]<div class="fb-like" data-href="https://www.facebook.com/ole.marias" data-send="false" data-width="300" data-show-faces="false" data-font="verdana"></div>[/COLOR]


  </div>
	<div class="clear spacer"></div>


	<div id="footer">
		© 2013 Ole Maria's Restaurant
	</div>
</div>

</body>
</html>

Here's where I got the Facebook code:
https://developers.facebook.com/docs/reference/plugins/like/

Here's the site URL:
http://www.olemarias.com

The like button just opens and closes a message box quickly and then does nothing. No like activity shows on my Facebook and the like count doesn't go up on their Facebook page.
 
0
•••
The views expressed on this page by users and staff are their own, not those of NamePros.
Could someone please reply? :gl: Halp!
 
0
•••
Could someone please reply? :gl: Halp!

just a guess, looks like you're missing an app id,
yours js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
mine js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=215732225235322";

you may need an API key/App id from here
https://developers.facebook.com/apps
 
2
•••
I found out what was wrong. I had their Facebook URL in the code instead of their actual website URL. I'm an idiot. :red:

Thanks anyway Rich. Rep left!
 
1
•••
  • The sidebar remains visible by scrolling at a speed relative to the page’s height.
Back