Publicado em

Como fazer um site para imobiliária (Real State)?

Há diversas soluções prontas para construir um site de imobiliária sobre o WordPress.

Avaliar as diferenças entre elas para criar uma escala com as melhores no alto da lista é uma tarefa complexa, mas é o que tentaremos fazer nesse artigo colocando em primeiro aquela solução que nos parece ser a mais flexível e completa.

Todas as soluções apresentadas suportam nosso idioma.

Por flexibilidade queremos dizer principalmente:

  • Busca avançada por vários critérios simultaneamente
  • Personalização das áreas do tema para permitir o destaque de informações

Por “completa” nos referimos basicamente a:

  • Permite várias imagens por propriedade
  • Integração com Google Maps
  • Suporta vários agentes imobiliários associados às propriedades
  • Integração com sistemas de pagamento online
  • Funciona bem em dispositivos móveis

Caso você discorde com algum critério ou tenha algum a acrescentar vamos gostar de ouvir sua opinião.

Antes é necessário explicar que há “frameworks” para WordPress desenvolvidos para atender a um conjunto de necessidades. Eles reúnem plugins e templates para permitir a modificação do comportamento do WordPress de formas mais radicais transformando-o praticamente em um outro tipo de CMS (sistema gerenciador de conteúdo, da sigla em inglês). Muitas pessoas não sabem que existem esses frameworks.

Primeiro lugar: WPCasa

Casa Nova: Clique na imagem para comprar o tema
Casa Nova: Clique na imagem para comprar o tema

É justamente um framework que decidimos colocar em primeiro lugar. Ele é base para três temas:

  • Ushuaia: Tema minimalista que parece adequado para uma imobiliária que dá foco a menos imóveis visto que a busca não fica muito evidente na tela inicial e sim algumas propriedades em destaque uma de cada vez.
  • Casanova: Esse tema apresenta claramente os campos de busca e algumas propriedades em destaque em colunas logo abaixo.
  • Penthouse: Tema também minimalista similar ao Ushuaia.

Custo em torno de 90 dólares.

Segundo lugar: Rent&Buy do Theme Forest

[youtube]Tf2fUuUPN0k[/youtube]

A maioria dos recursos mostrados nesse vídeo estão também em outros temas.

Por apenas um motivo esse tema não está em primeiro lugar: O primeiro foi citado como a melhor solução por alguns sites especializados e está fundado sobre um framework desenvolvido especificamente para sites de imobiliárias.

Um dos pontos críticos num site desse tipo, a busca por vários atributos, parece ser bem atendido por esse tema e permite até a criação de uma quantidade ilimitada de tipos de propriedade e busca por proximidade de áreas cadastradas.

É o único tema que vem com integração ao Paypal para pagamentos.

A opção por mostrar o mapa dos imóveis no fundo do site é interessante e o diferencia dos demais, mas pode não ser muito adequado a alguns modelos de empresa imobiliária.

Além disso o Theme Forest é um repositório respeitado de temas profissionais para WordPress.

Clique na imagem para comprar o tema
Clique na imagem para comprar o tema

Custo em torno de 45 dólares.

Terceiro lugar: AgentEvolution

O AgenteEvolution disponibiliza três temas que funcionam com outro framework mais genérico, o Genesis.

Tema Turn Key - clique na imagem para comprar
Tema Turn Key – clique na imagem para comprar

Conheço o framework e o uso no site do Congresso da Abrates. É mesmo muito poderoso, mas o WPCasa parece oferecer mais flexibilidade na construção da busca avançada.

Custo em torno de 50 dólares.

Observações

Existem dezenas de soluções prontas para imobiliárias somente para WordPress. É muito provável que hajam soluções melhores tanto para WordPress quanto para outos CMS sem falar em CMS específicos para esse fim.

Esperamos que esse artigo lhe forneçam bases para saber o que procurar nesse tipo de aplicativo.

Como não somos da área imobiliária agradeceremos qualquer comentário que nos ajude a definir novos critérios para escolher boas soluções para o mercado brasileiro.

Referências

Publicado em

Como colocar imagens no WordPress?

O WordPress é um sistema gerenciador de conteúdo que consegue ser extremamente poderoso e ainda assim muito fácil de usar, no entanto é normal que os novos usuários se sintam perdidos enquanto não entendem a sua interface, a forma de usá-lo. Por isso decidi fazer alguns artigos explicando algumas das atividades mais comuns.

Enviando fotos para o site

Normalmente as fotos que você quer publicar no seu post (artigo) ou page (página) estarão em seu computador. Para usá-las você terá que enviá-las para o seu site.

Primeiro entre na tela de edição de post ou page:

Imagem representando o editor de textos do WordPress
Editor de textos do WordPress

