I'm looking to set up this facebook "Like Box"

https://developers.facebook.com/docs/reference/plugins/like-box/

in a region on my home page panel. The instructions say:

Include the JavaScript SDK on your page once, ideally right after the opening tag.
This script uses the app ID of your app:

<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&appId=XXXXXXXX";
  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-box" data-href="https://www.facebook.com/pages/XXXX" data-width="340" data-show-faces="true" data-stream="true" data-header="true"></div>

My questions is about the first section of code - I'm just not sure how I can set that up so that the page reads it. The second section works and creates the region, but nothing is displayed there because I don't know what to do with the first section.

Thanks!

Comments

lomo’s picture

Luckily there is a module (or at least two) for that. There may be others which include a "Facebook Like box" block, but you should be able to do this with either of the following modules:

Hope that helps. :-)

See you at the Drupalcon!

BDaggerhart’s picture

Ah thanks! I had found the Facebook Social Plugins Integration, but couldn't get it to work (and apparently there are a lot of bugs in it), but had not seen JASM. Thanks!

lomo’s picture

Since I haven't used either module, and to help further develop the community forum, please let us know if JASM does what you want. Best of luck! :-)

See you at the Drupalcon!

BDaggerhart’s picture

Well, so far, I can't get it to work "out of the box," so I'm going to go into the module and tamper with it and see what I can figure out...

lomo’s picture

If it's not providing the "out of the box" functionality it should, perhaps read the issues in the JASM issue queue. And if you need to modify the code, I would suggest doing it on a Git checkout of the master branch of the module so that you can contribute a patch if you get things working. :-)

See you at the Drupalcon!

BDaggerhart’s picture

Hi,
I would love to do that. I was able to actually get mine to work with just one extra line of code. However, I've never supplied a patch to a module before, and am not sure exactly what I should do and what procedures to date - could you point me in the right direction?

lomo’s picture

I'm no expert (yet), but I do want to get better with Git and with all this, so I'll tell you what I do know:

  1. Go to the JASM page for "Git clone" directions and select the 6.x branch (or master, if you think your patch can be committed to both branches).
  2. Follow directions to clone with Git (you may need to install Git first. See the full Git documentation, if necessary.
  3. See the Making a Drupal patch with Git documentation for details about how to create a patch for JASM
  4. Create an "issue" for JASM. Describe the problem clearly and attach the patch file you've created. Set the issue status to "needs review".

If you have any other questions, you can ask them here and there are loads of people who can help. :-)

See you at the Drupalcon!

InfluenceJamie’s picture

To answer your initial question, you can add inline script to your page.tpl file using the drupal_add_js method, like so:

<div id="fb-root"></div>
<?php
drupal_add_js('(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"));', 'inline');
?>

A couple of things to note about adding js through this method that always confused me at first, firstly, change any apostrophes (') in your script to quote marks (") and only use apostrophes (') at the beginning and end of the drupal_add_js call. Easily overlooked, but if you don't follow this convention, drupal thinks you're closing a quotation when in fact you're wanting to add a string inside of a quotation.

Hope that helps you.