introducao cms-wordpress

21
Uma introdução ao CMS mais popular do mundo.

Upload: mateus-neves

Post on 14-Dec-2014

5.140 views

Category:

Documents


0 download

DESCRIPTION

Uma intodu

TRANSCRIPT

Page 1: Introducao cms-wordpress

Uma introdução ao CMS mais popular do mundo.

Page 2: Introducao cms-wordpress

1. IntroduçãoO WordPress é uma plataforma de código aberto para gerenciamento on-line de conteúdo o que chamamos de CMS, desenvolvido na linguagem PHP e sua base de dados em MySQL, com foco na estética, nos Padrões Web e na usabilidade. O WordPress é um software gratuito. Em outras palavras, o WordPress é o que você usa quando você quer trabalhar e não lutar com seu software de publicação.

Page 3: Introducao cms-wordpress

Mais que um CMS um Framework

O Wordpress em sua versão atual já não é mais visto como um simples sistema para criação de blogs, este foi seu objectivo inicial quando foi lançado em 27 de maio de 2003 na versão 0.70.

Enquanto escrevo esta apresentação o Wordpress esta na sua versão 3.2.1. O Wordpress pode ser visto sendo utilizado para gerenciar sites de diversas áreas desde um simples blog a um completo site de e-commerce ou um portal de notícias. Isto foi possível por sua simplicidade e flexibilidade de se trabalhar, você faz o que você quiser com esta ferramenta pois o Wordpress hoje além de ser o CMS mais popular do mundo é usado como um framework por várias empresas para construção de sites simples e complexos.

Page 4: Introducao cms-wordpress

2. Instalação

Para a utilização do WordPress são recomendadas as seguintes configurações:

Versão do PHP 5.2.4 ou superior.Versão do MySQL 5.0.2 ou superior

REQUISITOS MÍNIMOS

Page 5: Introducao cms-wordpress

A famosa instalação de 5 minutos

1. Descompacte o pacote em uma pasta vazia.2. Abra o arquivo wp-config-sample.php com um editor de texto como o WordPad ou similar e preencha suas informações de conexão do banco de dados.3. Salve o arquivo como wp-config.php4. Faça o upload de tudo.5. Abra o arquivo /wp-admin/install.php no seu navegador. Isto instalará as tabelas necessárias para o seu blog. Se ocorrer algum erro, confira seu arquivo wp-config.php, e tente novamente. Se falhar novamente, visite os fóruns de suporte com todas as informações que você puder reunir.6. Anote a senha fornecida para você.7. A instalação deve então encaminhá-lo para a página de login. Preencha o nome de usuário com admin e a senha gerada durante a instalação. Você pode clicar em ‘Usuários/Seu Perfil’ para alterar a senha.

Para informações mais detalhadas sobre a instalação visite essa página do Codex (em inglês).http://codex.wordpress.org/Installing_WordPress

Page 6: Introducao cms-wordpress

3. Painel de controleA tela inicial do painel

que chamamos de Dashboard é uma

ferramenta para acessar rapidamente

as áreas mais utilizadas da

Administração do seu site. A Tela do Painel

inicial apresenta informações em

blocos chamados de módulos.

Page 7: Introducao cms-wordpress

Um resumo sobre o painel de controle

O Painel de Administração oferece acesso aos recursos do controle de sua instalação do WordPress. Cada painel de administração é apresentado em seções, o cabeçalho, a navegação principal, a área de trabalho e o rodapé. O cabeçalho mostra o nome do seu site que é também um link para o seu site, pode mostrar a mensagem de motores de busca bloqueados se as configurações de privacidade se assim estiver definida, links para Seu perfil (mostrada como seu nome de usuário) e link Sair. Logo abaixo do topo da área sombreada há duas abas com Opções de Tela e Ajuda contextual Ajuda, que podem ser clicadas para expandi-las.

Do lado esquerdo da tela há o Menu de Navegação logo mais, há detalhes de uma das funções administrativas que você pode executar. Duas setas expandir/recolher logo abaixo De Painel e Comentários permitem que o menu de navegação se recolha em um conjunto de ícones, enquanto se expandi-los aparece o ícone e rótulo para cada uma das principais funções administrativas. Dentro de cada uma das funções importantes, como Postagens, uma seta para baixo é apresentada se a parar o cursor do mouse sobre a barra de título. Clique sobre a seta que se expande para mostrar cada uma das opções de sub-menu. Clicando nessa seta, o sub-menu é recolhido.

Mais informações, acesse:http://codex.wordpress.org/pt-br:Painéis_de_Administração

Page 8: Introducao cms-wordpress

4. TemasUm Tema é o design geral de um site e engloba cores, gráficos, texto e arquivos como imagens, scripts, folhas de estilo entre outros. Um tema é às vezes chamado de skin. Quem usa o WordPress têm disponível uma longa lista de temas para escolher e decidir o que apresentar aos visitantes dos seus sites.

