Desenvolvimento com templates: obtendo o máximo de aproveitamento dos recursos do Smarty Adriano Gonçalves [email protected] Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Introdução Onde estamos... Páginas estáticas HTML <HTML> Geradores off-line de páginas HTML estáticas Ms Front Page <HTML> CGI, <% ASP %>, <?PHP ?>... Sistemas web / “Web 2.0” Disseminação dos websites dinâmicos (webmails, ecommerce, portais, etc.) Introdução Exemplo de página dinâmica em PHP Introdução Código da página Introdução E se fosse assim?... Introdução ... e assim? Introdução Desenvolvimento com templates - vantagens ● Separar interface da lógica da aplicação ● Melhor divisão de trabalhos ● ● ● ● Melhor legibilidade, manutenibilidade e reutilização de códigos Flexibilidade para criar layouts diferentes para uma mesma aplicação Flexibilidade para mudar o layout da aplicação em menos tempo Flexibilidade para utilizar as mesmas páginas para mídias diferentes (browser desktop, Palm, celular...) Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty O Smarty e suas vantagens O que é o Smarty? ● ● “É um sistema de templates para PHP: ele fornece uma maneira fácil de controlar a separação da aplicação lógica e a sua apresentação (interface).” Atualmente está na versão 2.6.14 O Smarty e suas vantagens Algumas vantagens do Smarty ● ● ● Ótimo desempenho de execução (compila uma vez e deixa o PHP executar) Sintaxe dos delimitadores configurável Uso de funções de desvio condicional, como ifelseif-else, e foreach, podendo usar expressões simples ou complexas ● Modo de cache embutido ● Flexibilidade de ser extendido com plugins ● Excelente documentação (inclusive em Português) O Smarty e suas vantagens Manual do Smarty em CHM Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Alguns recursos muito úteis Estendendo a configuração Alguns recursos muito úteis Instanciando o Smarty Alguns recursos muito úteis O arquivo de configuração tituloPagina = "Menu Principal" corfundoPagina = #000000 corfundoTabela = #000000 corlinhaTabela = #00ff00 [Consumidor] tituloPagina = "Informações do Consumidor" [Login] tituloPagina = "Login" focus = "nomeusuario" Intro = """Este é um valor que ultrapassa uma linha. Você deve colocá-lo dentre três aspas.""" (Extraído do Manual do Smarty) Alguns recursos muito úteis Variáveis ● Definindo variáveis no PHP...: $template->assign(“nome”,”Adriano”); $template->assign(“sexo”,”M”); ● ...e mostrando no template: Olá, {$nome}! <br>{if $sexo == “M”}Seja bem-vindo!{else}Seja bem-vinda!{/if} Alguns recursos muito úteis Variáveis ● ...que, ao executar a página, irá mostrar: Olá, Adriano! <br>Seja bem-vindo! Alguns recursos muito úteis A variável $smarty ● ● ● ● Permite acessar variáveis de sistema ($_GET, $_POST, $_SERVER, $_SESSION...) Permite acessar constantes do PHP Permite acessar algumas das entidades do Smarty (foreach, section, etc.) Outros recursos: now, ldelim, rdelim... Alguns recursos muito úteis A variável $smarty - exemplos Olá, {$nome_usuario}! Hoje é {$smarty.now|date_format:"%A, %d de %B de %Y"}. Mostra: Olá, Adriano! Hoje é Sexta, 1 de dezembro de 2006. Alguns recursos muito úteis A variável $smarty - exemplos Nome do servidor: {$smarty.server.SERVER_NAME} Mostra: Nome do servidor: localhost Alguns recursos muito úteis Modificadores de variáveis ● Podem ser aplicados a variáveis, funções personalizadas ou strings. Ex.: <h1>{$titulo|upper}</h1> <img src=”imagemdim.php?imagem={$url_imagem| escape:'url'}max_width=500”> Nome: {$nome_pessoa|escape:'htmlall'} Bem-vindo (a) {$nome_usuario|default:'visitante'}! Alguns recursos muito úteis Modificadores de variáveis ● Fazendo uma listagem de notícias com resumo: PHP: ... $query = mysql_query("SELECT * FROM noticias LIMIT 5"); while($linha = mysql_fetch_array($query)) { $noticia_atual["titulo"] = $linha["not_titulo"]; $noticia_atual["texto"] = $linha["not_texto"]; $noticia_atual["link"] = "noticia.php?id=".$linha["not_id"]; $template->append("noticias",$noticia_atual); } $template->display("listagem_noticias.tpl"); Alguns recursos muito úteis Modificadores de variáveis ● Template: <ul id="lista_noticias"> {foreach from=$noticias item=not_atual} <li> <a href="{$not_atual.link}"> <strong>{$not_atual.titulo}</strong></a> - {$not_atual.texto|strip_tags|truncate:200} </li> {/foreach} </ul> Alguns recursos muito úteis Modificadores de variáveis ● Resultado: Alguns recursos muito úteis Modificadores de variáveis ● Removendo links HTML de um conteúdo: Template: {$conteudo|regex_replace:'/<a[^>]*>|<\/a>/':''} Alguns recursos muito úteis Funções ● ● O Smarty possui uma série de funções internas e personalizadas, e é possível criar novas. Alguns exemplos: Foreach-foreachelse – loop que varre um array {foreach from=$noticias item=not_atual} <div class=”noticia”> <strong>{$not_atual.titulo}</strong> </div> {foreachelse} Ainda não há nenhuma notícia cadastrada. {/foreach} Alguns recursos muito úteis Funções - Exemplos ● cycle – faz um ciclo, alternando entre valores <ul id="lista_noticias"> {foreach from=$noticias item=not_atual} <li class="noticia_{cycle values='par,impar' name='noticias'}"> <a href="{$not_atual.link}"> <strong>{$not_atual.titulo}</strong></a> - {$not_atual.texto|strip_tags|truncate:200} </li> {/foreach} </ul> Alguns recursos muito úteis Funções - Exemplos ● Resultado: Alguns recursos muito úteis Funções - Exemplos ● html_table - cria uma tabela html com os dados fornecidos PHP: $pessoas = array(“Nome”,”Endereço”); while($linha = mysql_fetch_array($query)) { $pessoas[] = $linha[“pessoa_nome”]; $pessoas[] = $linha[“pessoa_end”]; } $template->assign(“pessoas”,$pessoas); $template->display(“listagem_pessoas.tpl”); Alguns recursos muito úteis Funções - Exemplos ● html_table Template: {html_table loop=$pessoas cols=2} ...ou, melhorando um pouco...: {html_table loop=$pessoas cols=2 table_attr="cellspacing='0' border='1'"} Alguns recursos muito úteis Funções - Exemplos ● html_table - Resultado: Alguns recursos muito úteis Funções - Exemplos ● Outra aplicação prática do html_table... (Foto ilustrativa, só pra exemplificar) Alguns recursos muito úteis Funções - Exemplos ● ● html_options – faz uma lista de <option> para adicionar em listboxes Fazendo uma listbox de estados: PHP: while($linha = mysql_fetch_array($query)) { $estados[$linha[“uf_sigla”]] = $linha[“uf_nome”]; } $template->assign(“estados”,$estados); $template->display(“pagina_estados.tpl”); Alguns recursos muito úteis Funções - Exemplos ● html_options – fazendo uma listbox de estados Template: Estado: <select name="estado"> {html_options options=$estados} </select> Alguns recursos muito úteis Funções - Exemplos ● html_options – fazendo uma listbox de estados Resultado: Alguns recursos muito úteis Funções - Exemplos ● literal - Serve para ignorar a interpretação do conteúdo interno de um bloco <script language=”Javascript”> {literal} function confirma_envio(form) { if(form.nome == “”){ return false; } else return true; } {/literal} </script> Alguns recursos muito úteis Funções - Exemplos ● strip – elimina espaços e quebras de linha extras {strip} <div id=”menu”> <img src=”opc_1.jpg”> <img src=”opc_2.jpg”> <img src=”opc_3.jpg”> </div> {/strip} Mostrará: <div id=”menu”><img src=”opc_1.jpg”><img src=”opc_2.jpg”><img src=”opc_3.jpg”></div> Alguns recursos muito úteis Funções - Exemplos ● include – permite incluir outro template. Ex. {include file=”cabecalho.tpl”} Olá, mundo! {include file=”rodape.tpl”} Modelo RSS Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Estruturando um site com Smarty Estrutura básica ● Duas opções básicas Template de página principal Template incluído Template cabeçalho Template corpo da página atual Subtemplates Subtemplates Notícia 1 Notícia 2 ●Notícia 3 ● Notícia 1 Notícia 2 ●Notícia 3 ● ● ● Template rodapé Powered by Nonono nono Usando um template principal com a estrutura do site Powered by Nonono nono Separando cabeçalho e rodapé em templates diferentes Estruturando um site com Smarty Estrutura básica ● ● Usando template principal – Dá ao designer uma visão do todo da página para manipular – Tira a preocupação de ficar acrescentando dois includes em todo template Separando cabeçalho e rodapé – Permite trabalhar melhor situações específicas para sites variam mais o layout de seção para seção Estruturando um site com Smarty Usando um template principal ● Template principal (paginas_padrao.tpl): ... <body> <div id=”cabecalho”> Cabeçalho da página </div> <div id=”conteudo_pagina”> {include file=$templateInclude} </div> <div id=”rodape”>Powered by Nononono</div> </body> </html> Estruturando um site com Smarty Usando um template principal ● Template da página inicial (inicial.tpl): Olá, {$nome}, seja bem vindo(a) ao nosso web site! {include file=”listagem_noticias.tpl”} Estruturando um site com Smarty Usando um template principal ● Código PHP (index.php): ... $template = new Smarty_MeuSistema(); $template->assign(“nome”,”Adriano”); $template->assign(“pagina_atual”,”inicial”); $template->assign(“templateInclude”,”inicial.tpl”); $template->display(“paginas_padrao.tpl”); Estruturando um site com Smarty Outras considerações ● ● ● ● Procure “modularizar” os templates que você faz, criando templates reaproveitáveis Procure separar as partes que se repetem muito Procure não quebrar demais o site em muitos templates desnecessariamente Procure manter um padrão de templates na sua empresa Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Escrevendo plugins Tipos de plugins ● Funções ● Modificadores ● Funções de bloco ● Funções de compilador ● Prefiltros ● Posfiltros ● Filtros de saída ● Recursos (resources) ● Insert Escrevendo plugins Exemplo de plugin modificador ● Fazendo uma str_pad <?php function smarty_modifier_str_pad($valor,$tamanho, $string, $tipo) { return str_pad($valor,$tamanho,$string,constant($tipo)); } ?> Escrevendo plugins Exemplo de plugin modificador ● Adicionando ao diretório de plugins Escrevendo plugins Exemplo de plugin modificador ● Chamando...: {foreach from=$produtos item=p_atual} <br> {$cod_produto|str_pad:5:”0”,”STR_PAD_LEFT”} {$nome_produto} {/foreach} Irá mostrar: 00001 – Mouse sem fio 00020 – Teclado sem fio Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Smarty e AJAX Exemplo prático Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Smarty e Xoops Smarty e Xoops (eXtensible Object Oriented Portal System) ● ● Xoops é um Sistema de Gerenciamento de Conteúdos para portais desenvolvido em PHP e MySQL Trabalha com templates desenvolvidos em Smarty Portal da Comunidade XoopsTotal www.xoopstotal.com.br Smarty e Xoops Algumas dicas... ● ● Demonstração prática – Fazendo um bloco que só aparece na página inicial – Fazendo um bloco que aparece somente em um módulo – Debug: A melhor forma de descobrir as possibilidades Mais informações: – www.xoops.org – www.xoopstotal.com.br Agenda Introdução O Smarty e suas vantagens Alguns recursos muito úteis Estruturando um site com Smarty Escrevendo plugins Smarty e AJAX Smarty e Xoops Editores que suportam Smarty Editores que suportam Smarty Algumas opções de editores ● Crimson editor (http://www.crimsoneditor.com/) Editores que suportam Smarty Algumas opções de editores ● VisualPHP IDE Visual Studio.Net (http://www.jcxsoftware.com/jcx/vsphp) Editores que suportam Smarty Algumas opções de editores ● ● Macromedia Dreamweaver – http://www.adobe.com/products/dreamweaver/ – Como configurar syntax highlighting: http://smarty.incutio.com/?page=ConfiguringDreamwe aver Extensões para vários outros editores: http://smarty.php.net/contribs/syntax_highlighting/ Concluindo... ● ● ● ● Desenvolvimento com templates é uma ferramenta que promove melhor divisão de trabalho, manutenibilidade e reutilização de códigos Smarty é um sistema de templates em PHP que provê uma série de recursos para facilitar essa divisão de trabalho programador/designer Smarty é extensível: você pode criar mais recursos através da criação de plugins Xoops é um sistema de portais que que se utiliza da flexibilidade do Smarty para fazer os temas Perguntas? Referências ● Smarty - a ferramenta para compilar templates para PHP (Manual do Smarty) ● http://smarty.php.net/ ● http://cirofeitosa.com.br/ ● http://www.xoopstotal.com.br/ ● Google Contato ● Meu e-mail: [email protected] ● Meu website: http://adriano.ison.com.br/
Download
