Webord.net: WordPress, jQuery, SEO, .htaccess, xHTML, CSS, Desenvolvimento, Design

Esse é o tópico mais falado no último semestre, com relação ao WordPress. Sim será uma das maiores atualizações feitas no sistema, mas será que você vai realmente ganhar alguma coisa com isso? Bom eu garanto que se você for um desenvolvedor, ganhar você com certeza irá ganhar tempo.

Principal Motivo: WordPress MU (oficial)

Pois bem, este tópico é muito falado principalmente pelo fato do WordPress MU, a versão do sistema direcionada para a criação de uma plataforma onde você tem uma instalação principal do WordPress com a configuração dos temas disponíveis e os plugins, nesta administração é possível criar outras sub-instalações que ficam submetidas as configurações setadas pela principal, basicamente o que acontece no WordPress.com. Nesta versão 3.0 será mesclado com o WordPress comum esta versão do sistema, para que torne-se um sistema mais robusto e mais seguro como um todo. Leia Mais

Bom pela primeira vez aqui no Webord.net, eu decidi fazer uma pequena série de artigos. Achei que seria muito interessante começarmos com um assunto bem legal do WordPress. A comunidade que o cerca.

Então resolvi escrever sobre os plugins, que assim como o iPhone, é o que é por causa da força que sua comunidade de desenvolvedores lhe transfigura através dos Aplicativos, o WordPress, é o gerenciador de conteúdo [CMS] mais popular do mundo, contando com, até o momento, com mais de 9000 plugins desenvolvidos e mais de 80 MILHÔES, de downloads.

Contudo, encontra-se muito pouco sobre como criar plugins em português. Ao menos foi essa sensação que tive quando comecei a desenvolver um plugin. Sim só tenho um plugin desenvolvido e lançado no WordPress.org, mas já fiz plugins para sistemas específicos de trabalhos que fiz.

Resolvi dedicar um pouco mais do meu tempo para que o Webord.net se torne algo mais profissional, e comecei a ler bastante sobre o assunto em artigos em inglês para criar um “tutorial” de como fazer o seu plugin, boas práticas de desenvolvimento e como publicar no repositório oficial.

Gostaria de antes de mais nada pedir a vocês, qualquer tipo de dúvida, por mais estranha que ela possa parecer a você, pergunte pois se eu tiver o conhecimento, vou repassá-lo. Leia Mais

Existem várias maneiras de se fazer isso, porém hoje irei falar sobre apenas uma delas.

Já vi muitas pessoas tendo problemas para, por exemplo em Blogs, fazer thumbnail de imagens para ilustrar o artigo, e esta imagem deve ter um tamanho fixo.

Bom este é um problema sério, porque se em um blog o usuário que normalmente não é uma das mentes mais brilhantes, então podemos imaginar que ele não deve saber mexer com imagens e provavelmente vai colocar imagens em tamanhos esdrúxulos, que vão acabar com o design que você havia desenvolvido.

Para acabar com este problema basta você tem que usar PHP, e desta vez iremos usar um script feito pelo Tim McDaniels o TimThumb. Ele suporta imagens em .gif, .png e .jpg, sendo assim vou explicar como esse simples código pode ser usado.

Então primeiramente você deve verificar se o seu o seu servidor permite que você faça tais modificações com PHP, alguns servidores não permitem algumas funções da linguagem pois elas consomem muita Memória do servidor, para que isso não aconteça entre em contato com o suporte do seu e peça para que liberem o uso da livraria GD, de manipulação de imagens. Se não funcionar apenas peça para que liberem o uso do timthumb.php pois você gostaria de usá-lo. Lembre-se de pedir para que façam isso apenas na sua conta, se não eles não irão fazer.

Agora que nosso acesso foi liberado, siga até o seu FTP e crie uma pasta e re-nomeie-a para cache após feito isso você deve mudar as permissões desta pasta para 777, onde você permite que sejam gravados dados dentro da pasta.

