Posts Tagged ‘ hack

Arquivos grandes: como lidar com eles? 13 Outubro 2008 às 10:03 am por Rodrigo Ghedin

Se seu blog tem três anos ou mais, conta com um problema na sidebar: o tamanho dos arquivos. É praxe dividir os arquivos por mês, logo, em três anos de blog, e considerando que pelo menos um texto foi publicado por mês, no box dos arquivos há 36 links!

Há dois problemas em ter tantos links no box Arquivos. O primeiro é que a sidebar fica extensa, tirando o foco do que vier abaixo dos arquivos, e/ou deixando-a muito maior que a coluna de posts. O segundo, e mais grave, é que tanto link assim vai contra uma das diretrizes do Google para webmaster, que diz que, numa página, o recomendado é ter, no máximo, 100 links.

Existem duas formas de contornar esse problema, as quais explicarei abaixo. A primeira é criar um menu drop down, o que economiza muito espaço, e é bem discreto. A outra, é listar os arquivos por ano, ao invés do tradicional, que é fazê-lo por mês. Mas não se trata de uma mera listagem por ano… No método que será ensinado, ao clicar n’algum ano, os meses deste se expandem. Vamos lá?

Arquivos como menu drop down

Arquivos como menu drop down.

Arquivos como menu drop down.

Para conferir como fica o menu drop down na prática, veja a sidebar do WinAjuda (ou a imagem ao lado). Como se vê, o resultado é bem satisfatório, e o que é melhor: independe de plugin - embora, salvo engano, existam alguns com essa fianlidade.

Fazer isso em seu blog é muito fácil. Simplesmente copie e cole o trecho abaixo no arquivo sidebar.php, onde achar melhor:


<li><h2 class="titulos">Arquivos e Categorias</h2>
<ul>
<li><select name="archive-dropdown" onChange='document.location.href=this.options[this.selectedIndex].value;'>
<option value=""><?php echo attribute_escape(__('Escolha o mês')); ?></option>
<?php wp_get_archives('type=monthly&amp;amp;amp;format=option&amp;amp;amp;show_post_count=1'); ?> </select></li>
</ul>
</li>

Salve as alterações, e pronto!

Arquivos divididos por ano

O código para exibir arquivos é o seguinte:

<?php wp_get_archives('type=monthly'); ?>

Se seu intuito é simplesmente listar os arquivos por ano, e nada mais, substitua o termo monthly, no código acima, por yearly. Mas como isso é ficar no arroz com feijão, vamos além.

O código abaixo, além de listar os arquivos por ano, traz um plus interessante. Nele, quando o leitor clica num dos anos, a página correspondente é aberta, e no menu, os meses aparecem. Em meu blog pessoal é possível ver o sistema em funcionamento - ou, para quem preferir, na imagem abaixo:

Arquivos por ano.

Arquivos por ano.

Sem mais delongas, o código, extraído deste tópico do fórum oficial, é o seguinte:

<ul><li><h2>Arquivos</h2>
<ul>
<?php
global $month, $year; // scope WP global variables for later use
/* $arc_years => archive years query */
$arc_years = $wpdb->get_col("SELECT DISTINCT YEAR(post_date) FROM $wpdb->posts WHERE post_status = 'publish' ORDER BY post_date DESC");
foreach($arc_years as $arc_year) : // foreach loop for archive years
?>
<?php if($year != $arc_year) : // if current archive year does not equal $arc_year ?>
<li><a href="<?php echo get_year_link($arc_year); ?>"><?php echo $arc_year; ?></a></li>
<?php else : // current archive year *does* equal $arc_year ?>
<li><a href="<?php echo get_year_link($arc_year); ?>"><?php echo $arc_year; ?></a></li>
<li>
<ul>
<?php
/* $arc_months => archive months query for current archive year */
$arc_months = $wpdb->get_col("SELECT DISTINCT MONTH(post_date) FROM $wpdb->posts WHERE YEAR(post_date) = '$arc_year' AND post_status = 'publish' ORDER BY post_date");
foreach($arc_months as $arc_month): // foreach loop for archive months of current archive year
?>
<li><a href="<?php echo get_month_link($arc_year, $arc_month); ?> "><?php echo $month[zeroise($arc_month, 2)]; ?></a></li>
<?php endforeach; // end foreach loop for archive months ?>
</ul>
</li>
<?php endif; // end if/else on archive $year/$arc_year ?>
<?php endforeach; // end foreach loop for archive years ?>
</ul>
</li></ul>

