
Olá, amigos da MestreSEO!
Nossa coluna de Facebook vem colaborando bastante com o crescimento de todos dentro da rede social. Vejo isso pelo feedback que recebo regularmente, além do crescimento nos acessos em nossa categoria – fatos que me deixam bastante contente e animado para continuar a publicá-la.
Para tanto, procuro observar as novidades e trazer facilidades para que todos possam trabalhar melhor no Facebook, seja através de dicas ou de aplicativos que surgem constantemente. O post desta semana não foge à regra.
Já trouxemos aqui completas informações sobre as mudanças na Fan Page do Facebook, comentando as alterações de visual e funcionalidades. Depois, falamos sobre a depreciação do FBML para favorecer o uso de iFrames e, por fim, apresentamos uma solução bacana e fácil para a criação de abas personalizadas – o Pagemodo.
Falando especificamente de aplicativos para abas, a coluna de hoje traz mais uma inovação para vocês. Se antes usávamos o app Static FBML para a colocação dos códigos e criação de tabs, com a chegada do iFrame, desenvolvedores agiram rápido e lançaram o Static HTML, que traz uma interface ainda mais simples de se trabalhar, com uma opção interessante.
Se em nosso artigo de iFrame ensinamos uma maneira de se trabalhar, instalando praticamente um “aplicativo” para hospedar sua aba, com o Static HTML o trabalho é bem mais prático. Ao colocá-lo em uma fan page, uma aba é automaticamente postada na sua lista e, ao acessá-la, dois campos estarão disponíveis para a inserção dos códigos.

O legal deste app é que o segundo campo é destinado apenas ao conteúdo exclusivo aos fãs, ou seja, você pode criar duas peças idênticas, mas fazendo a primeira com um efeito que esconde a página ao fundo e com uma arte apontando para o botão Curtir. Só assim novos usuários poderão ver o conteúdo. Veja, por exemplo, a fan page da Red Bull:

Se desejar, crie páginas distintas, com conteúdos exclusivos em cada uma, deixando o campo de “non-fans” com um texto atrativo, convidando os usuários a curtirem a fan page.
O Static HTML não traz praticamente nenhuma restrição quanto ao uso de linguagens. CSS, Javascript e, claro, o HTML estão liberadas para uso. Portanto, abuse bastante de sua criatividade. A única exceção é que o Facebook não permite a colocação de conteúdos “auto-play”, ou seja, esqueça páginas que, ao carregadas, produzem um vídeo, toquem uma música ou executem qualquer ação sem o desejo do usuário.
Ao clicar em Save and View Tab, você ganha as opções de visualizar os dois conteúdos postados – para fãs e não-fãs. Se algo sair errado, basta clicar no “back to Editor” para refazer o trabalho.
Dúvidas e Novas Abas
Dentro do aplicativo, há uma barra superior em amarelo que abre um pequeno FAQ. Ali é possível tirar algumas dúvidas comuns para facilitar o trabalho. Também há um link de acesso para a instalação de mais Static HTMLs em sua fan page. De acordo com o aplicativo, você pode acrescentar até 12 abas em sua página.

Outro questionamento bastante comum é relacionado com a alteração do nome da aba, já que todas vêm com o “Welcome” como padrão. Para tanto, basta clicar no link abaixo do título da aba (“Editar informações”), ir para o campo de Aplicativos, encontrar o Static HTML e clicar em “Editar configurações”. Escolha o nome de sua preferência, salve e retorne para sua home.

Acima dos campos de códigos, existem duas opções: a primeira impossibilita o aparecimento da barra de rolagem. Portanto, para evitar o desconforto de ter uma página cortada ao ativar esta caixa (ou o aparecimento da barra de rolagem), marque a opção e produza um conteúdo com largura menor que 520 pixels. A título de curiosidade, as fan pages do Facebook têm tamanho padrão de 512px de largura e 782px de altura.
Já a segunda caixa permite a ativação dos códigos FBML. Se você já for íntimo da nova porém “depreciada” linguagem, marque o campo para codificar desta forma. Com a alteração, apenas um campo estará disponível para se trabalhar.
Experimente este simples aplicativo em alternativa a todo o processo de instalação de iFrame que já sugerimos. Acredito que você ganhará tempo e terá o trabalho bem mais facilitado, podendo até criar conteúdo exclusivo para quem é e não é fã de suas fan pages.
Um abraço e até a próxima.