Após feito isso coloque na pasta raiz desta que você acabou de criar, o arquivo timthumb.php.Mude agora as permissões desta pasta raiz para 777.

Agora vamos para parte onde iremos usar este arquivo para redimensionar imagens.

É muito simples, ao invés de usar o link comum da imagem iremos trocar por um parecido com este:

timthumb.php?src=/imagem/qualquer.jpg&h=150&w=150&zc=1&q=100

No link acima estamos passando alguns parâmetros para o arquivo PHP, eles são:

• src : URL
• h : Altura
• w : Largura
• zc : Aumentar e Cortar [0 ou 1]
• q : Qualidade [0 até 100]

Dessa forma podemos passar para o script algumas informações como se você deseja que ele aumente sua imagem e corte para cortar exatamente nas proporções desejadas, caso contrário ele apenas irá redimensionar e você terá uma imagem desfigurada quando esta mudar de proporção.

Dicas ao usar o Timthumb.php

Para fazer um melhor uso do script é importante fazer algumas coisas, como por exemplo, habilitar o cache colocando em seu .htaccess:

RewriteEngine on
RewriteRule .* - [E=HTTP_IF_MODIFIED_SINCE:%{HTTP:If-Modified-Since}]
RewriteRule .* - [E=HTTP_IF_NONE_MATCH:%{HTTP:If-None-Match}]

Não tente usar imagens de outros sites, porque não irá funcionar. Apenas imagens em seu servidor serão redimensionadas corretamente e não coloque o arquivo timthumb.php na raiz do seu site, coloque-o dentro de uma outra pasta, pois a necessidade de usar o nível de permissão 777 torna seu servidor vulnerável.

Bom galera como vocês já devem saber o WordPress está chegando em sua versão 2.9, que irá trazer algumas funcionalidades que irão facilitar a vida dos desenvolvedores, dos usuários e visitantes.

Uma destas funcionalidades é a possibilidade de criar thumbnail[Miniatura] sem ter que fazer nenhum tipo de campo personalizado, facilitando para o seu cliente, que não tem prática com o sistema, para os desenvolvedores, só isso que realmente irá mudar.

Clique em "Set Thumbnail"

Não são apenas miniaturas, a funcionalidade engloba 4 tipos de tamanhos, sendo assim fica bem melhor para que você possa fazer a coisa da melhor maneira possível. Sendo eles:

• Miniatura ou em inglês ,Thumbnail
• Tamanho médio
• Grande
• Completo, a imagem que você subiu

Mas tem uma maneira correta de se fazer isso, e é importante que todos já saibam antes do lançamento da versão para que tenhamos temas bem desenvolvidos.

Para começar você deve acessar o arquivo functions.php do seu tema, e adicionar o seguinte código:

add_theme_support( 'post-thumbnails' );

Bom esta nova função do WordPress, que possibilita o desenvolvedor ativar alguma funcionalidade do tema para seus usuários ou clientes. Não conheço nenhuma outro uso dela até agora, contudo provavelmente teremos algumas possibilidades no futuro.

No código iremos usar a função e ativa o suporte de Miniaturas nos artigos. Após feito a ativação precisamos saber como exibir no tema a imagem.

Da seguinte maneira iremos ter um resultado já com a tag da imagem em html pronta:

<?php the_post_image( 'thumbnail' ); ?>

Usando o código acima iremos ter como resultado a imagem miniatura, porém também podemos ter a imagem em diferentes tamanhos para diferentes usos.

<?php the_post_image( 'medium' ); ?>
<?php the_post_image( 'large' ); ?>
<?php the_post_image( 'full' ); ?>

O básico de como usar a função de exibição de miniaturas do WordPress 2.9 acaba aqui, agora vou explicar e dissecar mais algumas opções.

Como verificar se tem thumbnail ou não