O botão para inserir imagens está acima da barra de ícones, logo à direita do texto Upload/Insert. Na imagem acima eu deixei o mouse sobre o ícone para fazer aparecer o texto de ajuda “Add an image” que você vê se sobrepondo à barra de ícones.

Ao clicar no botão a tela a seguir aparecerá sobre o post ou página sendo escrito. Essa tela é um centro de atividades de tudo que você pode fazer com imagens: enviar para o site, definir suas características, buscar imagens que já foram enviadas para o site, inserir imagens uma a uma ou em grupo.

Imagem da janela para seleção de imagem a enviar
Escolha a imagem

Ao clicar no botão “Select files” será aberto o programa do seu sistema operacional (Windows, MacOS, Linux) que permite navegar pelos arquivos do seu HD. Você pode selecionar várias fotos usando o botão CONTROL (Comand no Mac) ou o SHIFT.

Depois que você selecionar as fotos e clicar em Ok elas serão enviadas para o seu site. Observe enquanto o WordPress envia as fotos e faz o processo de “crushing” que consiste simplesmente em criar três versões das fotos em tamanhos diferentes. Geralmente é melhor usar o tamanho médio ou pequeno para que o artigo carregue rapidamente mesmo em celulares.

Quando o upload das fotos terminar a tela estará como essa:

Imagens do post

Essa, a propósito, é a imagem em tamanho médio. Clique nela para ver no tamanho original.

Clicando no link “Show” que aparece do lado direito você pode ver os detalhes da foto como:

  • Title: Importante. Ele é usado pelo Google para indexar suas fotos
  • Alternate Text: deve ter uma descrição para quem é cego. Esse texto é lido pelos programas especiais para eles.
  • Caption: é o texto que aparece sob a foto como o texto “Imagens do Post” sob a imagem acima
  • Description: Importante também para a indexação do Google e outros buscadores. É o texto que ele mostrará associado à foto

Os demais campos são para definir o alinhamento da foto ao ser inserida no post ou page e a versão (pequena, média ou full size) que deve ser usada. A tela abaixo mostra esses detalhes:

Captura de tela com os detalhes de uma imagem
Detalhes da imagem

As imagens que você acaba de enviar para o site são automaticamente associadas a esse post ou página que você está escrevendo e ficam sendo sua “Gallery” de imagens. Observe que na parte superior dessa janela que abriu quando clicamos em “Add an image” tem as opções “From Computer”, “From URL”, “Gallery” e “Media Library”. Basta clicar em “Gallery” para ver a tela abaixo:

Visualização da galeria de imagens de um post
Imagens do post

Note que essa tela lhe permite inserir todas as fotos da galeria com um único clique (o botão não está visível na imagem acima, mas fica logo abaixo de “Gallery columms”). Veja abaixo como ficam as imagens inseridas dessa forma:

E finalmente, podemos inserir imagens que já tenham sido enviadas para o site antes, basta ir na última opção dessa janela, “Media Library” A imagem está a seguir:

Imagem da listagem do banco de mídia do site
Banco de mídia

Você notará que nessa tela há a possibilidade de filtrar as fotos por data de envio ou por texto. Por isso é importante definir bem os detalhes (Title, caption etc.) ao enviar cada imagem para o site: para ficar mais fácil localizá-las para usar no futuro.

Caso você queira usar imagens da sua Media Library para fazer uma galeria como a que mostrei logo acima (com todas as imagens inseridas com um só clique) você terá que recorrer a um artifício:

  1. Insira as fotos que vai querer uma a uma: isso as fará passar a fazer parte da galeria de imagens desse post
  2. Apague todas as imagens do post. Elas continuarão fazendo parte da galeria dele
  3. Insira a galeria normalmente como mostrei mais acima.

Esse post está longe de esgotar todos os recursos com fotos disponíveis no WordPress, mas deve atender às necessidades de 90% dos casos.

Publicado em

Como fazer um site profissional com o WordPress 3

O WordPress (um dos melhores e mais usados sistemas para gerenciar sites) ganhou uma nova versão cheia de novidades na semana passada.

Como de costume criei uma videoaula (no final do post) tanto para apresentar os novos recurso quanto para mostrar a quem nunca fez uma página como é fácil criar um site profissional ou institucional em menos de 20 minutos usando um CMS como o WordPress.

Aproveito para compartilhar com vocês alguns insights:

  1. A maioria dos visitantes de um site não o conhecem e visitam a home para entender onde estão. Coloque lá um texto que diga rapidamente sua área de atuação
  2. Procure usar poucas categorias de artigos, mas pode abusar no uso de palavras chave
  3. A nuvem de palavras chave (tags) é um ótimo instrumento para o seu visitante entender com um lance de olhos quais são os assuntos do seu site
  4. Use o menu horizontal sob a imagem do cabeçalho para destacar artigos que você gostaria que a maioria dos visitantes vissem, mas não exagere na quantidade
  5. Coloque no rodapé os links para as redes sociais online que você usa para consolidar sua reputação como Videolog, Twitter, Delicious e Facebook