Oi, Ique! Já fiz diversos testes com essa opção. Gosto muito de conteúdos exclusivos para fãs, embora às vezes possa soar um pouco como obrigação. Quanto ao aumento de likes, funciona muito. Só acho que o conteúdo deve ser interessante, já que é um espécie de “troca” pelo like. Já te falei isso, mas continue escrevendo, gosto muito dessa coluna
Abs!
[ Responder este comentário ]
É isso aí mesmo, Pri!
Valeu o feedback, sempre!
[ Responder este comentário ]
Simplesmente SENSACIONAL!
Só isso que tenho pra dizer.
Parabéns Ique! Parabéns MestreSEO!
(moro em Sorocaba-SP, mas nascido em Itajubá-MG! Estive aí neste final de semana vendo a familia).
Um abraco
[ Responder este comentário ]
Ique, com esse novo aplicativo quem não entende nada de programação não tem muito o que fazer, certo?
[ Responder este comentário ]
Esse app é uma coisa um pouco mais objetiva. Necessita sim de alguém que programe, um designer pra criar a ‘peça’ que vai ser colocada lá. Quem tem um time de apoio pode ser dar muito bem.
É um app simples, que evita transtornos e economiza tempo!
[ Responder este comentário ]
Comecei a usa-la e é fantástica o único problema que eu não consigo deixar está página criada como página de entrada, o que preciso configurar. Abraços.
[ Responder este comentário ]
Clique em Editar Página. Logo na primeira tela de opções, você verá ao centro a seguinte opção: “Aba Padrão de entrada da página” escolha a do Static HTML com o nome que você batizou e salve. Pronto!
Não se preocupe se você entrar novamente na sua fan page e ver o Mural em primeiro lugar. Como administrador, você sempre verá o mural. Peça pra um usuário de fora, que não seja admin de sua fan page, pra fazer o teste e confirmar a alteração.
[ Responder este comentário ]
Ique
Tenho algumas fâ pages que criei as que tenho um número maior de pessoas, aparece a aba, as que não tem ainda não aparece, fiz um teste numa que só tenho 19 pessoas e o resultado foi esse. Abraços.
[ Responder este comentário ]
Olá, estou adorando esse APP, mas fiquei na dúvida de como criar outras abas, e se é posivel mudar aquele icon da estrela para uma criada por mim..
abraços! =)
[ Responder este comentário ]
Olá, Ricardo
Infelizmente não é possível. Por sem um app feito por outra pessoa, o ícone já está determinado pelo seu criador. Se você tiver mais intimidade e conseguir criar uma aba, com iFrame, usando nosso outro artigo Tutorial, você terá essa opção de colocar um ícone próprio.
Abraço!
[ Responder este comentário ]
Gostei muito deste post e estou usando o Static HTML, e gostaria de saber como trocar o favicon? assim como a fan page da RED BULL fez.
[ Responder este comentário ]
voce diz o icone no menu de apps à esquerda?
[ Responder este comentário ]
Eu usei 3 iFrames diferentes e rankeei os assim:
1 – Static HTML (mais rápido)
2 – Static HTML for Pages (mediano)
3 – Advanced FBML (muito lerdo)
O 3 foi o primeiro que achei, tem muitas ferramentas, mas o que eu queria, que era uma imagem logo que abrisse a fanpage, não resolvia.
O 2 é praticamente igual ao 1, com a diferença da velocidade.
O Mestre SEO mais uma vez acerta na sugestão!
[ Responder este comentário ]
Caro mestre, sou novato na blogosfera e estou apanhando muito. Criei uma fan pra divulgar o blog no Face e segui seu tuto, mas uma coisa está me dando nos nervos! Coloquei dois botõezinhos na fan, para acessar o mural e o modo “wall paper”. Só uma bobagem estética, já que esses links estão na coluna à esquerda. Acessei as páginas por eles, copiei os endereços na barra de end. do navegador e linkei nos botões. Mas o link não vai, mestre! Aparece o logo do Facebook e só quando clicamos sobre o mesmo é que o Mural ou o Wall Paper aparecem. Ainda não divulguei a fan para os amigos pq não consegui resolver o problema. Dá uma força aí???
[ Responder este comentário ]
Você deve estar fazendo alguma linkagem errada na hora de ajustar o html.. Estranho estar dando esse erro
[ Responder este comentário ]
Jonnay, comigo aconteceu a mesma coisa. Tenta assim: pega a URL desta logo do Facebook que vc comentou e coloca no seu html (“Aparece o logo do Facebook e só quando clicamos sobre o mesmo é que o Mural ou o Wall Paper aparecem.”). Aqui deu certo.
Ique, obrigada pelo post! Salvou aqui.
[ Responder este comentário ]
Fiz a linkagem dessa forma, mestre:
O efeito que muda a img do botão sob o mouse tá ok. Mas os links não funcionam como deveriam. A coluna central (área onde apareceria o mural) fica em braco com um pequeno logo do face no canto superior esquerdo e só quando clicamos nesse logo é que acessamos a “área” que o link deveria ter aberto. Abaixo desse logo está escrito “acesse o facebook” ou algo parecido. Testei com um link simples (TEXTO) e, mesmo acessando a page com outro profile, o resultado foi o mesmo!
[ Responder este comentário ]
Mestre, vamos ver se vc me ajuda!
Preciso criar um concurso cultural…na verdade já está criado!
E quero usar o facebook como meio para participação.
Meu modelo é: Postar frases.
Uma pergunta: Devo criar uma aba pra isso? Ou a galera pode participar pelo mural mesmo?
Gostaria muito de um help!
Grande Abraço
Filipe
[ Responder este comentário ]
Acho que você pode criar uma aba anunciando o concurso, pedindo pro pessoal comentar e participar
[ Responder este comentário ]
Bacana!
Vou criar uma aba para o concurso.
Minha dúvida é: Como consigo deixar essa aba aberta para comentários? Fiz várias tentativas mas não consegui.
Abraço
Filipe
[ Responder este comentário ]
No caso de uma aba personalizada aberta que você queira comentários, acredito que a possibilidade é configurar o plugin social dos coments do Facebook dentro da estrutura html da página que você está criando para jogar dentro do Facebook. Assim dará mais certo!
[ Responder este comentário ]
Olá. Você podem dar alguns exemplos atuais de páginas que usam esse recurso de trancar o conteúdo para fãs?
Acabei de ver essa do Red Bull e mesmo sem curtir, consegui visualizar os posts no mural.
Obrigada.
[ Responder este comentário ]
Ique Muniz, cara realmente muito bom o post… Tem alguns dias que procurava esse artigo em português na internet. Porém vou ser bem sincero, sou um pouco leigo em programação mas fiz meu HTML certinho, hospedei no meu site tá OK…
Mas quando jogo o código no Static HTML do facebook, não funciona.
Pode me ajudar?? Qualquer coisa te passo o código fonte!
Grande abraço e parabéns pelos artigos publicados!
Luciano
[ Responder este comentário ]
Opa… consegui aqui irmão!!
GRANDE ABRAÇO
[ Responder este comentário ]
Olá…quero ter este aplicativo na facepage da empresa que trabalho, porém não consigo adicionar o aplicativo , o facebook não permite..podem me ajudar?
[ Responder este comentário ]
Mesmo indo direto na página do aplicativo, você não encontra o icone la embaixo, à esquerda, “adicionar a minha pagina” ?
[ Responder este comentário ]
Pra mim não está aparecendo o “Adicionar o aplicativo” que estou encontrando em todos os Tutoriais.
Alguém sabe me dizer o motivo?
Já tentei fazer o procedimento utilizando a fan page e o meu próprio perfil e nada…
Abraços
[ Responder este comentário ]
Bom dia, gostaria de uma ajuda!
Estou usando o Estatic HTML e achei muito simples e muito prático, só que não consigo deixar a página criada como página de entrada, não aparece para mim a “Aba Padrão de entrada da página”…como posso resolver isso ou será que estou fazendo algo errado?
[ Responder este comentário ]
Felipe, para fazer isso é bem simples.
Clique em EDITAR PÁGINA >> GERENCIAR PERMISSÕES >> GUIA DE DESTINO PADRÃO
Escolha a guia que deseja que seja a principal de sua página, PRONTO!
em seguida, basta clicar em SALVAR ALTERAÇÕES abaixo.
Espero ter ajudado!
[ Responder este comentário ]
Olá Ique! Coloquei a Guia de destino padrão como o Static FBML, salvei e nada aconteceu.
Acesse a Fan Page de outro perfil e nada. O que pode estar havendo?
[ Responder este comentário ]
Você colocou a Static FBML ou HTML? As vezes pode ter feito uma confusão;…
Bom dia Luciano, tentei fazer mas o problema é que está “guia de destino padrão” não aparece na área “Gerenciar Permissões”, você saberia o porq?
[ Responder este comentário ]
Você precisa fazer uma alteração de categoria. Já aconteceu com outros leitores aqui. Vou recuperar o que uma das pessoas fez para resolver e te encaminho
[ Responder este comentário ]
Ola Ique,
se voce tiver a solução de como fazer aparecer a “guia de destino padrao” por favor me envie tambem, ja tentei varias maneiras e não consegui nada.
aguardo sua ajuda.
abs
Obrigado.
[ Responder este comentário ]
Ique, Boa tarde…
Realmente ainda não consegui uma solução, a aba “guia de destino padrão” ainda não aparece! Vc poderia me encaminhar a solução de algum leitor para esse problema??
Abs
[ Responder este comentário ]
Olá pessoal,
Passei o dia de ontem em contato com uma amiga que ajudei com esse problema e havia esquecido exatamente o procedimento que passei a ela. Depois de uma busca aqui, lembrei de algumas coisas que encontrei pelo caminho (foi realmente difícil encontrar esse problema).
É o seguinte, olhem a categoria da fan page de vocês. Vocês colocaram o que? No caso dela, era um blog e, não sabemos o motivo, acabou sumindo a opção lá dentro do Editar para escolher uma aba padrão.
Um dos artigos que li pedia para preencher um formulário de mudança de categoria para outra que possa aparecer a função. Entrem aí e testem. Ela também diz ter preenchido um formulario de ajuda geral do Face e algum dos dois acabou resolvendo o problema
http://www.facebook.com/help/contact.php?show_form=page_category_change
Conseguiram resolver?
[ Responder este comentário ]
Olá consegui ajustar minha fan page com suas dicas, mas gostaria de um help para alterar o favicon das abas criadas.
Obrigado.
[ Responder este comentário ]
Neste caso, Diego, não é possível alterar o favicon por conta de ser um aplicativo já pronto. Ele tem seu próprio ícone. Para que tenha um app ou página customizada com seu ícone, uma das dicas é fazer na mão através do artigo Tutorial de Iframe!
[ Responder este comentário ]
Muito Obrigado Ique!
Se der tempo, me diz uma coisa, qual é a estrutura html basica que podemos começar a criar o layout?
Estou inserindo hmtl e css e não aparece nada,
Antes de tudo, mais uma vez obrigado, isso ajudou muito já,
Abração!
[ Responder este comentário ]
Velhão já consegui resolver minha questão!!!
Mesmo assim, muito obrigado por compartilhar o conhecimento
[ Responder este comentário ]
Sério, consegui inserir os códigos no Estatic HTML, mas não consigo fazer com que esse página seja a inicial da fan page: http://www.facebook.com/pages/i9-Foto/129033333848873, já a marquei na Guia de Destino Padrão e nada, alguém me ajuda?
[ Responder este comentário ]
Deu certo, Deborah!
Eu acabei de acessar aqui.
O que acontece é que como administradora, você não vê que a mudança deu certo. O admin sempre vai ver o Mural assim que acessa à fan page. Caso tenha alguma dúvida quanto a isso, peça para algum amigo acessar a página (alguém que não seja administrador).
[ Responder este comentário ]
Rapaz, você não tem ideia como tem gente correndo atras disso, é muito fácil de usar!!!
Eu precisava colocar minha agenda a publico, mas o app de agenda do Google está com problemas, isso foi minha salvação!
Mto obrigado!! =DDD
[ Responder este comentário ]
Olá Ique,
ótimo texto. Resolveu meu problema!
Só que estou com outro bem estranho. Quando entro na opção para editar minha página e vou na guia dos apps não aparece nada. Você tem ideia do que esta acontecendo? Seria porque tenho que ter um mínimo de seguidores, como acontece para mudar a URL da página?
Obrigado. Abraço!
[ Responder este comentário ]
esta questão tem complicado muita gente. Estou caçando uma solução firme para escrever um artigo
[ Responder este comentário ]
Olá!
Quero usar uma aplicação na página de facebok de uma empresa. Essa aplicação consiste em ao clicar abrir o site da empresa. Não percebo de HTML e por isso não sei o que colocar nesses campos.
Agradeço a resposta.
Obrigada
[ Responder este comentário ]
entendo sua situação, Cláudia. É difícil dominar estas coisas quando não se tem o entendimento do HTML. Mas é preciso mesmo buscar o código da sua página e replicá-lo no programa Static, como este artigo mostra. Qualquer coisa, tente achar um amigo que entenda da área pra te ajudar
[ Responder este comentário ]
Obrigada! Já agora será que me pode tirar outra dúvida? Nessa mesma página de empresa, usei um aplicativo em que coloquei uma imagem para não-fãs a incentivar pra colocarem um “gosto”, contudo eu quero que para esses mesmos não-fãs nao tenham acesso ao conteudo da pagina (fotos, mural etc), de modo a obter mais “gostos”…
[ Responder este comentário ]
É só você usar o campo não-fã desta aplicação como mostra a imagem do artigo. Aqueles que não são fãs não veram o conteúdo desde que você crie uma imagem que bloqueie o conteúdo (pode ser uma imagem em branco com uma mensagem chamativa pedindo pra curtir o conteúdo)… Assim eles não verão nada até clicarem primeiro no Curtir!
Grande Ique,
Estou com um problema. Talvez você possa me ajudar (não encontrei a solução no Fórum do Face).
Criamos uma aba promocional na Fan Page da minha empresa com uma vitrine de produtos utilizando o aplicativo que você indicou.
No primeiro dia, funcionou legal. Porém, no segundo dia, ao clicar nessa aba, o Facebook indicou o seguinte erro:
“Bad Parameter: there was an errer understanding the request.”
Minha primeira dúvida foi quanto ao height, que está com 1472 (tirando a parte do plugin comments do facebook que vem em seguida).
Porém, verifiquei que a página do Groupon Brasil está com o mesmo erro, e tem o height menor:
http://www.facebook.com/groupon.br
Pode ser que eles estejam com um problema diferente que está gerando o erro, não sei.
Alguém tem alguma ideia?
Abraços
[ Responder este comentário ]
Gente, muito bom o artigo, muito bom o site todo. Parabéns!
[ Responder este comentário ]
Eu fiz a fan page criando um app como vc ensinaram aqui fazendo o iframe mas qnd fiz não aparecia a opção curtir e não tinha tem a opção de fãs e não fãs. Aí fiz pelo static html mas não posso personalizar o icone. Tem alguma solução de eu faça criando app e consiga fazer paginas de fãs e não fãs?
[ Responder este comentário ]
Estou com o problema de a Guia de Destino padrão não está inclusa nas minhas configurações.
A fan page que administro tem uma média de mais de 800 visitações diárias a mais de 5 meses e eu só tenho 3.000 curtições. Se o Banner de apresentação estivesse aparecendo como boas vindas… esse índice de curtições iria aumentar… mas não tenho a opção.
Ajuda meste!
[ Responder este comentário ]
Otimo artigo parabens
[ Responder este comentário ]
Estou com o seguinte problema:
fiz uma pagina em HTML com Dreamweaver onde coloquei uma imagem e dados de links do meu curso, logo subi ela a meu site, depois abri ela com o dreamweaver e copiei o código ao static html e coloquei na pagina de inicio do Facebook, o problema é que não aparece a imagem, abrindo o HTML por meu sitio abre completa, mas no Facebook aparece o espaço da imagem com uma X .
Anteriormente fiz outro processo, criei uma imagem de apresentação e a subi ao site http://imageshack.us/ logo copiei o código html e botei pelo static html, bem ai funcionou só que ao entrar com outra conta não mostra a imagem ate que não libere o aviso de segurança: “aviso de segurança deseja exibir apenas o conteúdo oferecido de forma segura por esta página da web” ai fiquei pensando que as pessoas que entrarem não iam querer exibir uma página que não é segura.
Por favor, como resolver esta situação, o que estou fazendo de errado?
Muito obrigado.
Walter
[ Responder este comentário ]
Parabéns pelo artigo, fazia meses que eu estava tentando descobrir como fazer para ter um conteúdo exclusivo para fãs.
Me ajudou muito.
Abraço, Edson Silva
[ Responder este comentário ]
Ique, meus parabéns pelo apoio,o artigo está perfeito e me ajudou bastante, porém na fase final mostra um “X” de erro, como se ñ estivesse completado download. O que fazer para visualizar a imagem de boas vindas?
Desde já, muito Obrigado e novamente Parabéns!
[ Responder este comentário ]
Excelente artigo amigo, so que estou com um problema, no inicio estava tudo certo, porem de um momento para outro a página “fans” passou a nao aparecer e sim o mural depois que os visitantes clicavam em curtir, pode me dizer o que estaria acontecendo?
Cheguei a pensar em “bloqueio” do facebook devido ao texto ou à uma seta gift que uso.
Ja tentei de tudo se tiver uma solução ficaria muito grato.
Obrigado
[ Responder este comentário ]
Bom dia,
eu já utilizei o app, só que estou cm uma dúvida, consigo colocar apenas ele normalmente, porém apenas um, gostaria de saber se você saber como colocar mais de uma aba desse aplicativo.
desde já muiiito obrigado.
Otimo post
[ Responder este comentário ]
Poxa, muito bom artigo bem completo… e me ajudou e muito!
Obrigado.
[ Responder este comentário ]
Bom dia, estou com uma dúvida que está me intrigando.
Fiz a minha fan page com Static HTML https://www.facebook.com/Vipstyleclub?sk=app_139229522811253 mas ficam aparecendo umas linhas brancas nas imagens onde fiz os links.
Oque poda ser?
[]´s
[ Responder este comentário ]
Olá Mestre Seo!
Sei que seu post, está aqui algum tempo mas estou com uma duvida, que ainda não vi nada explicando.
Estou com um problema, estou usando o static html e criei um link para abrir um outro aplicativo, porem não consigo que abra na mesma janela, só consigo se programar para abrir em uma nova janela.
Um app não chama outro dentro do facebook. Por favor qualquer ajuda é bem vinda.
Diniz
[ Responder este comentário ]
Olá na minha pagina em aplicativos naum aparece a opção do aplicativo Static HTML, como eu faço, alguem pode me ajudar.
[ Responder este comentário ]
Olá! Adorei o artigo, me ajudou muito, mas alguma coisa não está dando certo: Fiz uma página para os não fãs e outra para os fãs… mas na página dos fãs, o código da página dos não fãs também foi inserida, deixando o conteúdo dos fãs visível fazendo a rolagem da página (fica a página dos não-fãs acima e a de fãs abaixo). Como faço para que o código da página não-fãs não seje inserido na página fãs?
Obrigado pela atenção!
[ Responder este comentário ]
como posso colocar a aba q criei em aba padrão para q possa assim q o usuário entre na minha fan page ele veja a minha aba ?
[ Responder este comentário ]
Sim Marcelo, faça o seguinte, click em “Editar Página”, assim que clicar, encontre na página “Guia de destino padrão:” e selecione a aba criada.
[ Responder este comentário ]
Pra mim não está aparecendo o “Adicionar o aplicativo” que estou encontrando em todos os Tutoriais.
Alguém sabe me dizer o motivo?
Já tentei fazer o procedimento utilizando a fan page e o meu próprio perfil e nada…
Abraços
[ Responder este comentário ]
acho q ta com problema pois nao aparece para eu instalar
[ Responder este comentário ]
Estou com problemas na largura, pois tem uma div (#contentArea) que esta setada com 520px de largura e isso faz com que o conteudo fique quebrando para baixo. O problema que que eu não tenho como diminui-la pois ela envolve o aplicativo:(((( quando diminuo pra 515px no firebug ela fica no lugar certo. Alguma dica? isso já aconteceu com alguém?
[ Responder este comentário ]