IFRAME TUTORIAL

Find us on Facebook

Facebook recently announced that on March 11, 2011, the Static FBML application will no longer be available to be added to Pages and that no new FBML applications can be created after that date.

While Facebook indicates that current Static FBML and FBML tab applications will continue to function for now, it strongly encourages everyone to move from FBML to using iFrame applications.

What is an iFrame application?

An iFrame application you allows you to embed an external Web page in your Facebook Page tab (in the new Page layout, "tabs" have been moved from the top of the page to the left column.).

The good news is that the iFramed Web page, because it isn't hosted on Facebook, can use standard HTML, CSS, and JavaScript like any other Web page does.
The downside of this approach is that you need to be familiar with those technologies and you will need a Web-accessible server where you upload the files for your application page.
First make your page
We Will make it using HTML then upload the HTML file to any free hosting site such as

zymic

After making a free account on the site you will need a free FTP client software like

filezillato upload your files

Here
is a tutorial from zymic how to configure filezilla and how to upload files.

Second go to facebook developer
The first step in creating an application in Facebok is to install the Facebook Developer application.

To do that, log in to Facebook and then visit the URL

Facebook Developer

If this is your first time installed the Developer Application, you will see the Request for Permission dialog and mobile Verfication so, after you verified your account by mobile follow the following instructions:

Creating your iFrame application

Now that you have the Developer App installed, click on the Set up New App button.

GO TO YOUR PAGE ENJOY!!!!!
And here is my HTML code of this page and i made it by notepad and saved as index.html

<html>

<head>
<h1><marquee behavior="scroll" direction="right">IFRAME TUTORIAL</marquee>
</h1>

</head>

<body>
<hr/>
<center> First make your page </center>
<center> We Will make it using HTML then uoload the HTML file to any free hosting site such as 
<a href="http://www.zymic.com/">zymic</a> 
After making a free account on the site you will need a free FTP client software like
<a href="http://filezilla-project.org/download.php?type=client">filezilla </a>to upload your files

<a href="http://zymic.com/knowledge-base/ftp.html">Here </a>is a tutorial from zymic how to configure filezilla and how to upload files. 
 <hr/>

Second go to facebook developer
<a href="http://www.facebook.com/developers/?ref=ts
">Facebook Developer</a> 
 After you verfied your account by moblile follow the following instructions: 
<img src="http://img850.imageshack.us/img850/3993/13862989.png" />
 <hr/>

<img src="http://img600.imageshack.us/img600/482/38935700.png" /> <hr/>
<img src="http://img189.imageshack.us/img189/3928/94356616.png" /> <hr/>
<img src="http://img64.imageshack.us/img64/2063/67968538.png" /> <hr/>
<img src="http://img857.imageshack.us/img857/7060/26404482.png" /> <hr/>
<img src="http://img844.imageshack.us/img844/4024/98447870.png" /> <hr/>
<img src="http://img189.imageshack.us/img189/3410/81200872.png" /> <hr/>
</center>
GO TO YOUR PAGE ENJOY!!!!!

Osama Ibrahim

iframe-tutorial

Pages

Tuesday, 26 April 2011

IFRAME TUTORIAL

About Me

Followers