A videoaula:

Como fazer um site profissional com o WordPress 3 from i4B Exista na Internet on Vimeo.

Publicado em

Como criar um site institucional com o WordPress

Frequentemente me perguntam se é possível fazer “um site mesmo” e não apenas um blog usando o WordPress ou outro CMS.

Tenho notado que as pessoas consideram que “site mesmo” é um site estático feito em HTML com a estrutura padrão de cabeçalho com logo da empresa e um menu lateral com as páginas “Quem somos”, “Serviços”, “Missão”, “Contato” e outras.

É importante afirmar e reafirmar que os sites estáticos (que são documentos HTML ou Flash) devem ser a última opção visto que vivemos em plena era da web dinâmica e portanto usar um CMS (Content Management System – sistema gerenciador de conteúdo). Estou preparando outro post e uma video aula sobre isso.

Há uma infinidade de CMS especializados em vários tipos de sites: blogs, sites, portais, lojas, foruns, albuns de fotos, ensino à distância, genealogia e redes sociais somente para citar alguns.

O WordPress, apesar de ter nascido como um gerenciador de blogs, se desenvolveu velozmente até se tornar um excelente CMS genérico há alguns anos.

Uma instalação crua do WordPress terá a aparência de um blog, mas com pouquíssimo trabalho podemos modificá-lo para ser um site institucional.

A propósito, a título de demonstração, costumo mostrar o site do Twitcast que tem um dos mais complexos designs desenvolvidos em WordPress. O Twitcast é um podcast sobre Twitter e cibercultura. No site, além dos podcasts, você encontra uma sessão de destaques, outra com ferramentas para o Twitter e notícias e uma terceira com vídeos.

Na video aula abaixo me concentro nos ajustes necessários para tirar a aparência de blog do WordPress e aproveito para mostrar um pouco da interface da versão 2.7

Publicado em

Como criar um site profissional em HTML?

Introdução

Esse texto serve de apoio para uma video aula em duas partes que fiz sobre como fazer um site em html. Os vídeos estão no final do artigo.

Somente um bom designer especializado em webdesign pode fazer um site profissional e provavelmente ele não o fará em HTML uma vez que este tipo de site pertence aos tempos da Web 1.0 tornando-se ultrapassado a partir da segunda metade da década de 90.

Esse artigo é apenas uma introdução aos conceitos básicos de criação de sites e foi escrito principalmente por razões históricas e porque, apesar de vivermos na era da web dinâmica, muitos ainda encontram razões para fazer sites estáticos.

Estrutura do site

Seja o site dinâmico ou estático ele quase sempre terá um cabeçalho, um menu lateral e uma área central com o conteúdo. Alguns usam menus sob o cabeçalho ou até conjugam os dois menus. Nesse exemplo optei por uma estrutura mais conservadora.

No lado esquerdo do nosso exemplo temos o menu, na parte superior o cabeçalho e na área maior da direita teremos o conteúdo.

A idéia principal é mostrar como estruturar o site com divisões <div> e como criar um menu único para o site inteiro que não precisaria ser recriado a cada nova página que criássemos.

No vídeo não dá para ler o código do iframe. Aqui está ele:

<iframe src=”./menu.html”; widht =”85″ height=”150″></iframe>

Referências

O aplicativo que usei para editar as páginas foi o Kompozer por ser um produto de código aberto disponível gratuitamente para a maioria das plataformas.

Para informações sobre html, CSS e outros padrões Web consulte o Wide World Web Consortium: w3.org.

Sites comentados: http://goodlistening.com.br e http://supervideobrasil.com.br

Mantenho uma lista de webdesigners no Delicious.

Observações

Com a finalidade de simplificar a video aula e ir direto ao ponto eu não criei as páginas usando CSS que seria o mínimo necessário em um site realmente profissional feito em HTML (apesar de insistir que 99% dos sites profissionais modernos devem ser feitos usando um CMS como o WordPress)

A video aula

Parte 1:

Parte 2:

Publicado em

Como criar um site?

Este artigo procura descrever os passos básicos para registrar um domínio e criar algum conteúdo para ele

Caso você contrate ao menos seis meses de hospedagem conosco nós fazemos o registro do domínio em seu nome e instalamos o WordPress em seu site para que você possa administrá-lo sem precisar contratar um webdesinger. O artigo e video aula abaixo apresentam uma boa visão geral.
Para fazermos o registro em seu nome precisamos apenas de um email permanente (gmail, Yahoo!, IG ou mesmo Hotmail) e dos seguintes dados:
Dados Pessoais

  • Nome
  • Logradouro
  • Número
  • Complemento
  • Cidade
  • Estado
  • Telefone
  • CPF
  • Email (preferencialmente um permanente e não o do seu atual provedor de acesso)
  • Senha desejada

