Dennis Altermann já escreveu 917 vezes aqui. É Fundador-Editor aqui no Midiatismo.com.br e trabalha na Magoweb como analista de marketing digital. Atualmente realiza estudos na área de publicidade mobile.

Veja todos os textos de Dennis Altermann →Conheça os autores do Midiatismo →

Layout / Design Tutorial

Algum tempo atrás trouxemos aqui no blog Midiatismo 7 dicas de aplicativos para você personalizar uma aba de Fan Page. Através dos comentários, pessoal levantou a dúvida de como fazer com que as abas tivessem ícone personalizado, então trouxemos o texto “Landing Page com ícone e nome personalizado“. Algum tempo depois, também através dos comentários, algumas pessoas lembraram que houve mudanças no painel do Facebook.

Para resolver esse problema trouxe aqui um rápido tutorial para criar aba com ícone personalizado, agora atualizado para o novo painel:

Criando a aplicação

• Acesse https://developers.facebook.com/apps;
• Clique em “Create New App” ou “Criar Novo Aplicativo“;
• Adicione um nome que será visualizado (não é tão importante neste caso, ex.: “Aba Perso Midiatismo“;
• Adicione nome de controle, que poderá ser alterado depois (Pode qualquer nome simples, mas apenas minúsculo, ex.: “abapersomidiatismo”);

Configurando a aplicação

• Na parte de cima, clique em “editar ícone” e escolha o arquivo (escolha algo já em formato quadrado, preferencialmente JPEG, GIF ou PNG);
• O ícone da aplicação pode ser alterado, mas não há necessidade (Ele é exibido na página da aplicação, que ninguém deve acessar);

• Preencha os dados exatamente como mostrado na imagem abaixo, usando estas informações: (Obs.: SEU_ID_DO_APP é o “App ID:” que está junto do local onde altera ícone )
• Canvas URL: http://<SEU_ID_DO_APP.iframehost.com/
• Secure Canvas URL: https://<SEU_ID_DO_APP.iframehost.com/
  
• Page Tab URL: http://<SEU_ID_DO_APP.iframehost.com/tab
  

Adicionando a aba a sua página

• Na parte esquerda do painel tem os “Related Links” ou “Links Relacionados” acesse “View App Profile Page” ou “Ver Página do App“;
• Já na nova página, no menu da esquerda, clique em “Add to my Page” ou “Adicionar a minha página“;
• Escolha a qual página adicionar e acesse a página;
• Clique na Aba criada;
• Com aba aberta, ela vai pedir o “App Secret“, que está junto do seu “App ID“;

Consegui resolver este problema e quero compartilhar com todos aqui.

Antes o facebook criava automaticamente uma página de perfil de app para todo aplicativo que fosse criado. Isto não está mais acontecendo e pelo que informaram até fevereiro de 2012 todas as páginas de aplicativos serão deletadas.

SOLUÇÃO: Para adicionar a ABA à sua página digite no browser: 
http://www.facebook.com/add.php?api_key=<seu_id_do_app>&pages

Pronto! Agora é so acessar a ABA criada e digitar o App secret.

:)</seu_id_do_app>