Categorias
CSS HTML Programação

Usar a Google Font API na construção de sites

O Google lançou em 2010 a Google Font API e o Google Font Directory para darem suporte às fontes na construção de websites. Apartir dessa data passamos a poder escolher uma fonte dentre das que estão disponíveis no diretório e colocá-la no HTML/CSS do website, e ela funcionará na maioria dos navegadores (browsers). Assim passou a ser possível o uso de fontes em qualquer página web independentemente do navegador que é usado. Veja algumas vantagens: Economia de Banda; Fácil de usar; Suporte para estilos; Não é necessária a conversão para o formato suportado pelo IE; Fontes Open Source Neste artigo vamos ver como usar a Google Font API. É bem simples, para fazermos um teste vamos criar uma pagina HTML… Continuar a ler

Categorias
Programação SEO

Bounce rate: entenda e redusa a taxa de rejeição do seu site ou blog

Se você usa o Google Analytics, já deve ter notado a métrica de Bounce Rate (taxa de rejeição) do seu site. E que normalmente ela é alta. A primeira coisa a entender é medida esta métrica. Mas o que é esta taxa de rejeição do site? Para o Google Analytics uma rejeição é quando um visitante entra em uma página do seu site e não importando a origem, permanece na página e sai sem clicar em nada. Esta é a métrica. Por default, todas as ferramentas de web analytics trabalham com o Bounce Rate por página – ou seja, o visitante entrou no site através de uma página (entry page ou landing page, em caso de campanha) e saiu sem… Continuar a ler

Categorias
Programação Wordpress

WordPress: redirecionar a página de erro 404 para a Homepage

A página de erro 404 faz parte de qualquer site ou blog. Um erro 404 é um código de status HTTP e ocorre quando a página solicitada não foi localizada, ou seja, quando um utilizador procura uma página, seja escrevendo diretamente no navegador ou clicando em um link e essa página solicitada não existe. Este artigo pode ficar a saber mais um pouco deste tão conhecido erro. Se usa o WordPress pode personalizar a página 404 de varias maneiras. Pode usar um plugin, como o «plugin AskApache Google 404» ou editar o arquivo «404.php» do tema em uso e assim personalizar sua página de erro. Embora não recomendado, são muitos aqueles que não personalizam a pagina, simplesmente redirecionam a ‘página… Continuar a ler

Categorias
Programação Wordpress

Carregar o Contact Form 7 apenas na página de contato

Se você usa o plugin ‘Contact Form 7’ para gerar formulários de contato já deve ter notado que este plugin adiciona arquivos CSS e Javascript de todas as páginas do site mesmo que não sejam usados. Usando o arquivo functions.php do seu tema você pode adicionar algumas linhas de código para especificar quando carregar arquivos de seu plugin. A maneira de fazer isso vai depender se você sabe quais as páginas que usam o plugin ou se apenas sabe as páginas que não vai usá-lo. Passo 1: Achar o ID do Contact Form 7 Primeiro você precisa saber qual o nome que o plugin usa como seu ID. Por exemplo, o ID do plugin ‘Contact Form 7‘ é «contato-form-7». A… Continuar a ler

Categorias
Programação Wordpress

WordPress: paginação WordPress fácil, sem plugins

O Uso de certos Plugins é extremamente essencial para o sucesso de um blog WordPress, mas quantos menos plugins usarmos melhor, menos vulnerável fica o nosso site e não corremos o risco de ficarmos com ele lento. Primeiro por que o Google pune sites lentos; segundo por que o público não espera por uma pagina que demora para abrir. Por esses motivos e mais alguns, é importante estudar e conhecer o core do WordPress cada vez mais e, assim, evitar plugins que fazem mais do mesmo. Sempre que possível, devemos dar preferência às funções nativas. No desenvolvimento de temas para o WordPress, temos que obrigatoriamente pensar no uso de algumas funções nativas do WordPress, como next_post_link(), previous_post_link(), posts_nav_link() e paginate_links()…. Continuar a ler

Categorias
Programação Wordpress

WordPress: como ativar a aba Links na versão 3.5

Por padrão, a seção de Links foi desativada em novas instalações que utilizem o WordPress 3.5 porque grande parte da comunidade já havia deixado de utilizar lista de links por seus sites ou blogs. Entretanto, muitos usuários que gostariam de utilizar tal funcionalidade sentiram-se prejudicados com tal remoção, e muitos deles estão sem saber o que fazer para o referido item volte ao menu. Porém esta opção pode ser reativada caso você precise utilizá-la. Se esta incluído nesse lote de usuários, então tem aqui a solução, para adicionar novamente a aba Links no WordPress 3.5, vai conhecer duas formas de ativar esta aba em seus sites ou blogs. A primeira, consiste em adicionar a função abaixo no arquivo functions.php de… Continuar a ler

Categorias
Programação Wordpress

WordPress: exibir artigos relacionados por categoria

Todos sabemos que atualmente o WordPress é o CMS mais flexível do mercado, o que permite que se utilize o mesmo para praticamente qualquer tipo de aplicação web. Por vezes quando desenvolvemos um novo projeto precisamos de algumas funções específica dentro do WordPress, normalmente basta instalar um plugin e ativá-lo, que você terá à sua disposição novas funcionalidades. Mas se recorresse-mos as nossas próprias funções? Assim sendo, temos por vezes uma tarefa que não é difícil de conseguir, depois de um pouco de pesquisa, testes e alguns ajustes. Conseguimos uns «Code Snippets», ou numa tradução livre será algo como «retalhos de código», que são pedaços de código pré-fabricados e parametrizáveis que podemos inserir em nosso WordPress. É um recurso muito… Continuar a ler

Categorias
CSS Tutoriais

Como esticar imagem de fundo com CSS

Há algumas plugins jQuery que ajudam a esticar imagem de fundo no corpo ou outros elementos HTML. Não é uma tarefa difícil fazer que uma imagem de fundo cobrir um elemento HTML com a ajuda de JavaScript. Mas em CSS? É possível esticar a imagem usando apenas CSS? Felizmente, é possível! Para que a imagem seja alterada em função do tamanho da janela (viewport), ela deve ter uma regra de CSS, a propriedade «background» que define as características (os valores na regra CSS) do fundo dos elementos HTML. As propriedades «background» são as listadas abaixo: background-color – cor do fundo; background-image – imagem de fundo; background-repeat – maneira como a imagem de fundo é posicionada; background-attachment – se a imagem… Continuar a ler

Categorias
CSS HTML

O que é Responsive Web Design?

Responsive Web Design – Há uns anos atrás existia uma diferença clara entre os ambientes desktop e mobile. Com a introdução de smartphones, tablets e novas tecnologias que acedem à Web, os Web Designers depararam-se com o desafio de conceber para cada vez mais resoluções e dispositivos. Seria de enlouquecer desenhar múltiplas versões de um mesmo site que suprissem cada uma dessas variações de tamanho do ecrã e cada uma das resoluções de tela disponíveis no mercado. Nos dias que correm, todos querem uma versão mobile do seu website. Afinal de contas, os smartphones, tablets, etc, vieram para ficar. Iremos estar sempre a desenvolver os mesmos websites para mais uma mão cheia de dispositivos ou inclusivamente a re-desenhar websites mobile… Continuar a ler