To read part 2 then click this link "[a href="http://www.blogger.com/"]Design Welcome Page For your Facebook Fan Page[/a]"
This is part one of our tutorial series on "How to create a [a href="http://www.mybloggertricks.com/2011/07/create-design-custom-tabs-on-facebook.html" target="_blank"]Welcome WebPage[/a] on Facebook". To add branded look to your Fan Pages you need a custom tab so that you could then design the tab to blend your website theme. A tab is basically a link that will appear under the wall and info tabs. On clicking the tab your visitors or fans will be able to see the content inside that tab page. [a name='more'][/a]
Follow these easy steps,
1. Set Up New Facebook Tab App
Kindly Visit [a href="http://www.facebook.com/developers/apps.php" rel="nofollow" target="_blank"]Facebook Apps Page[/a] and then click the + Set Up New App button.
Set the App Name with either your website name or blog name. You can give any name you want and you can change it later too.
Click the the Create App button and enter some security code to proceed further.
2. Configure your Tab App Settings
In the About section, click the "Change you icon" link to upload a 16px by 16px Icon for your tab. My advise is that you upload your website logo like I have done,
Before you save your changes, click the Facebook Integration tab. On the Facebook Integration settings page fill up the blanks using the information below. Make sure you note down your Application ID as shown in the screenshot below,
Canvas Page - It is optional. Just write your blog name here.
In each process below, replace YOURAPPLICATIONID with your Application ID
Canvas URL - Enter http://YOURAPPLICATIONID.iframehost.com/
Secure Canvas URL - Enter https://YOURAPPLICATIONID.iframehost.com/
Tab URL - Enter http://YOURAPPLICATIONID.iframehost.com/tab
Secure Tab URL - Enter https://YOURAPPLICATIONID.iframehost.com/tab
IFrame Size - Choose Auto-resize
Click the Save Changes button. Congratulations you just created a tab successfully! Now just few more steps.
3. Add your Custom Tab App to your Fan/Like Page
Copy your API key and App Secret code and keep them safe in a notepad as we will be needing them later. Now click the Application Profile Page link.
Next click the Add to My Page link to install the page tab
Finally select the page you would like to install the tab on.
4. Visit Your Facebook Custom Tab Page
You will now find the custom tab appearing under the wall and info tabs. Click your Tab. When you visit the tab page for the first time, you will be asked to enter your API Key and APP Secret. Simply fill up the blanks with the App number codes you saved in a notepad.
5. You are now Ready To Design your Welcome Page!
After completing a normal formality, you will now see [a href="http://woobox.com/" target="_blank"]Woobox's[/a] beautiful WYSIWYG Editor just like your Blogger Editor, where you can create amazing designs using your imagination. This is the end of tutorial part -1. On my next tutorial I will be sharing how can you design the Welcome landing page with CSS, HTML and JavaScript. Make sure you don't miss any part by subscribing to our [a href="http://feedburner.google.com/fb/a/mailverify?uri=tntbystc" rel="nofollow" target="_blank"]free email updates[/a]. The fun is yet to begin! Peace out. :d
PS: Keep all settings default.
Source: http://www.mybloggertricks.com/2011/07/create-custom-facebook-tab-with-custom.html
0 comments :
Post a Comment