No post da semana anterior – Qual o conteúdo ideal para uma Fan Page no Facebook? – falei sobre o conteúdo ideal para ser apresentado numa fan page e uma visão geral sobre os recursos que o Facebook oferece para personalização e aplicativos disponíveis na rede.

• Siga a midiaria.com no Twitter e no Facebook!

A partir de hoje, farei alguns posts sobre dicas práticas de como criar um conteúdo personalizado, começando pela criação de abas.

A seguir, passo-a-passo de como instalar e configurar o Static HTML for Pages.

1. Criando o conteúdo externo que será exibido na aba

Primeiramente é necessário criar o conteúdo externo que será exibido na aba personalizada, em formato HTML. Isso pode ser feito utilizando um editor de HTML ou um software para desenvolvimento de páginas web como o Dreamweaver, da Adobe.

O formato ideal da largura para caber na área de exibição do Facebook sem barras de rolagem horizontal é de 485 px de largura e o formato para altura é ilimitado. Esse arquivo pode conter textos, imagens, vídeos, links para outras páginas, formulários e animações em Flash. Após finalizado, o conteúdo deve ser hospedado num servidor para acesso online, como se fosse um hot site.

2. Instalando e configurando o aplicativo Static HTML for Pages no Facebook

Para instalar o aplicativo Static HTML for Pages é necessário fazer o login na conta do Facebook onde foi criada a fan page.

No link a seguir é possível fazer o download do aplicativo:

https://www.facebook.com/add.php?api_key=49e15364cf25d6601b427ca8e38d187b&pages

Ao acessar o link, a janela a seguir é exibida, perguntando se deseja adicionar o aplicativo a página; clique no botão Adicionar Static HTML for Pages.

3 – Solicitação de permissão

Ao clicar em Adicionar Static HTML for Pages o aplicativo irá solicitar permissão para acessar informações, clicar em Permitir para continuar.

4 – Cadastro

Preencher os dados de cadastro com nome da empresa e telefone. Ler e aceitar os termos de serviço e clicar em Save Changes.

5 –  Como acessar o aplicativo

O aplicativo pode ser acessado com o comando Editar Página > Aplicativos

6 – Personalizar o nome da aba

Para personalizar o nome da aba, acessar o comando Editar configurações. Uma caixa de diálogo é exibida em Custom Tab Name. Digitar o nome desejado, clicar em Salvar e depois no botão OK.

7-  Aplicando o conteúdo na aba personalizada

A nova aba estará disponível no menu a esquerda e para aplicar o conteúdo personalizado, clicar sobre a aba e a janela de acesso ao aplicativo será exibida. Clicar no botão Edit Tab Settings para acessar a janela de edição do código HTML.

Marcar a opção Custom HTML e na janela HTML to Display. Colar o código HTML da página que foi desenvolvida no Passo 1.

8-  Resultado

Teremos uma aba na fan page que exibe um conteúdo externo. É possível criar mais de uma aba repetindo os passos aqui descritos, construindo um menu personalizado.

Leia também: Cuide de quem te “curte”