Dados para registro do domínio

  • CNPJ (CPF caso seja um site de profissional liberal ou de pessoa física)
  • Razão social
  • Responsável (nome)
  • Cep
  • Logradouro
  • Número
  • Complemento
  • Cidade
  • Estado
  • Telefone
Caso você não possa contar ainda com o nosso suporte espero que as instruções a seguir sejam o suficente para registrar o domínio e criar o site.

Como Registrar um domínio

O item mais importante de um site é a propriedade do domínio.

Quando você quer fazer um site como seusite.com.br o primeiro passo é obter o direito de usar este nome: seusite.com.br e garantir o controle sobre ele. Tendo garantido isso você poderá, por exemplo, mudar de hospedagem no momento que precisar e sem depender de ninguém.

Ser dono de um domínio é como ser dono de uma marca.

A propriedade dos domínios é obtida junto ao registro.br:

http://registro.br

Lá você pode verificar se o domínio que você tem em mente está livre e obter o direito de usá-lo em caso afirmativo. Isso custa somente R$30,00 anuais para sites brasileiros (.br).

Fiz uma video-aula (na verdade a primeira que fiz) intitulada Registro de domínio, tá ok? que pode ser útil para entender o processo todo.

Primeiro passo – Criar uma conta no Registro.br

  1. Entre em http://registro.com.br
  2. Clique em Registro para ver a tela de “login” (autenticação) no sistema
  3. Do lado direito há um grupo de links e um deles é Não Possui Identificação?. Clique nele.
  4. Informe seus dados de pessoa física: Nome, email, CEP etc. e escolha uma senha
O registro.br enviará uma mensagem de confirmação para o seu email com o seu nome de usuário no registro.br, algumas instruções e um “link” (ligação) em que você deve clicar para confirmar que foi você que fez o cadastro.

É fortemente aconselhável que você faça este cadastro usando um email permanente como os diversos gratuitos disponíveis como o Gmail e Yahoo pois, se no futuro você perder sua senha uma nova poderá ser enviada para o seu email.

Segundo passo – Criar o domínio

Já com seu nome e login no Registro.br em mãos você já pode obter domínios.

  1. Entre em http://registro.br e clique em Registro (desta vez você tem um id e senha para informar)
  2. Informe seu ID e senha para entrar na área de administração
  3. Há um grupo de links em cima à direita com opções como Alterar cadastro, fechar sessão e Novos Domínios
  4. Decida que tipo de site (.com.br, .nom.br, .org.br etc.) deseja criar consultando a Lista de Categorias de Domínios
  5. Escolha que tipo de domínio pretende criar clicando em Institucional, Profissional Liberal ou Pessoa Física
  6. Leia o contrato e clique em “Concordo”
  7. Preencha a tela com os dados solicitados
  8. Em Informações sobre os contatos digite ROB554 (caso pretenda hospedar seu site conosco) como contato Técnico e repita sua ID em contato de cobrança
  9. Deixe os campos DNS em branco (a menos que a sua hospedagem já tenha informado o que digitar neles)
Assim que você cumprir estas duas etapas eu receberei um email do Registro.br informando que fui cadastrado como contato técnico de um domínio recém criado e poderei proceder ao restante das etapas para colocar seu site no ar.

O registro.br também enviará um email com os dados para pagamento do registro anual do site para o contato administrador e para o contato de cobrança. Este pagamento deve ser feito em até 30 dias ou o site será congelado e posteriormente liberado para que outra pessoa possa registrá-lo.

Espero que esta explicação facilite a criação de um usuário no Registro.br e o registro do seu site.

Criando um site

É fortemente recomendável que você contrate um designer para criar a identidade visual do seu site, no entanto há casos em que o seu projeto talvez não justifique o investimento em um designer ainda nos primeiros passos. Meu blog pessoal por exemplo até hoje usa um modelo padrão.

Nestes casos, além do WordPress citado logo no início deste breve artigo você pode usar um editor html para fazer um site estático (embora eu recomende fortemente o uso de um CMS como o WordPress).

O WordPress é um CMS ou Sistema Gerenciador de Conteúdo (do Inglês Content Managemant System) e devo insistir que você use um CMS similar pois os sites estáticos simplesmente não atendem mais às necessidades básicas em uma Internet em constante evolução. Qualquer hospedeiro hoje deve suportar e oferecer ao menos a instalação do WordPress em seu site gratuitamente.

Em todo caso, se você tem motivos ou simplesmente prefere as coisas à moda antiga posso indicar outra video-aula que fiz explicando como usar um bom editor HTML, o Kompozer:

Procure se informar nos links citados nas descrições dos vídeos acima e, precisando de um bom designer, não hesite em me pedir ou consultar minha lista aqui: http://del.icio.us/Roney/designers