PDA

View Full Version : Miscellaneous Hacks - FACEBOOK Fan BOX - from - British Expats Australia

TimberFloorAu
09-03-2009, 10:00 PM
So you want Facebooks Fan Box on your site ?

But done with style !
Using scripts from : ww.dhtmlgoodies.com
Recoded by Timberfloorau of British Expats Australia - www.yobromofo.com
*****LEAVE ALL COPYRIGHT INTACT******

*************************************************
* IF YOU USE THIS MOD CLICK INSTALL
* otherwise no help can be offered *
*************************************************

Well here you , here is British Expats Facebook Fan Box

So simple to integrate, just 3 templates need editing.

> Template Edits required Manually are > Header / Footer and Navbar

STEP 1
Header holds 2 files, which must be called directly, facebook.css and facebook.js so please check the paths. As is, they are called from forum/facebook/ folder.
Just create a new folder in forum root, called facebook and upload the 2 files included. ( facebook.css and facebook.js )


STEP 2
goto your style, header.

At the very top add:


<!--start of british expats australia yobromofo facebook stuff by Timberfloorau-->
<link rel="stylesheet" type="text/css" href="facebook/facebook.css" />
<script src="facebook/facebook.js" type="text/javascript"></script>
<!--end of british expats australia yobromofo facebook stuff by Timberfloorau-->


Then click Save.

STEP 3
goto your footer template, and at the very bottom ( before any </body> tags ( shouldnt be any ) add the following code:


<!-- Code for the left panel british expats australia yobromofo facebook-->
<div id="dhtmlgoodies_leftPanel">
<a class="closeLink" href="#" onclick="initSlideLeftPanel();return false">Close</a><br />
<div id="leftPanelContent">
<!-- This is the content for fan box from FACEBOOK-->
<script type="text/javascript" src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script><script type="text/javascript">FB.init("c679e58f8333c747d4d0cbc7360ac93b");</script><fb:fan profile_id="153844529675" stream="1" connections="10" width="300"></fb:fan><div style="font-size:8px; padding-left:10px"><a href="http://www.facebook.com/pages/British-Expats-Australia/153844529675">British Expats Australia</a> on Facebook</div>
<!-- End content from facebook FAN BOX-->
</div>
</div>
<!-- End code for the left panel british expats australia yobromofo facebook-->


Change: THIS CODE YOU MUST GET FROM FACEBOOK ! Below is OUR code

<script type="text/javascript" src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script><script type="text/javascript">FB.init("c679e58f8333c747d4d0cbc7360ac93b");</script><fb:fan profile_id="153844529675" stream="1" connections="10" width="300"></fb:fan><div style="font-size:8px; padding-left:10px"><a href="http://www.facebook.com/pages/British-Expats-Australia/153844529675">British Expats Australia</a> on Facebook</div>


Then click Save.

STEP 4.

Goto your Navbar template.

find


<if condition="$vboptions['enablesearches']"><tr><td class="vbmenu_option"><a href="search.php?$session[sessionurl]do=getdaily">$vbphrase[todays_posts]</a></td></tr></if>


Add after it:


<tr><td class="vbmenu_option"><a href="#" onclick="initSlideLeftPanel();return false">Facebook Fan Box</a></td></tr>


Then click Save.

*************************************
Files enclosed are facebook.js and facebook.css

MAKE sure your path to these is correct in step 2. !

Reload your forum page, click on quick links, then click on facebook fan box

NOTE:

To use this mod, you need the code generated from FACEBOOK, for their FAN BOX. ( if you dont know what the fan box is then, perhaps this mod isnt for you )


Demo on www.yobromofo.com/forum

Enjoy
TimberFloorAu
09-04-2009, 01:33 AM
Reserved :)

Images Added:

Image one is NAVBAR link
Image two is BANNER link ( please ask me for this code )
Image three is the FanBox after it has SLID in

Some confusion, about the code:
Ok see below

______________________________________STEP 3

Just goto http://www.facebook.com/pages/create.php

Then when complete, in Left Hand Menu click Create FAN BOX for site.

Click Include Stream and Include Fans.

Then in Choose where to add it: select Other

You will get some custom code. Highlighted in RED below is our custom code, so replace with your OWN.

Code:

<!-- Code for the left panel british expats australia yobromofo facebook-->
<div id="dhtmlgoodies_leftPanel">
<a class="closeLink" href="#" onclick="initSlideLeftPanel();return false">Close</a><br />
<div id="leftPanelContent">
<!-- This is the content for fan box from FACEBOOK-->
<script type="text/javascript" src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script><script type="text/javascript">FB.init("c679e58f8333c747d4d0cbc7360ac93b");</script><fb:fan profile_id="153844529675" stream="1" connections="10" width="300"></fb:fan><div style="font-size:8px; padding-left:10px"><a href="http://www.facebook.com/pages/British-Expats-Australia/153844529675">British Expats Australia</a> on Facebook</div>
<!-- End content from facebook FAN BOX-->
</div>
</div>
<!-- End code for the left panel british expats australia yobromofo facebook-->

__________________
Flowsion
09-04-2009, 01:47 AM
I don't see it, take a screenshot please.
TimberFloorAu
09-04-2009, 02:03 AM
Added images in second post :)
Michael.A
09-04-2009, 08:39 AM
nice i was just going to ask you for this... loving the song
TimberFloorAu
09-04-2009, 08:02 PM
Thankyou for installing Mad-Dog :up:
bond010007
09-05-2009, 03:08 PM
pls i cant get wat u mean with this
STEP 3
goto your footer template, and at the very bottom ( before any </body> tags ( shouldnt be any ) add the following code:pls i need u to tell me how cos i can't got it and where i can put footer code cos every time i put i see it appear in footer not as demo

Installed
tnx
TimberFloorAu
09-05-2009, 08:56 PM
pls i cant get wat u mean with this
pls i need u to tell me how cos i can't got it and where i can put footer code cos every time i put i see it appear in footer not as demo

Installed
tnx


Templates do vary, I trust you have a custom template. ?

Please feel free to message me with your forum url, and a temp admin acct to do the changes for you, or indeed inspect your templates so that I may help :up:
MentaL
09-05-2009, 09:04 PM
so is this for anyones facebook or specifically yours?
TimberFloorAu
09-05-2009, 09:09 PM
so is this for anyones facebook or specifically yours?

Anyones mate , :confused:

Just goto http://www.facebook.com/pages/create.php

Then when complete, in Left Hand Menu click Create FAN BOX for site.

Click Include Stream and Include Fans.

Then in Choose where to add it: select Other

You will get some custom code. Highlighted in RED below is our custom code, so replace with your OWN.


<!-- Code for the left panel british expats australia yobromofo facebook-->
<div id="dhtmlgoodies_leftPanel">
<a class="closeLink" href="#" onclick="initSlideLeftPanel();return false">Close</a><br />
<div id="leftPanelContent">
<!-- This is the content for fan box from FACEBOOK-->
<script type="text/javascript" src="http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script><script type="text/javascript">FB.init("c679e58f8333c747d4d0cbc7360ac93b");</script><fb:fan profile_id="153844529675" stream="1" connections="10" width="300"></fb:fan><div style="font-size:8px; padding-left:10px"><a href="http://www.facebook.com/pages/British-Expats-Australia/153844529675">British Expats Australia</a> on Facebook</div>
<!-- End content from facebook FAN BOX-->
</div>
</div>
<!-- End code for the left panel british expats australia yobromofo facebook-->
bond010007
09-06-2009, 02:05 AM
here u are my template pls can u edit it for me sorry cos i have arabic forum :D
TimberFloorAu
09-06-2009, 03:20 AM
here u are my template pls can u edit it for me sorry cos i have arabic forum :D


Here you go
Brandon Sheley
09-06-2009, 04:26 AM
does this just add the fanpage box to a popup?
TimberFloorAu
09-06-2009, 05:51 AM
does this just add the fanpage box to a popup?

Yep. Slides out docks, and slides back in
MentaL
09-09-2009, 11:03 AM
ah i understand now ;)
fourat
10-13-2009, 07:52 PM
Hi thank you for this great box
can i use it by "online system" not "friend system"
i mean can i talk with every body online in my friend list or not ?

thank you
Deviate
11-09-2009, 07:49 PM
Was told that some users with mac are having problems were the letter 'p' will cause the panel to open/close and not let them type it in posts... no issues on windows PCs.... i notice in the .js there is reference to the key '112' which corresponds to 'p' what is that for and can we just remove that?
Cerbero1000
01-20-2010, 09:36 PM
Same problem here with the "p".
Please help, thanks!
hottweelz
01-24-2010, 05:47 PM
Same problem here with the "p".
Please help, thanks!

I can confirm this on windows as well.... via Google Chrome...

actually Chrome is the only browser mine works in.... IE and FF show a BLANK pop up.. :(