A única coisa que falta nele é um toque de AJAX, de modo que a abertura dos meses seja on the fly, sem que a página inteira precise ser recarregada. Algum programador-leitor disposto a fazer essa melhoria?

Em suma, é isso. Espero que tais dicas sejam úteis, e até a próxima!

Redirecione o site inteiro via .htaccess Por Rodrigo Ghedin dia 18 de Setembro de 2008 às 7:32 pm | Imprimir este post

Mudar de domínio é difícil. Não bastasse o transporte dos arquivos e bancos de dados de um servidor para outro, ainda temos o redirecionamento do endereço antigo para o novo, que para muitos é um bicho de sete cabeças. Digo, para quem sabe, pode até ser fácil, mas para quem não tem muita intimidade com servidores e coisas do tipo, a coisa complica.

Uma solução simples é pedir ao suporte do servidor que adicione o domínio novo: assim, ambos os domínios, o original e o antigo, funcionarão. Não sei se isso caracteriza conteúdo duplicado, prática que detona qualquer estratégia de SEO, mas na dúvida, evito. Afinal, fazendo isso, os dois domínios continuam acessíveis, cada um em sua própria URL, ambos caindo no mesmo conteúdo. Outro efeito colateral ruim é a descentralização da marca, afinal, se com um TLD já é difícil fixar o domínio na cabeça das pessoas, imagine com dois ou mais?

Como se vê, essa não é a melhor saída. Precisando de uma solução, já que tinha que redirecionar dois domínios (.com e .com.br) para o novo (.ig.com.br), corri atrás de uma mais amigável e transparente, tanto para o leitor, quanto para os mecanismos de busca. E a encontrei. Não lembro aonde, mas encontrei. Funciona via .htaccess, e é bem simples de ser implementada.

O código é o seguinte:


RewriteEngine on
RewriteCond %{HTTP_HOST} ^(www.)?antigo.com [NC]
RewriteRule ^(.*)$ http://www.novo.com/$1 [R=301,L]

Copie, cole no seu .htaccess, e faça as devidas modificações. Se houver mais de um domínio antigo, repita as duas últimas linhas na seqüência, alterando, obviamente, o domínio antigo.com pelo antigo2.com. Simples assim.

Trabalhando as legendas nas imagens do WordPress 2.6 Por Rodrigo Ghedin dia 19 de Julho de 2008 às 4:50 pm | Imprimir este post

Uma das grandes novidades do WordPress 2.6 é a inserção de legendas (captions) nas imagens. Funciona assim: o texto alternativo (alt=”qualquer coisa”) aparece abaixo da imagem, no post, caso o autor assim o queira. Se você atualizou seu sistema, mas ainda assim nada aconteceu em relação às legendas, ou elas apareceram sem formatação alguma, nada tema! O pBlog lhe ajuda a corrigir isso.

Antes de adentrarmos à edição, cabe uma breve explicação sobre o funcionamento das legendas. No editor, se você alterar o modo de exibição para o HTML, verá que há tags envoltas por [colchetes], cheias de atributos, responsáveis pelas legendas em torno das imagens. Não é preciso mexer em nada, só estou comentando a título de curiosidade ;-) .

No post, já publicado, em torno da imagem aparece uma DIV com classe wp-caption, e dentro dela, limitando a legenda em si, a DIV com classe wp-caption-text. É editando-as que teremos o efeito desejado, bastando, para tal, criatividade do editor (e talento em CSS, claro). Funciona assim, mais ou menos:


<div class="wp-caption"><img title="Imagem" src="caminho-da-imagem.jpg" alt="Imagem" />
<p class="wp-caption-text">Pôster de WALL•E.</p>
</div>

Se CSS não é sua praia, esqueça o que leu acima, e simplesmente copie e cole o conteúdo abaixo em seu stylesheet.css:


.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

Este é o código que foi incluído no tema padrão do WordPress, e gera o efeito presente nos blogs do WordPress.com, que por sua vez, pode ser conferido em meu blog pessoal. Bacana, não?

Como se vê, o trabalho é feito em cima das duas classes de DIVs comentadas acima - e nem poderia ser de outra forma. Este código, bastante complexo, mostra bordas arredondadas sem o uso de imagens, o que é deveras legal. Ele não impede, porém, que você mesmo crie sua formatação para as legendas. Basta saber um pouco de CSS, e ter imaginação, para ser diferente ;-) .

Emoticons sem borda Por Rodrigo Ghedin dia 28 de Maio de 2008 às 7:04 pm | Imprimir este post