Desde o aparecimento do SubPainel Temas você pode escolher qual tema será apresentado para os visitantes do seu site. Você também pode ver imagens de cada tema que enviou para o seu servidor.

Page 9: Introducao cms-wordpress

Sub painel de temas

No sub painel de temas é onde você

pode procurar e visualizar os temas

disponíveis para serem utilizados em

seu site ou blog. É possível instalar

novos temas também direto pelo sub painel

de temas

Page 10: Introducao cms-wordpress

PHPComo o Wordpress é um sistema desenvolvido na linguagem PHP em sequência seus temas também devem ser desenvolvidos em PHP.

Algumas regras básicas do PHP.

Todas as instruções em PHP devem estar entre os seguintes marcadores <?php ?> e as instruções devem ser sempre finalizadas com ponto e virgula ( ; ).Exemplo:

<?php echo “Olá mundo!” ?> // Esta instrução irá imprimir na tela o texto Olá mundo!

Em qualquer linguagem de programação trabalhamos com as chamadas variáveis que funcionam como gavetas para guardadem um conteúdo para serem usadas de várias formas.No PHP toda variável é definida colocando o caracter ( $ ) antes do nome da variável.

<?php$cor = “azul”; // A variável $cor foi declarada e recebeu uma string, strings são variáveis do tipo texto.echo $cor; // Imprimimos na tela o valor da variável $cor, o resultado sera o texto “azul”?>

Page 11: Introducao cms-wordpress

Instruções básicas de php

1.Imprimindo um conteúdo na tela<?php echo “Olá mundo!” ?> // Esta instrução irá imprimir na tela o texto Olá mundo!

2.Instrução condicionalAs instruções condicionais funcionam como um interruptor. Ela executa uma instrução dependendo do resultado da expressão condicional que vai ser Verdadeiro ou Falso.

<?php$cor = “azul”

if( $cor == “azul” ): echo “A cor é azul”;else: echo “A cor não é azul”endif;?>

Page 12: Introducao cms-wordpress

Instruções básicas de php

3.Instrução de repetiçãoAs instruções de repetição são parecidas com as condicionais com uma diferença, elas executam uma instrução enquanto o resultado da expressão condicional que for Verdadeira.

<?php$limit = 1;

while( $limit<=10 ): echo $limit; $limit++;endwhile;?>

While<?phpfor( $x=1; $x<=10; $x++): echo $x;endfor;?>

For

Page 13: Introducao cms-wordpress

Criando temasUm tema de Wordpress é formado por um conjunto de arquivos agrupados dentro de uma pasta e ficam localizados na pasta wp-content/themes da sua instalação do Wordpress.

Para o Wordpress reconhecer este grupo de arquivos como um Tema é necessário seguir algumas regras básicas especificadas pelo Wordpress como nomeclatura dos arquivos .php do thema e comentários especificos em algumas partes específicas dos arquivos de template do tema.

Primeira regra:Agrupar os arquivos mínimos dentro de uma pasta que deve estar localizada na pasta wp-content/themes.

Segunda regra:Os arquivos mínimos necessários para ter um tema reconhecido pelo Wordpres são:Index.php e o style.css e no arquivo style.css é necesário ter um bloco de comentário com as especificações do tema como mostrado abaixo.

/* Theme Name: RoseTheme URI: the-theme's-homepageDescription: a-brief-descriptionAuthor: your-nameAuthor URI: your-URITemplate: use-this-to-define-a-parent-theme--optionalVersion: a-number--optionalTags: a-comma-delimited-list--optional.General comments/License Statement if any..*/

Page 14: Introducao cms-wordpress

Hierarquia de um temaPara criar um bom tema para WordPress, você precisa conhecer bem a estrutura de arquivos que são utilizados no construir estes temas.

Page 15: Introducao cms-wordpress

5. Template tagsAs templates tags são umas das grandes características que tornam o Wordpress uma ferramenta fácil para se trabalhar e produtiva.Elas são funções nativas do Wordpress que realizam diversas instruções. Vamos ver aqui as templates tags mais básicas pois são muitas.

Include TagsAs include tags são usadas nos arquivos de Modelo (por exemplo index.php) para executar HTML e PHP que se encontram em outros arquivos de modelo (por exemplo header.php). PHP possui uma instrução include() para esse fim, mas as tags de modelo do WordPress facilitam bastante a inclusão de certos arquivos específicos. Os arquivos de include devem estar na pasta do tema.

<?php get_header(); //Inclue o arquivo header.php no template ?><?php get_footer(); //Inclue o arquivo footer.php no template ?><?php get_sidebar(); //Inclue o arquivo sidebar.php no template ?><?php get_search_form(); //Inclue o arquivo searchform.php no template ?><?php get_template_part(‘loop’); //Inclue o arquivo loop.php no template ?><?php comments_template(); //Inclue o arquivo comments.php no template ?>

Page 16: Introducao cms-wordpress

Template tags

