SlideShare uma empresa Scribd logo
1 de 11
Treinamento Interno
Wordpress
Montagem
Sumário
● Ferramentas necessárias
● Criação de um tema filho
● Configuração básica do tema
● Arquivos principais do tema
● Estrutura de uma página Wordpress
● Análise da programação visual
● Montagem das páginas
Ferramentas necessárias
Para realizar a montagem serão necessárias as seguintes
ferramentas:
● Editor de textos
– Notepad++ (http://notepad-plus-plus.org/download/v6.4.5.html)
– Geany (http://www.geany.org/Download/Releases)
● Editor de imagens
– Photoshop
● Cliente FTP
– FlashFXP
Criação de um tema filho
O que é um tema filho?
– É um tema que utiliza-se de um tema preexistente (tema
pai) para incorporar características;
Porque usar um tema filho?
– Permite que as partes principais sejam mantidas,
necessitando apenas modificar as partes que são
efetivamente diferentes;
– Evita a duplicação e retrabalho;
Criação de um tema filho
● Diretório do tema;
● Arquivo de estilo (style.css);
/*
Theme Name: Twenty Thirteen Child
Theme URI: http://example.com/
Description: Child theme for the Twenty Thirteen theme
Author: Your name here
Author URI: http://example.com/about/
Template: twentythirteen
Version: 0.1.0
*/
● Importação do estilo pai
@import url("../twentythirteen/style.css");
Configuração básica do tema
● Adição de estilo específico para o IE;
● Desativação de opções de customização;
● Ações executadas na ativação do tema;
● Ações executadas na inicialização do tema;
● Funções auxiliares;
Arquivos principais do tema
● style.css
– Estilização padrão do tema;
● /css/ie.css
– Estilização para IE6, IE7 e IE8;
● Functions.php
– Funções para execução do tema;
Arquivos principais do tema
● Header.php
– Área de cabeçalho
● 404.php
– Página de erro para conteúdo não encontrado;
● Content.php
– Exibição dos conteúdos (exceto para páginas);
● Content-page.php
– Exibição dos conteúdos de páginas;
● Footer.php
– Área de rodapé
Estrutura de uma página Wordpress
● Modelo base de uma página Wordpress:
Análise da programação visual
● Caminho para acessar os arquivos da programação
visual:
– http://escolatestewp.educacional.net/site/material-
treinamento-14092013/
Montagem das páginas
● Serão montadas as seguintes páginas:
– Home
– Interna
– Fale conosco
– Postagem
– Listagem de notícias
– Erro
– Resultado da pesquisa

Mais conteúdo relacionado

Mais procurados

Otimize sua web page e web components
Otimize sua web page e web componentsOtimize sua web page e web components
Otimize sua web page e web componentsAndré Betiolo
 
WordPress: De blogs pessoais a grandes portais - Parte 2
WordPress: De blogs pessoais a grandes portais - Parte 2WordPress: De blogs pessoais a grandes portais - Parte 2
WordPress: De blogs pessoais a grandes portais - Parte 2Giancarlo Silva
 
Clean code: programando com WordPress de forma profissional
Clean code: programando com WordPress de forma profissionalClean code: programando com WordPress de forma profissional
Clean code: programando com WordPress de forma profissionalLeo Baiano
 
Performance e otimização no wordpress
Performance e otimização no wordpressPerformance e otimização no wordpress
Performance e otimização no wordpressDaniel Paz
 
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014Celso Fernandes
 
Hierarquia de templates WordPress
Hierarquia de templates WordPressHierarquia de templates WordPress
Hierarquia de templates WordPressGuga Alves
 
Site profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmailSite profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmailEmersonGonalves43
 
Workshop Web e WordPress
Workshop Web e WordPressWorkshop Web e WordPress
Workshop Web e WordPressHaste Design
 
Wordpress e suas funções
Wordpress e suas funçõesWordpress e suas funções
Wordpress e suas funçõesDaniel Marcos
 
Traduções no WordPress
Traduções no WordPressTraduções no WordPress
Traduções no WordPressBreno Alves
 
Trabalhando com posts e campos personalizados #CPBR9
Trabalhando com posts e campos personalizados #CPBR9Trabalhando com posts e campos personalizados #CPBR9
Trabalhando com posts e campos personalizados #CPBR9Rafael Funchal
 
SEO - Otimização de Sites
SEO - Otimização de SitesSEO - Otimização de Sites
SEO - Otimização de SitesRicardo Martins
 
Design para WordPress- Anyssa Ferreira - WordCamp BH 2015
Design para WordPress-  Anyssa Ferreira - WordCamp BH 2015Design para WordPress-  Anyssa Ferreira - WordCamp BH 2015
Design para WordPress- Anyssa Ferreira - WordCamp BH 2015Anyssa Ferreira
 
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel  - Core web vitals e WordPressWordCamp Floripa 2021 - Daniel  - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPressWordCamp Floripa
 
Construindo sites e sistemas com WordPress
Construindo sites e sistemas com WordPressConstruindo sites e sistemas com WordPress
Construindo sites e sistemas com WordPressLeo Baiano
 
Webdesign: construindo páginas com HTML
Webdesign: construindo páginas com HTMLWebdesign: construindo páginas com HTML
Webdesign: construindo páginas com HTMLJosé Pirauá
 
O Básico para criar Sites Otimizados em Elementor
O Básico para criar Sites Otimizados em ElementorO Básico para criar Sites Otimizados em Elementor
O Básico para criar Sites Otimizados em ElementorDaniel Paz
 
Ebook - Processo de Otimização de Sites WordPress
Ebook - Processo de Otimização de Sites WordPressEbook - Processo de Otimização de Sites WordPress
Ebook - Processo de Otimização de Sites WordPressDaniel Paz
 

Mais procurados (20)

Otimize sua web page e web components
Otimize sua web page e web componentsOtimize sua web page e web components
Otimize sua web page e web components
 
WordPress: De blogs pessoais a grandes portais - Parte 2
WordPress: De blogs pessoais a grandes portais - Parte 2WordPress: De blogs pessoais a grandes portais - Parte 2
WordPress: De blogs pessoais a grandes portais - Parte 2
 
Clean code: programando com WordPress de forma profissional
Clean code: programando com WordPress de forma profissionalClean code: programando com WordPress de forma profissional
Clean code: programando com WordPress de forma profissional
 
Performance e otimização no wordpress
Performance e otimização no wordpressPerformance e otimização no wordpress
Performance e otimização no wordpress
 
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
 
Hierarquia de templates WordPress
Hierarquia de templates WordPressHierarquia de templates WordPress
Hierarquia de templates WordPress
 
Site profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmailSite profissional em wordpress - emerson01@gmail
Site profissional em wordpress - emerson01@gmail
 
Codando com PHP e JQuery
Codando com PHP e JQueryCodando com PHP e JQuery
Codando com PHP e JQuery
 
Workshop Web e WordPress
Workshop Web e WordPressWorkshop Web e WordPress
Workshop Web e WordPress
 
Wordpress e suas funções
Wordpress e suas funçõesWordpress e suas funções
Wordpress e suas funções
 
Traduções no WordPress
Traduções no WordPressTraduções no WordPress
Traduções no WordPress
 
Trabalhando com posts e campos personalizados #CPBR9
Trabalhando com posts e campos personalizados #CPBR9Trabalhando com posts e campos personalizados #CPBR9
Trabalhando com posts e campos personalizados #CPBR9
 
SEO - Otimização de Sites
SEO - Otimização de SitesSEO - Otimização de Sites
SEO - Otimização de Sites
 
Design para WordPress- Anyssa Ferreira - WordCamp BH 2015
Design para WordPress-  Anyssa Ferreira - WordCamp BH 2015Design para WordPress-  Anyssa Ferreira - WordCamp BH 2015
Design para WordPress- Anyssa Ferreira - WordCamp BH 2015
 
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel  - Core web vitals e WordPressWordCamp Floripa 2021 - Daniel  - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPress
 
Construindo sites e sistemas com WordPress
Construindo sites e sistemas com WordPressConstruindo sites e sistemas com WordPress
Construindo sites e sistemas com WordPress
 
03 windows
03   windows03   windows
03 windows
 
Webdesign: construindo páginas com HTML
Webdesign: construindo páginas com HTMLWebdesign: construindo páginas com HTML
Webdesign: construindo páginas com HTML
 
O Básico para criar Sites Otimizados em Elementor
O Básico para criar Sites Otimizados em ElementorO Básico para criar Sites Otimizados em Elementor
O Básico para criar Sites Otimizados em Elementor
 
Ebook - Processo de Otimização de Sites WordPress
Ebook - Processo de Otimização de Sites WordPressEbook - Processo de Otimização de Sites WordPress
Ebook - Processo de Otimização de Sites WordPress
 

Semelhante a Treinamento 20130914

Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...
Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...
Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...WordCamp Floripa
 
Faça seu portal voar usando o plone.app.caching
Faça seu portal voar usando o plone.app.cachingFaça seu portal voar usando o plone.app.caching
Faça seu portal voar usando o plone.app.cachingFabiano Weimar
 
Drupal - Um site com sua cara
Drupal - Um site com sua caraDrupal - Um site com sua cara
Drupal - Um site com sua carapedrofaria
 
Como criar um tema para WordPress
Como criar um tema para WordPressComo criar um tema para WordPress
Como criar um tema para WordPressRafael Funchal
 
Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...
Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...
Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...Anyssa Ferreira
 
Cakephp - framework de desenvolvimento de aplicações Web em PHP
Cakephp - framework de desenvolvimento de aplicações Web em PHPCakephp - framework de desenvolvimento de aplicações Web em PHP
Cakephp - framework de desenvolvimento de aplicações Web em PHPArlindo Santos
 
WordPress da instalação à criação de temas personalizados para seu site
WordPress da instalação à criação de temas personalizados para seu siteWordPress da instalação à criação de temas personalizados para seu site
WordPress da instalação à criação de temas personalizados para seu siteFlávio Ricardo B. Meira
 
Curso de Wordpress - Do Zero ao Site no Ar
Curso de Wordpress - Do Zero ao Site no ArCurso de Wordpress - Do Zero ao Site no Ar
Curso de Wordpress - Do Zero ao Site no ArRenzo Colnago
 
Wordpress - Introdução
Wordpress - IntroduçãoWordpress - Introdução
Wordpress - IntroduçãoRennan Martini
 
WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...
WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...
WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...George Mendonça
 
Iniciando com o_zend_framework
Iniciando com o_zend_frameworkIniciando com o_zend_framework
Iniciando com o_zend_frameworkMilton Rodrigues
 
Otimização Front-end para WordPress
Otimização Front-end para WordPressOtimização Front-end para WordPress
Otimização Front-end para WordPressGuga Alves
 
Wordpress além do blog
Wordpress além do blogWordpress além do blog
Wordpress além do blogMateus Neves
 
Magento Gerencimento e Customização de Temas
Magento Gerencimento e Customização de TemasMagento Gerencimento e Customização de Temas
Magento Gerencimento e Customização de TemasVanessa Me Tonini
 
Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03Tersis Zonato
 
Adeus Wordpress. Ola Pelican!
Adeus Wordpress. Ola Pelican!Adeus Wordpress. Ola Pelican!
Adeus Wordpress. Ola Pelican!magnunleno
 

Semelhante a Treinamento 20130914 (20)

Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...
Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...
Meetup WordPress Floripa - Criando tema filho com configuração de SEO e ferra...
 
Faça seu portal voar usando o plone.app.caching
Faça seu portal voar usando o plone.app.cachingFaça seu portal voar usando o plone.app.caching
Faça seu portal voar usando o plone.app.caching
 
Drupal - Um site com sua cara
Drupal - Um site com sua caraDrupal - Um site com sua cara
Drupal - Um site com sua cara
 
Php11
Php11Php11
Php11
 
Como criar um tema para WordPress
Como criar um tema para WordPressComo criar um tema para WordPress
Como criar um tema para WordPress
 
Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...
Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...
Instalando o WordPress local em qualquer sistema operacional - Anyssa Ferreir...
 
Cakephp - framework de desenvolvimento de aplicações Web em PHP
Cakephp - framework de desenvolvimento de aplicações Web em PHPCakephp - framework de desenvolvimento de aplicações Web em PHP
Cakephp - framework de desenvolvimento de aplicações Web em PHP
 
WordPress da instalação à criação de temas personalizados para seu site
WordPress da instalação à criação de temas personalizados para seu siteWordPress da instalação à criação de temas personalizados para seu site
WordPress da instalação à criação de temas personalizados para seu site
 
Curso de Wordpress - Do Zero ao Site no Ar
Curso de Wordpress - Do Zero ao Site no ArCurso de Wordpress - Do Zero ao Site no Ar
Curso de Wordpress - Do Zero ao Site no Ar
 
Wordpress - Introdução
Wordpress - IntroduçãoWordpress - Introdução
Wordpress - Introdução
 
Aula30 trevisan
Aula30 trevisanAula30 trevisan
Aula30 trevisan
 
WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...
WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...
WordPress para Desenvolvedores - Utilizando WP como framework de desenvolvime...
 
Iniciando com o_zend_framework
Iniciando com o_zend_frameworkIniciando com o_zend_framework
Iniciando com o_zend_framework
 
Otimização Front-end para WordPress
Otimização Front-end para WordPressOtimização Front-end para WordPress
Otimização Front-end para WordPress
 
Joomla desenvolvimento
Joomla desenvolvimentoJoomla desenvolvimento
Joomla desenvolvimento
 
Minicurso Web. Front-end e HTML5 (parte 2)
Minicurso Web. Front-end e HTML5 (parte 2)Minicurso Web. Front-end e HTML5 (parte 2)
Minicurso Web. Front-end e HTML5 (parte 2)
 
Wordpress além do blog
Wordpress além do blogWordpress além do blog
Wordpress além do blog
 
Magento Gerencimento e Customização de Temas
Magento Gerencimento e Customização de TemasMagento Gerencimento e Customização de Temas
Magento Gerencimento e Customização de Temas
 
Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03Sistemas Corporativos Web - WordPress Aula03
Sistemas Corporativos Web - WordPress Aula03
 
Adeus Wordpress. Ola Pelican!
Adeus Wordpress. Ola Pelican!Adeus Wordpress. Ola Pelican!
Adeus Wordpress. Ola Pelican!
 

Treinamento 20130914

  • 2. Sumário ● Ferramentas necessárias ● Criação de um tema filho ● Configuração básica do tema ● Arquivos principais do tema ● Estrutura de uma página Wordpress ● Análise da programação visual ● Montagem das páginas
  • 3. Ferramentas necessárias Para realizar a montagem serão necessárias as seguintes ferramentas: ● Editor de textos – Notepad++ (http://notepad-plus-plus.org/download/v6.4.5.html) – Geany (http://www.geany.org/Download/Releases) ● Editor de imagens – Photoshop ● Cliente FTP – FlashFXP
  • 4. Criação de um tema filho O que é um tema filho? – É um tema que utiliza-se de um tema preexistente (tema pai) para incorporar características; Porque usar um tema filho? – Permite que as partes principais sejam mantidas, necessitando apenas modificar as partes que são efetivamente diferentes; – Evita a duplicação e retrabalho;
  • 5. Criação de um tema filho ● Diretório do tema; ● Arquivo de estilo (style.css); /* Theme Name: Twenty Thirteen Child Theme URI: http://example.com/ Description: Child theme for the Twenty Thirteen theme Author: Your name here Author URI: http://example.com/about/ Template: twentythirteen Version: 0.1.0 */ ● Importação do estilo pai @import url("../twentythirteen/style.css");
  • 6. Configuração básica do tema ● Adição de estilo específico para o IE; ● Desativação de opções de customização; ● Ações executadas na ativação do tema; ● Ações executadas na inicialização do tema; ● Funções auxiliares;
  • 7. Arquivos principais do tema ● style.css – Estilização padrão do tema; ● /css/ie.css – Estilização para IE6, IE7 e IE8; ● Functions.php – Funções para execução do tema;
  • 8. Arquivos principais do tema ● Header.php – Área de cabeçalho ● 404.php – Página de erro para conteúdo não encontrado; ● Content.php – Exibição dos conteúdos (exceto para páginas); ● Content-page.php – Exibição dos conteúdos de páginas; ● Footer.php – Área de rodapé
  • 9. Estrutura de uma página Wordpress ● Modelo base de uma página Wordpress:
  • 10. Análise da programação visual ● Caminho para acessar os arquivos da programação visual: – http://escolatestewp.educacional.net/site/material- treinamento-14092013/
  • 11. Montagem das páginas ● Serão montadas as seguintes páginas: – Home – Interna – Fale conosco – Postagem – Listagem de notícias – Erro – Resultado da pesquisa