Walter Cruz - b2evolution

Nesse tutorial, vamos criar um skin muito básico para o b2evolution. Na verdade, vamos transformar um template já existente em um skin.

Por sugestão do Eliazer, vou usar o template "The Perfect 'Blog Style' 3 Column Liquid Layout (Percentage widths)". Como ele é extremamente simples, podemos ter um mínimo de certeza que o css não atrapalhará nosso trabalho.

O primeiro passo é criar uma pasta para o skin dentro da pasta skins do b2evolution. A pasta que eu criei para esse skin se chama layout_3col.

O arquivo que o b2evolution procura para o skin, por padrão, chama-se index.main.php Em um post futuro, eu mostrarei como funciona a hierarquia de templates do b2evolution. Por hora, ter o arquivo index.main.php no template será o suficiente.

Copie e cole o conteúdo do template que queremos adaptar no arquivo index.main.php. Após isso, instale o skin no painel de administração, e configure algum blog para usar esse skin. Você vai ver que ficou com uma cópia do template original, o que não é muito útil. Isso porque agora precisamos 'rechear' o nosso skin com as tags de template do b2evolution.

O primeiro passo é fazer a inicialização do skin. Isso é feito chamando a função: skin_init( $disp ) no início do skin.

Para isso, podemos colocar no início do skin a seguinte tag, antes mesmo do início do html:

PHP:

Essa variável, $disp, indica o modo de visualização com o qual estamos trabalhando no momento. Por exemplo, podemos estar usando a visualização de uma página ($disp='page'), a visualização de um post ($disp='single') ou a visualização de uma lista de posts ($disp='posts'). No futuro, veremos como usar isso para criar detalhes ou até mesmo templates diferentes para as diferentes visualizações.

Agora, vamos começar a colocar as tags de template dentro da div css com id col1.

O bloco básico a ser colocado:

PHP:

display_if_empty() irá mostrar uma mensagem se aquele tipo de visualização não tiver nenhum posts.

Após isso, começa o loop padrão do b2evolution. Como o b2evolution é orientado a objetos, o que você obtém é um objeto do tipo Item.

A forma básica desse loop é a seguinte:

PHP:

Após o início do loop, existe uma chamada ao método date_if_changed do objeto $Mainlist. Esse método irá exibir a data dos posts sempre que a data mudar, ou seja, se você tiver 3 posts numa mesma data, será exibido a data, seguida pelos 3 posts, seguida pela data do próximo post. (Ou seja, a data não será exibida 3 vezes).

Logo após, exibimos o título do post:

PHP:

O conteúdo do post é exibido pela inclusão de outro arquivo:

PHP:

De onde vem esse arquivo que estamos incluindo? Vejamos: como o nosso skin não possui um arquivo chamado _item_content.inc.php, por padrão, o b2evolution procura um arquivo com esse nome na pasta /skins, e lá o encontraremos. Antigamente, existia uma função chamada $Item->content() que fazia a exibição do conteúdo do post, mas atualmente essa função está marcada como obsoleta no código, e se você a incluir, no final das contas, ela tentará incluir o arquivo _item_content.inc.php .

Podemos simplesmente aproveitar o arquivo _item_content.inc.php fornecido pelo b2evolution, ou se acharmos que precisamos de personalizá-lo ainda mais, podemos copiá-lo para a pasta de nosso skin e fazer as personalizações necessárias.

Após isso, incluímos no skin as categorias e as tags de cada post:

PHP:

Depois disso, incluímos um link para o visitante do blog incluir comentários:

PHP:

E como queremos que quando o visitante clicar nesse link ele realmente veja o formulário de comentários, podemos fazer a inclusão do formulário de uma forma muito fácil:

PHP:

Novamente, se quisermos personalizar o formulário de comentários, podemos copiar o arquivo _item_feedback.inc.php para o nosso template e editarmos a nossa cópia.

Por questões de simplicidade, incluí um <hr /> como separador de cada post. O mais correto fosse criar uma div para cada post, mas assim já temos uma separação visual entre um post e outro.

Pronto! Já temos um skin básico para o b2evolution!

Quer dizer, mais ou menos né? Isso porque as nossas duas barras laterais e os menus superiores ainda trazem o texto 'placeholder' que veio do template que copiamos. Para isso, precisaremos lidar com o conceito de contâineres e widgets, o que veremos na próxima seção desse tutorial.

No início da série 3.x, o François Planque adicionou alguns novos tipos de post, e eu vi nisso uma oportunidade para resolver um pequeno problema que me incomodava: para mim, ter de criar um blog para que ele forcenesse uma lista de links para ser usada em outro blog era algo chato de se fazer Além do mais, adicionava mais um item numa interface já poluída. Eu nunca tinha visto como ficava a barra do b2evolution com muitos blogs criados (fica muito esquisito), e vi nisso uma oportunidade de ajudar a eliminar uma parte desses blogs.

Minha idéia inicial era usar os posts com o tipo "Link" e a partir deles criar a lista de links de um blog, mas o Daniel já estava usando esse tipo de post para outro próposito em seu blog. Então, acabei optando por criar um novo tipo, que o François chamou de "Sidebar Link" (link na barra lateral). Para adicionar links usando esse tipo de post, crie o link da mesma forma que você criava antigamente: o título sendo o texto do link e o campo "Link para o site" sendo o link em si. Não esqueça de colocar o tipo de post como "Sidebar Link". Para exibir a lista de links em seu skin, adicione um widget do tipo "Lista de links simples na barra lateral", que irá exibir numa lista os links criados com o tipo "Sidebar Link".

Se a intenção for eliminar totalmente o linkblog, basta clicar em Opções Globais (ou pode ser Configurações Globais) -> Recursos e habilitar a movimentação de categorias. Após isso, basta entrar nas categorias do seu linkblog e movê-las para o seu blog e mudar o tipo de todos os posts para "Sidebar Links" (o que pode ser unm pouco chato se você tiver muitos links guardados )