Condicional TagsO Tags condicionais podem ser usados em seus arquivos de modelo para mudar o conteúdo que é exibido e como esse conteúdo é exibido em uma página específica. Por exemplo, você pode querer exibir um trecho de texto acima dos posts, mas apenas na página principal do seu site. Com a Tag is_home () Condicional, essa tarefa é simples.

Algumas condicionais tags<?php is_home(); //Retorna true (verdadeiro) se estiver na pagina principal. ?><?php is_page(); //Retorna true (verdadeiro) se estiver em um modelo de página. ?><?php is_single(); //Retorna true (verdadeiro) se estiver em um modelo de post. ?><?php is_category(); //Retorna true (verdadeiro) se estiver em um modelo de categoria. ?>

Exemplos de uso

<?phpif( is_home() ): echo “Página principal”;endif;?>

<?phpif( is_category() ): echo “Categoria”;endif;?>

<?phpif( is_category(‘Work’) ): echo “Categoria Work”;endif;?>

Page 17: Introducao cms-wordpress

Bloginfo TagsAs bloginfo tags retornam informações sobre o tema atual utilizado como nome do site, descrição, caminho de pastas entre outras informações.

Algumas bloginfo tags<?php bloginfo(‘name’); ?><?php bloginfo(‘description’); ?><?php bloginfo(‘url’); ?><?php bloginfo(‘template_url’); ?><?php bloginfo(‘stylesheet_url’); ?>

Exemplos de uso<h1> <?php bloginfo(‘name’); ?></h1>

Obs: O Wordpress Codex recomenda o uso da template tag <? echo get_template_directory_uri(); ?> no lugar da <?php bloginfo(‘template_url’); ?>

Template tags

Post TagsOs post tags são funções relacionadas aos posts e páginas como conteúdo, links, classes entre outras funções

Algumas posts tags<?php the_title(); //Imprime o titulo?><?php the_content(); //Imprime o conteudo ?><?php the_excerpt(); //Imprime o resumo ?><?php the_permalink(); //Retorna a url do post?><?php the_post_thumbnail(‘thumbnail’); //Exibe a Imagem destacada do post ?>

Exemplos de uso<h1> <?php the_title(); ?></h1>

Para conhecer todas as templates tags do Wordpress acesse:http://codex.wordpress.org/Template_Tags

Page 18: Introducao cms-wordpress

6. Loop e query postsO loop é a forma mais comum para se exibir o conteúdo do seu site através do seu tema e as query posts é um meio de se filtrar as informações a serem exibidas quando necessário, pos o Wordpress nativamente em cada modelo de página(templates) já executa uma query(filtro) especifica.

Exemplo básico de um loop<?phpif( have_posts() ):

while( have_posts() ): the_post(); ?><div <?php post_class() ?>><h1><a href=”<?php the_permalink() ?>”><?php the_title(); ?></a></h1><?php the_excerpt(); ?><a href=”<?php the_permalink() ?>”>Leia mais...</a></div>

<?php endwhile;else: ?>

<p>Nada foi encontrado</p><?php endif; ?>

Page 19: Introducao cms-wordpress

query postsA função query_posts(); é utilizada para quando você tem a necessidade de alterar a query padrão que é executada pelo Wordpress. Por exemplo no loop da página principal o Wordpress vai listar todos os posts de todas as categorias por ordem cronológica, então se você quiser que na página principal só fossem exibidos os posts de uma categoria específica você precisaria usar a função query_posts(); A funcção query_posts() pode receber vários parametros, vamos mostrar alguns dos mais utilizados.

Exemplo básico de um loop com uma consulta customizada usando a função query_post();<?phpquery_posts(array ( 'category_name' => 'Carros', 'posts_per_page' => 5, 'orderby'=>‘rand’ ));if( have_posts() ):

while( have_posts() ): the_post(); ?><div <?php post_class() ?>><h1><a href=”<?php the_permalink() ?>”><?php the_title(); ?></a></h1><?php the_excerpt(); ?><a href=”<?php the_permalink() ?>”>Leia mais...</a></div>

<?php endwhile;else: ?>

<p>Nada foi encontrado</p><?php endif; ?>

Page 20: Introducao cms-wordpress

query postsPara criar mais de um loop em um mesmo modelo de página é expressamente recomendado não utilizar mais de uma vez a função query_posts(); para criar loops secundaros utilize a função WP_Query(); como no exemplo abaixo;

Exemplo básico de um loop secundario utilizando WP_Query();

<ul><?php$second_query = new WP_Query( 'tag=wordpress&posts_per_page=5' );// loopwhile( $second_query->have_posts() ) : $second_query->the_post(); ?>

<li> <a href=”<?php the_permalink(); ?>”>the_title();</a>

</li><?phpendwhile;wp_reset_postdata();?></ul>

Page 21: Introducao cms-wordpress

ContatoMateus Nevesmateusneves@gmail.comwww.mateusneves.comwww.quarteldesign.com

Documentação completa do Wordpresshttp://codex.wordpress.org