Блог на KKeliov seo, уеб дизайн, маркетинг, пътуване

Новият Facebook таб

Или как да добавите Iframe към Вашата Facebook страница

Както предполагам вече  всички сте забелязали бе променен начина, по който изглежда една Facebook фен-страница. Промените започнаха да навлизат бавно в началото на март, и от 11 март промените бяха наложени за абсолютно всички фен-страници. С тези промени бе променен и начина на добавяне на нов таб към страниците. От тази дата – 11 март приложенията на базата на статичен FBML вече не са достъпни и не могат да се добавят към Facebook страниците, но за сега изградените табове на негова база все още ще функционират. Все пак препопоръчвам на всички използващи FBML да преминат към използването на новият начин на изграждане на табове чрез iFrame приложения.

Първо е добре да си отговорим на въпроса „Какво представляват iFrame приложенията?“.  IFrame приложенията ви позволяват да използвате външни уеб страници като табове за Facebook страниците ви. При новият изглед на страниците табовете са преместени отляво, както се случи и с основното меню.

Добрите новини са, че тъй като страницата използваща iFrame не използва сървърите на Facebook, при нея могат да се използват HTML, CSS  и JavaScript. Изискването в случая е да разполагате със сървър, на който да качите вашата страница.

Няма да изпадам в обяснения за това как да направите папка на Вашия сървър, в която да качите вашата страница за използване в Iframe, с идеята че това е позната материя.

Важно е да се знае, че широчината на главния DIV, в който ще бъде поместено цялото съдържание трябва да бъде 520px.

А сега да пристъпим към инсталирането на приложението на Facebook за разработчици (Facebook Developer)

Първата стъпка при създаване на приложение за Facebook е инсталирането на приложението на Facebook за разработчици (Facebook Developer). За да го направите, трябва да сте се влезли във Facebook и да посетите следният линк: http://facebook.com/developers .

Ако за първи път инсталирате приложението за разработчици, първо ще трябва да разрешите достъпа, както е показано на снимката по-долу.

Инсталиране на приложението за разработчици

След като го направите е време да пристъпите към създаването на iFrame приложение. Това става като на натиснете бутона „Set up New App“, разположен горе вдясно.

Set Up New App

След това трябва да дадете име на приложението, прочитате (или не) правилата за ползване, маркирате „Съгласен“ и натискате „Създаване на приложение“.

Създаване на приложение

Въвеждате фразата за сигурност и избирате „Изпрати“.

Фраза за сигурност

Преминавайки през тази стъпка идва ред на същинските настройки на приложението. В началото трябва да му зададете име и описание. Това име ще появи във вашия списък с приложения в страницата за разработчици.

Иконите също са доста важни, особено малката, която ще се покаже в лявата колона при менюто на страницата ви. Ако не създадете ваша, ще трябва да използвате тази по подразбиране.

Основни настройки

Важно: Натискате бутона „Запази промени“ след като минете през всички стъпки по настройката на приложението.

Тук можете да настройвате още езика, имейл за контакти, нови администратори за приложението и т.н.

И сега вече идва ред на важната част от инсталирането на iFrame приложение.

За да започнете, изберете „Facebook Integration“ от менюто. В секцията „URL на изгледа“ въведете адреса, на който се намират вашите файлове.

• „Име на раздела“ е името, което ще се покаже в менюто, в лявата част на вашата фен-страница. Може да бъде с дължина до 16 знака.
• Като „Page tab type“ избирате “ iFrame“.
• „Tab URL“ е пълния път, включително и името на файла, който се зарежда при отваряне на таба във фен страницата. Обикновено завършва на index.html, index.php.

Важно: Добре е преди да добавите адреса, да го отворете директно чрез браузъра ви. Ако линка е неправилен, очевидно е че Iframe приложението няма да заработи.

• „Secure Tab URL“ е пълния път, включително и името на файла, който се зарежда при отваряне на таба във фен страницата, в случай че посетителите ползват сигурна връзка (https://facebook.com). Обикновено завършва на index.html, index.php, а трябва да започне с https://. В случай, че вашия сървър не използва SSL сертификат, оставете това поле празно.

Важно: Ако не попълните полето за сигурна връзка, посетителите използващи такава няма да могат да посетят вашия таб. Той няма да бъде видим за тях и при тях ще се зареди Стената, вместо избрания от вас таб.

Сега вече можете да натиснете „Запази промените“

Инсталиране на вашето iFrame приложение във фен-страницата ви.

След като вече сте създадели вашето приложение, остава само да го добавите към фен-страницата ви. За да го направите трябва да отворите „Профилна страница на приложението“ в дясната част на менюто за вашето приложение.

Профилна страница на приложението

Изберете „Добави към страницата ми“  отляво. Ще се появи прозорец, който ще зареди всички страници, на които сте администратор.

Избор на страница

Изберете страницата, към която искате да добавите приложението и натиснете „Добави към страница“

Новото иFrame приложение вече трябва да е станало част от фен страницата ви. Ако все пак не го виждате, трябва да промените настройките на фен-страницата. От вашата фен-страница изберете „Настройки на страницата“. След това изберете „Приложения“ и намерете приложението, което добавихте. Натиснете на „Редактиране на настройките“ точно до приложението и  след това натиснете „Добави линка“.

Възможни грешки

Съобщение за грешка от вашия сървър (404, 405 или подобна)

Ако вашия сървър връща грешка при опит на Facebook  да зареди страницата във iFrame, може би трябва да преименовате разширението на зареждания файл от .html в .php или .aspx (в зависимост от платформата на сървъра ви). Тъй като при зареждане на iFrame от Facebook се използва функцията POST към index страницата се получава така, че някои сървъри са настроени да не разрешават тази фунцкция за .html файлове.

Поява на скрол

Ако при зареждане на съдържанието в iFrame се появи хоризонтален скрол, явно широчината на зарежданото съдържание е повече от 520px, която е максималната широчина за Facebook.

Препоръчвам добавянето на CSS за премахване на margin, padding и border от елементите. Някой браузъри добавят празни пространства около някои елементи по подразбиране и това може да повлияе върху появата на скролове.

В случай, че искате новосъдаденият таб да посреща Вашите посетители трябва да отидете на „Редактиране на страница>>Определете достъпа“ и от менюто „Първоначален раздел“ избирате новосъздадения от Вас таб.

В случай, че имате някакви въпроси или проблеми свързани със създаването на новите Facebook табове използващи iFrame, можете да ги задавате в коментарите под публикацията!

Благодаря Ви!

Ако статията ви допада, споделете я в Twitter или Facebook.