search engine by freefind advanced

WEB DESIGN

Do You Know About Web Design. Browse This Page. And Learn About It.

 
 







Rubrik Elektronik


Blog kang Rohman


UniQue Template


CSS Library

AEST

CSS & XHTML

Java

Others

PHP

Resources

Themes






If you want to set your favorite background in your website then upload that picture HERE and click on that picture and copy the url for your website. How can you set that url i describe it leter (If Allah wants).





 
                               
                            Do You Know About Blog? Click Here ---



 


 



 


 

                                                                         
  






More

TUTORIA

CLICK

By YouTube(How can you make

Blogging Tutorial & Free Templates & Some Software


 

Get Search Engine                   Click

Get Visitors Counter

                                               Click
                                               With Flag


To Make A Slide Show In Your Website  
Click                                           


How  do I add video to my web site:


How Can I Create On My Web-Site A Flash Banner


Tutorial

CLICK(How Can I add Music In My Website)
Click(Tutorial about flash MP3)
Click(About That)
CLICK(Some Funny Things That Your Website Make Beautiful)
Get A Domain With Hosting
(Total Free)

TOOLS

GET SOME TOOLS TO MAKE A WEBSITE

 CLICK (for visitors counter)

CLICK(Digital Dictionary)

CLICK(For Add MP3 In Your Web-site)

 CLICK(How to make a pop up window)

CLICK(For create gif. file)

CLICK(To Create A Pop Up Window)

CLICK(Same And Very Interesting)
CLICK(So Many html Code)

CLICK(To Get A Comment Option)

CLICK(For Flash Button Create)

CLICK (Many Flash Things)

CLICK(Many Java Thisngs)

CLICK(Get Peel Banner)

CLICK(Get Some Funny Logo)

CLICK(Get Some Funny Things)

CLICK (For Some Blogspot Template & Tips And Tricks)

CLICK (Web Soft)

Make Like box for your website
At first go Facebook Page then Login 

Where you get API Key of you facebook

Click  Ses My Apps
Then you could see all.
Or see this




Like button 
Or  
Like box 
At first log in and write in you address bar
www.facebook.com/pages/ 
or click on that link. Then click on the right hand side +Create Page. After that you can see a page where it wants a name of the page you may write a page name as your wish.......



Now you get a linking address of the like button or box so copy the link from your address bar and paste it in here after log in GO as you may see from bellow picture

paste here only your url that you copied. Press Get Code. Width and height you may change from that code. Here are two kinds of code iframe for place any where as you wish in you webpage. And XFBML  for CSS code which may place before the .

For more details see this...

Facebook Like button XFBML tutorial

 

image
While searching for a solution that would let me add the "Like" button plus the ability to leave a comment on the "Liked" item (see picture on the left), I finally found the solution that I share bellow. Just follow exactly the next instructions and that's it.

Technique 1  

(Remember that it may not work in Google Chrome I found this in firefox)

With this technique, you'll get a like button where someone can add a comment to the liked item. Instead, if you want to have this like button and a comment form, see bellow the technique 2.
Note: If you prefer not using the Facebook API, just have a look here.

First, set up a new application:

1. Go to: http://www.facebook.com/developers

2. Click on the + Set Up New Application button (at the top right of the page)
3. Type your Application Name (example: Mysite-Name Likes) > select Agree > click on Create Application

4. Go to the Connect tab (on the left tabs-list)
5. Enter your site url with an ending slash in Connect URL and click on Save Changes (for example: http://mysitedomainname.com/)
6. You will see your Application ID number (below your app API & Secret)
7. It will take between 2 to 20 minutes until it will be ready to use with.

Second, remove any old Facebook script, for example:


Or whatever script code of facebook that you got in your page.
(only remove the JavaScript, not the fb: tags)

The setup steps:

1. Add this attribute to your tag:
xmlns:fb="http://www.facebook.com/2008/fbml"
so in the end your tag will look like this:
xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" lang="en">
2. Add this code right after the tag:


Change 'YOUR APP ID' with your application ID number, not the API like was before in the old version.

3. Go here and set all the attributes you want in the demo, then click on 'Get Code' and copy the XFBML version from the popup window.
Remember to add http:// at the beginning of your url.

4. Drop your tag where you want in your page.  (but it must to be somewhere after (below it, not need to be right after) the code in step#2, and not before it)

NOTE 1: to use in a blogger blog, the above code should look like:

This allows you to have individual likes for each post.

NOTE 2: If you prefer that your button says "Recommend" instead of "Like", use this code instead (adapted for blogger):


5. Set the Open Graph protocol meta-tags:
you need to add some new facebook meta-data tags called Open Graph

From this page:
To customize how your site shows up when users share your page with the Like button, you can add meta data to your web pages:
• og:title - The title of your page; if not specified, the title element will be used.
• og:site_name - The name of your web site, e.g., "CNN" or "IMDb".
• og:image - The URL of the best picture for this page. The image must be at least 50px by 50px and have a maximum aspect ratio of 3:1.
For example if you are creating a page about the movie 'The Rock' you would include this meta data:



6. Your page must have a document type tag at the most beginning of it (above ) if you do not have one:
For HTML add this:

For XHTML add this:

Or just this:

DONE!

Technique 2

If you are interested in having the Facebook comments box and the like button (with the option to add a comment to the liked item), use instead the following tutorial (copied from Full: Comments-box + Like-button + Language). You'll get something like this:
image

First, set up a new application:
1. Go to: http://www.facebook.com/developers

2. Click on the + Set Up New Application button (at the top right of the page)
3. Type your Application Name (example: Mysite-Name Comments) > select Agree > click on Create Application

4. Go to the Connect tab (on the left tabs-list)
5. Enter your site url with an ending slash in Connect URL and click on Save Changes (for example: http://mysitedomainname.com/)
6. You will see your Application ID number (below your app API & Secret)
7. It will take between 2 to 20 minutes until it will be ready to use with.
If you update from the old comments-box version so:
1. Remove:

2. Remove:

3. Then you just stay with your tag, and the xmlns:fb=http://www.facebook.com/2008/fbml.

4. Follow the steps for the new version below!

The new version setup steps:
1. Add this attribute to your tag:
xmlns:fb="http://www.facebook.com/2008/fbml"
so in the end your tag will look like this:
xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" lang="en">
2. Add this code right after the tag:


Change 'YOUR APP ID' with your application ID number, not the API like was before in the old version.

3. Drop your tag where you want in your page.
(but it must to be somewhere after (below it, not need to be right after) the code in step#2, and not before it)

NOTE: to use in a blogger blog, the above code should look like:


4. THE ATTRIBUTES

Go here and check all the attributes you can use.
XID: You better use the xid attribute:
1. Otherwise if you will make a change to your page url,
then all the comments that where on that page will be gone.
2. This is the only way you can add 2+ coments-boxes on the same page for individual items.
3. This is the only way you can show the same comments-box on 2+ different pages.
Because of all these reasons it's kind of making the XID as a "must" attribute, so go and add it!

URL: You better use the url attribute, otherwise visitors who will click on the link from the post on the facebook live stream, they may be redirected to the wrong page. Let's say if you got a website with 2 pages "home" and "news", then you present the latest news article from the 'news' page on your 'home' page, and you let visitors to comment about that article from the 'home' page too, then if you didn't use the right url with the url attribute, your visitors will be directed to the 'home' page and not to the specific news article page they friend commented on. And just the same thing will happen if a visitor click on the Like button that come with the comments-box. So this attribute helps to set correct the comments-box & the Like button that comes with it.

TITLE: use the title attribute so - when a visitor post a comment and that comment will show up on the visitor facebook profile page, then It will present that the comment posted in the page/article with that title you specified in the attribute.
Set or remove the Like botton:
(that comes with the comments-box above it)
Set the Like button - Open Graph protocol meta-tags:
For making the Like button to present your site content (the one that the visitor liked),
you will need to add some new facebook meta-tags called Open Graph

From this page:
To customize how your site shows up when users share your page with the Like button, you can add meta data to your web pages:
• og:title - The title of your page; if not specified, the title element will be used.
• og:site_name - The name of your web site, e.g., "CNN" or "IMDb".
• og:image - The URL of the best picture for this page. The image must be at least 50px by 50px and have a maximum aspect ratio of 3:1.
For example if you are creating a page about the movie 'The Rock' you would include this meta data:



Remove (Hide):
To hide the Like botton, you will need to add 2 attributes and create a CSS file.
1. simple="1"
2. css="http://yoursitedomainname.com/fb_comments.css"
simple="1" css="http://yoursitedomainname.com/fb_comments.css">
in the css file add this style code:
div.like {display:none;}
(You can learn more about these and other attributes here)









 
TopBottom