Bom muitas vezes os usuários podem esquecer de colocar o thumbnail e teremos problemas com a função, então é mais interessante definirmos uma verificação para que não tenhamos problemas com isto.

Para fazer a verificação iremos usar a função has_post_image() que retorna true ou false quando tem imagem ou não.

Então faremos a verificação, e para ficar mais legal iremos definir uma imagem padrão para quando não houver imagem.

<?php
	if ( has_post_image() )
		the_post_image( 'thumbnail' );
	else
		echo '<img src="sem_thumbnail.jpg" alt="Este artigo não tem miniatura" title="Este artigo não tem miniatura" />';
?>

Retornar a URL da imagem

Bom galera normalmente os desenvolvedores precisam retornar apenas o link para poder usar em plugins e outras funções do próprio WordPress, para faze-lo é necessário a seguinte função:

$image = get_the_post_image( $post->ID, 'thumbnail' );

Mudando a saída HTML da função

Adicione o seguinte código no seu arquivo function.php, para podermos fazer uma mudança do HTML de saída da função:

add_filter( 'post_image_html', 'theme_post_image_html', 10, 3 );

function theme_post_image_html( $html, $post_id, $post_image_id );

	$html = '<a href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_post_field( 'post_title', $post_id ) ) . '">' . $html . '</a>';

	return $html;
}

Plugin para não perder as imagens do seu tema atual

Vários temas usam Custom Fields[Campos Personalizados] e outras formas de fazer miniaturas, porém imagine um blog com milhares de artigos e seria necessário definir as miniaturas dos artigos uma a uma, isso seria um inferno. Então temos um plugin para fazer isso, acesse o site do WordPress.org e baixe o plugin e seja feliz.

Bom acho que todos sabem o que é o Cache do Browser, porém a maioria dos desenvolvedores Web de hoje não sabe realmente usa-los para otimizar o site da maneira correta. Com o WordPress este trabalho fica bem mais fácil, devido a uma função interna.

Abaixo vou explicar como funciona, porém não tem como sanar todas as dúvidas, então seria muito legal se vocês colocassem em discussão algo que tiverem com problemas, ai talvez eu possa te ajudar.

Na versão 2.3 do WordPress que veio a primeira função de Cache do wordpress, e era opcional seu uso, então deveria ser usado um pequeno código para ativar o seu uso: define ( 'ENABLE_CACHE', true);

Mas só na versão 2.6 que as funções para Cache receberam um tratamento interessante, ele se tornou orientado a objeto e então trouxe várias oportunidades para seu uso. Nesta versão o uso do Cache já entra como padrão então nada de ativação.

Porém com esta introdução é importante para seu uso um mínimo de memória do servidor, então o WordPress começou a requerer que os servidores tivessem ao menso 32MBytes de RAM.

Mas vamos ao tópico principal, como usar as funções de Cache do WordPress. As mesmas podem ser encontradas no arquivo wp-includes/cache.php, ou no Codex do WordPress.org

De começo temos que saber como inserir informações no Cache do usuário, usando a função abaixo podemos faze-lo:

/**
 * @Parâmetro - int|string $key - ID do item para ser identificado depois
 * @Parâmetro - mixed $data - A informação que deve ser guardada
 * @Parâmetro - string $flag - O grupo que a informação deve ser guardada
 * @Parâmetro - int $expire - Quanto tempo leva para a informação expirar
 */
wp_cache_add($key, $data, $flag = '', $expire = 0)

Para deletar é quase a mesma coisa, apenas devemos identificar o grupo e a ID.

/**
 * @Parâmetro - int|string $id - ID do item que foi dita na outra função
 * @Parâmetro - string $flag - O grupo que a informação foi guardada
 * @Retorna - bool - Verdadeiro quando completa a ação e falso quando não consegue
 */
wp_cache_delete($id, $flag = '')

Como recuperar a informação salva em Cache, usando o grupo e a ID:

