Facebook Social Plugins Integration in Website

Facebook Platform enables you to make your website more social. You can use our Social Plugins, such as the Like Button to drive user engagement with a single line of HTML.  Login Button and Registration Plugin let you simplify or eliminate your own user registration and sign-in. Lastly, the Graph API lets you access the full social graph of a given user, allowing you to create a truly deep personal experience.

Social Plugins are the easiest way to get started with Facebook Platform. The plugins are embeddable social features that can be integrated in your site with a line of HTML. Because they are hosted by Facebook, the plugins are personalized for all users who are currently logged into Facebook, even if they are visiting your site for the first time.


Following are the different  Facebook Social Plugins.

Facebook Like Button

Send Button

Facebook Comments

Share Button

Like Box

Facebok Social Plugin from where you can get the code and just past into your website.
Each link Socail plugin will give you  two codes and are following

• JavaScript SDK  (include once only)<div id="fb-root"> </div> <xmp> (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/sdk.js#xfbml=1&amp;appId=508427595967225&amp;version=v2.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));

HTML Code (Must include for each Social plugin)

<div class="fb-like-box" data-colorscheme="light" data-header="true" data-href="https://www.facebook.com/pages/Web-Technology-Experts-Notes/1486091758321940" data-show-border="true" data-show-faces="true" data-stream="false"> </div>

Following are the links from where you can get the HTML tag

• Facebook Like Button,
• Send Button,
• Comments 
• Login Button
• Registration, 
• Share Button
• Embedded Post
• Like Box 

Best Related Posts are Following:

1. Facebook SDK javascript - Facebook Login Check, Get Login Details, Share URL and POST to Profile.
2. Facebook Login Integration - Multiple Facebook IDs for the same user[Solved].
3. Share count and Share URL of Facebook, Twitter, LinkedIn and Pinterest.
4. Disable facebook notification popup after Click on Facebook Like Button.
5. How to share Embed youtube video on facebook From my website.
6. How to Find a Facebook Profile From an Image URL.
7. How to integrate Facebook open Graph API in Website.
8. How to clear Facebook image cache.
9. Facebook Comments Disable Comment using Yahoo, AOL or Hotmail.
10. Facebook comments Integration in website.
11. Facebook login with javascript SDK example.
12. Facebook User Profile Get Custom Picture of Facebook User.
13. Facebook Login with JavaScript.
14. Firebase Chat with Facebook and Twitter Integration.
15. Facebook Registration Plugin with XFBML.
16. Facebook Registration Plugin with Custom Fields.
17. Facebook Social Plugins Integration in Website.
18. jQuery Autocomplete like Facebook With Demo.

How to change FCKeditor skin, ToolbarSet, height and width

CKEditor is a text editor to be used inside web pages. It's a WYSIWYG editor, which means that the text being edited on it looks as similar as possible to the results users have when publishing it. It brings to the web common editing features found on desktop editing applications like Microsoft Word and OpenOffice.

Because CKEditor is licensed under flexible Open Source and commercial licenses, you'll be able to integrate and use it inside any kind of application. This is the ideal editor for developers, created to provide easy and powerful solutions to their users.

Implement with cakephp, Its an easy just follow the some steps. How to implement?

 How to  change FCKeditor skin, ToolbarSet, height and width.
Suppose in one page you have 3 editor and each need different height, width, skin or toolbarset. for this, Follow the following lines.

1) open file "app/views/helpers/fck.php"
2) go to function "load"
3)set all the vars as below

load($id, $skin='silver', $toolbar = 'Basic', $height='400', $width='300');

4)put the variable $skin as below

 bFCKeditor_$did.Skin         = '$skin';

do all the same

5)open the ctp file for add/edit where u r using calling load function [where u r creating editor]
and pass the arguments as below

 $fck->load('id', 'silver','Basic','200px', '200px' );

Best Related Posts are Following:

1. Image not displaying uploaded by CKeditor.
2. FckEditor Custom Toolbar- Mange Tools.
3. How to change FCKeditor skin, ToolbarSet, height and width..