PDA

View Full Version : facebook like button


harrys__
06-09-2013, 05:03 AM
Hi,

I tried so many different things but my facebook like button does not show on my design. I am using CS6. My code is below
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Facebook Like Button : nando</title>
</head>
<body>
<script type="text/javascript">
var urlToLike = 'http://www.facebook.com/NandosUSA';
if (urlToLike == '') {
urlToLike = window.location.href;
}
urlToLike = encodeURIComponent(urlToLike);
var font = encodeURIComponent('inherit');

document.write ('<iframe src="http://www.facebook.com/widgets/like.php?locale=en_US&amp;href='+urlToLike+'&amp;layout=st andard&amp;show_faces=true&amp;width=450&amp;height=150&amp;action =like&amp;font='+font+'&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; border-color:#ffffff; overflow:hidden; width:450; height:150"></iframe>')
</script>
</body>
</html>

I used the widget to create a like page. Also, do i need pre-requisite install for the facebook like page.

Regards,
Harry

edbr
06-09-2013, 05:58 AM
it isnt in design view or in a browser?

edbr
06-09-2013, 06:02 AM
fb says for a like button
Include the JavaScript SDK on your page once, ideally right after the opening <body> tag.
<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>
Place the code for your plugin wherever you want the plugin to appear on your page.

<div class="fb-like" data-href="http://www.facebook.com/NandosUSA'" data-send="true" data-width="450" data-show-faces="true"></div>

harrys__
06-10-2013, 01:24 AM
Hi edbr,

It still doesn't work . I am using the widget from the widget browser and its fine when I look at it in live view but when I save it , I cannot see the stats or anything. When I add it by using insert - > Widget it does not work. I am using tabbed panels with it. Should I post the entire page code.

Regards,
Harry

edbr
06-10-2013, 04:31 AM
yes can do ,

harrys__
06-10-2013, 06:36 AM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Facebook Like Button : test</title>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script src="includes/jquery-1.4.2.js" type="text/javascript"></script>
<script src="jQuery/js/jquery.jsocial.js" type="text/javascript"></script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-image: url(file:///C:/background.jpg);
}
.TabbedPanelsContent #TabbedPanels1 .TabbedPanelsContentGroup .TabbedPanelsContent.TabbedPanelsContentVisible p {
/* [disabled]color: #306; */
}
<div id="fb-root"></div>
</style>
<link href="jQuery/css/style.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/xml">
<!--
<oa:widgets>
<oa:widget wid="2149023" binding="#social" />
<oa:widget wid="2149022" binding="#OAWidget" />
</oa:widgets>
-->
</script>
</head>
<body class="TabbedPanelsContent">
<div id="TabbedPanels1" class="VTabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">Home Page</li>
<li class="TabbedPanelsTab" tabindex="0">About Me</li>
<li class="TabbedPanelsTab" tabindex="0">Photos/ Videos</li>
<li class="TabbedPanelsTab" tabindex="0">Services/ Contact Details</li>
<li class="TabbedPanelsTab" tabindex="0">Client Feedback</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<p>Home page</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<div class="social"></div>
<script type="text/javascript">
// BeginOAWidget_Instance_2149023: #social

//code for the facebook like widget
// EndOAWidget_Instance_2149023
</script>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div class="social"></div>
<script type="text/javascript">
</script></div>
<div class="TabbedPanelsContent">
<p>Content 2</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
<div class="TabbedPanelsContent">
<p>Content 3</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
<div class="TabbedPanelsContent">
<p>Content 4</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
<div class="TabbedPanelsContent">
<p>Content 5</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
</body>
</html>