Em muitos temas, as imagens, quando inseridas na coluna dos posts, aparecem com bordas, margens e [coloque a tradução de padding aqui]. Esse recurso propicia um resultado final bacana, mas quem usa emoticons nos textos acaba sofrendo com um efeito colateral óbvio dos enfeites em imagens: os emoticons do sistema também são afetados.

Quer ver um exemplo? Então veja:

Erro no CSS do emoticon.

Notou como fica? As soluções mais fáceis são eliminar os efeitos, ou adicioná-los manualmente. O problema da segunda opção é que se no futuro o tema for mudado, corre-se o risco dos efeitos das imagens não combinarem com o novo visual.

As soluções fáceis são essas, mas existe uma um pouquinho mais difícil, porém com resultado totalmente satisfatório.

Abra o style.css do seu tema, e no final dele, acrescente a seguinte linha:

img.wp-smiley { border:0; padding:0; margin:0; }

A mágica é simples. Os emoticons padrões do WordPress são introduzidos nos textos com a classe CSS .wp-smiley. Logo, basta acrescentar alguns atributos na folha de estilo, e todos os emoticons se comportarão uniformemente.

Colocando essa linha no final do arquivo, a classe incluída no código do emoticon sobrepõe-se à regra geral para imagens. CSS usado com inteligência é isso.

A propósito, se os emoticons não aparecem em seus textos, verifique se o recurso está habilitado no WordPress. Vá em Settings, depois em Writing, e certifique-se de que a opção Convert emoticons like :-) and :-P to graphics on display está marcada.

Vejam a mesma imagem acima, porém com o código do CSS incluído:

CSS correto.

PS: Érico, habilita emoticons aqui no pBlog? Hehe :D

Correção para erro no upload de imagens (WordPress 2.5) Por Rodrigo Ghedin dia 07 de Abril de 2008 às 9:24 am | Imprimir este post

Se você instalou o WordPress 2.5, e ao tentar enviar uma imagem através da nova ferramenta de uploads, se deparou com um erro “HTTP error”, bem como outra dizendo “An error occurred in the upload. Please try again later”, não se desespere. Aqui está a solução para o problema!

Erro no envio de imagens, WordPress 2.5.

A solução é simples. Acesse seu blog via FTP (recomendo o FileZilla), e baixe o arquivo .htaccess. Se não conseguir vê-lo, certifique-se de que a visualização de arquivos ocultos está habilitada. No FileZilla, clique no menu Servidor, e marque a opção Force showing hidden files.

Abra-o no Bloco de Notas, e acrescente as linhas abaixo no começo do arquivo:

<IfModule mod_security.c>

<Files async-upload.php>

SecFilterEngine Off

SecFilterScanPOST Off

</Files>

</IfModule>

Salve, e envie novamente para o servidor.

Pronto, problema resolvido!

[Via Hongkiat]

Gravatar no WordPress 2.5 Por Rodrigo Ghedin dia 04 de Abril de 2008 às 5:55 pm | Imprimir este post

Você sabia que o WordPress 2.5 suporta gravatar nativamente, dispensando plugins e hacks complicados? Tal novidade é reflexo da recente aquisição do serviço pela Automattic, empresa por trás do nosso querido sistema de blogs.

Embora o gravatar esteja disponível para todos, sinto que ainda falta uma certa divulgação do recurso. Nem na Codex, a “Bíblia” do WordPress, encontrei informações… Aí apelei para o Google, e ele, como sempre, salvou a pátria!

Antes de continuar, vale lembrar que o recurso precisa estar ativado no painel administrativo. Ele já vem assim por padrão, mas só para garantir, encontra-se em Settings, Discussion, bem no final da página. A opção Show Avatars deve estar marcada, como na imagem abaixo:

Gravatar no WordPress 2.5.

Encontrei dois links úteis na pesquisa que fiz. No Weblog Tools Collection há uma explicação super detalhada do novo recurso, ótima para quem desenvolve temas, pois há dicas de implementação, atributos disponíveis e hacks que asseguram a compatibilidade do tema com versões anteriores do WordPress. Como nós queremos pura e simplesmente mostrar os gravatars, parti para o próximo resultado da pesquisa, o blog Hack WordPress. A mágica se resume no seguinte código:

<php if(function_exists('get_avatar')){ echo get_avatar($comment, '50');} ?>

Basta copiar esse trecho, colar no comments.php do seu tema, dentro do loop dos comentários, e correr para o abraço!

O tamanho dos gravatars será de 50×50 pixels; para alterar, basta mudar o número 50, bem no final da linha, pelo de sua preferência. O máximo permitido é 80.

Espero que tenham gostado, e até a próxima!