/**
 * @Parâmetro - int|string $id - ID do item que foi dita na outra função
 * @Parâmetro - string $flag - O grupo que a informação foi guardada
 * @Retorna - bool|mixed - Falso quando não consegue e quando ver
 */
wp_cache_get($id, $flag = '')

Se for necessário modificar algo em uma informação:

/**
 * @Parâmetro - int|string $key - ID do item para ser identificado depois
 * @Parâmetro - mixed $data - A informação que deve ser guardada
 * @Parâmetro - string $flag - O grupo que a informação deve ser guardada
 * @Parâmetro - int $expire - Quanto tempo leva para a informação expirar
 * @Retorna - bool - Falso se o ID e o Grupo já existirem e verdadeiro quando completa a ação
 */
wp_cache_replace($key, $data, $flag = '', $expire = 0)

Agora vamos a um pequeno exemplo. Usaremos uma URL como dado a ser salvo:

$v_webord_cache = wp_cache_get( 'webord_cache ' ); // Pega a informação com a id "webord_cache "
if ($v_webord_cache == false) { // Se a informação não estiver disponível
	$v_webord_cache = "http://webord.net/"; // Salva na variável a informação
	wp_cache_set( 'webord_cache', $v_webord_cache ); // Salva o cache para a chave "webord_cache "
}
var_dump( $v_webord_cache ); // Exibe o Conteúdo

Bom é basicamente isso, quando eu comecei a estudar Web eu me assustava quando falavam de Cache mas hoje percebo que não é um Monstro, é bem simples até, basta você ter empenho e estudar.

Como usar Widgets no WordPress

Bom todos devem estar cientes que é possível adicionar complementos a sua barra lateral com uma ferramenta chamada Widget, porém para que você ou o cliente possa usufruir de tal facilidade você deve preparar seu Tema para aceitar o dito cujo.

Contudo normalmente a galera não sabe realmente como Implementar da maneira correta nos Temas, e o artigo tem este propósito, explicar como fazer seu tema aceitar os Widgets da maneira correta.

Vamos começar acessando o arquivo functions.php do tema que desejamos implementar, e devemos acessar este arquivo pois nele iremos encontrar todas as funções que o nosso tema vai abrir antes de ser interpretado pelo sistema, assim sendo podemos declarar funções ali e usar em uma página qualquer por exemplo. Leia Mais

Galera, tenho uma notícia boa e uma ruim…

Utilizando a ferramenta de Imagens do WordPress

Começando com a boa, a equipe de desenvolvimento do WordPress vai lançar uma nova versão do sistema ainda este ano, e esta virá com novidades interessantes. A notícia ruim é, ao meu ponto de vista, que estão implementando coisas que não deveriam estar no core do WordPress, e sim em plugins “oficiais”.

Os desenvolvedores deveriam se focar mais em segurança e velocidade do sistema, que no momento são dois pontos críticos do WordPress.

Com relação a uma das novidades que estão vindo para a nova versão do sistema, temos um pequeno editor de imagens implementado, vejam as imagens abaixo! Leia Mais

Bom é muito importante para o desenvolvimento de temas mais elaborados, páginas com estilos diferentes ao que é definido no arquivo page.php, e para a criação destes é necessário serem estabelecidos os ditos ‘Templates’.

Os ‘Templates’ podem ser usados para a criação de páginas como por exemplo a que temos aqui no Webord.net, que exibe todos os artigos já publicados a página Arquivo.

Para a criação de uma definição de ‘Template’ basta a inserção do seguinte código nas primeiras linhas de um arquivo .php qualquer:

<?php
/*
Template Name: Arquivo
*/
?>

Com o código acima criamos o ‘Template’ chamado de “Arquivo”.

Para usar no seu tema basta ir na parte de criação de páginas e descer até a a parte onde tem um menu escrito ‘Page Template’ como na imagem acima.

Então você escolhe o ‘Template’ e cria a página