2012
Distrito Federal
2012
Distrito Federal
• Introdução a Web 2.0
• Outsourcing e produtividade
– Blank Template
– Twitter Bootstrap
• Startup | Vamos a prática!
– Extrutura do Template
– Conhecendo o templateDetails.xml
– Empacotamento e Instalação
– Index.php | Nosso maior trabalho…
• Web Tools | Ferramentas eficientes.
SUMÁRIO
2/8
2012
Distrito Federal
A Web 2.0 é uma atitude (an atittude, not a technology)!
É isso que estou fazendo agora:
• compartilhando meu trabalho
• pensamentos e ideias
• abrindo o tema para você acrescentar seu conhecimento
fazer perguntas, discordar
• construir em colaboração, remixar minhas ideias e
informações.
Com base nessa atitude surge o nosso “Template 2.0”!
INTRODUÇÃO A WEB 2.0
3 /8
2012
Distrito Federal
INTRODUÇÃO A WEB 2.0
4 /8
Web
Web 2.0
2012
Distrito Federal
Blank Template:
A luz poderosa e livre para Joomla! Para um
desenvolvimento web mais rápido e mais fácil.
WEB: http://blank.vc/
Twitter Bootstrap:
Um kit completo de componentes de interface
Construído no Twitter por @mdo e @fat, o Bootstrap é
gerenciado pelo GitHub para ajudar os nerds a fazer coisas
incríveis na web.
WEB: http://twitter.github.com/bootstrap/
OUTSOURCING E PRODUTIVIDADE
5 /8
2012
Distrito Federal
STARTUP | VAMOS A PRÁTICA!
6 /8
2012
Distrito Federal
Jetstrap:
Uma ferramenta de construção baseado 100% em web interface para Twitter Bootstrap.
Nenhum software para download, faça o login e construa.
WEB: http://jetstrap.com/
960 Grid:
Sistema de grid baseado em uma largura de 960px, com variantes em 12, 16 ou numero
personalizado de colunas, opcionalmente responsivo.
WEB: http://960.gs/
Blueprint:
Grid fácil de usar, tipografia sensível, plugins úteis, e até mesmo uma folha de estilo para
impressão.
WEB: http://blueprintcss.org/
Firebug :
Integre com o Firefox para colocar um conjunto de ferramentas de desenvolvimento nas
suas mãos enquanto você navega. Você pode editar, depurar e monitorar CSS, HTML e
JavaScript em qualquer página web ...
WEB: https://addons.mozilla.org/pt-br/firefox/addon/firebug/
Twitter Bootstrap – pt-BR:
Esta é uma versão não oficial do Boostrap do Twitter traduzida para o português e mantido
por Alexandre Magno.
WEB: http://alexanmtz.github.com/bootstrap/
WEB TOOLS | FERRAMENTAS EFICIENTES
7 /8
2012
Distrito Federal
CONTATO
8 /8
The Joomla! ® Community Magazine
Tutorial em inglês: http://migre.me/c9KBx

Joomla daydf construindo um templare 2.0

  • 1.
  • 2.
    2012 Distrito Federal • Introduçãoa Web 2.0 • Outsourcing e produtividade – Blank Template – Twitter Bootstrap • Startup | Vamos a prática! – Extrutura do Template – Conhecendo o templateDetails.xml – Empacotamento e Instalação – Index.php | Nosso maior trabalho… • Web Tools | Ferramentas eficientes. SUMÁRIO 2/8
  • 3.
    2012 Distrito Federal A Web2.0 é uma atitude (an atittude, not a technology)! É isso que estou fazendo agora: • compartilhando meu trabalho • pensamentos e ideias • abrindo o tema para você acrescentar seu conhecimento fazer perguntas, discordar • construir em colaboração, remixar minhas ideias e informações. Com base nessa atitude surge o nosso “Template 2.0”! INTRODUÇÃO A WEB 2.0 3 /8
  • 4.
    2012 Distrito Federal INTRODUÇÃO AWEB 2.0 4 /8 Web Web 2.0
  • 5.
    2012 Distrito Federal Blank Template: Aluz poderosa e livre para Joomla! Para um desenvolvimento web mais rápido e mais fácil. WEB: http://blank.vc/ Twitter Bootstrap: Um kit completo de componentes de interface Construído no Twitter por @mdo e @fat, o Bootstrap é gerenciado pelo GitHub para ajudar os nerds a fazer coisas incríveis na web. WEB: http://twitter.github.com/bootstrap/ OUTSOURCING E PRODUTIVIDADE 5 /8
  • 6.
    2012 Distrito Federal STARTUP |VAMOS A PRÁTICA! 6 /8
  • 7.
    2012 Distrito Federal Jetstrap: Uma ferramentade construção baseado 100% em web interface para Twitter Bootstrap. Nenhum software para download, faça o login e construa. WEB: http://jetstrap.com/ 960 Grid: Sistema de grid baseado em uma largura de 960px, com variantes em 12, 16 ou numero personalizado de colunas, opcionalmente responsivo. WEB: http://960.gs/ Blueprint: Grid fácil de usar, tipografia sensível, plugins úteis, e até mesmo uma folha de estilo para impressão. WEB: http://blueprintcss.org/ Firebug : Integre com o Firefox para colocar um conjunto de ferramentas de desenvolvimento nas suas mãos enquanto você navega. Você pode editar, depurar e monitorar CSS, HTML e JavaScript em qualquer página web ... WEB: https://addons.mozilla.org/pt-br/firefox/addon/firebug/ Twitter Bootstrap – pt-BR: Esta é uma versão não oficial do Boostrap do Twitter traduzida para o português e mantido por Alexandre Magno. WEB: http://alexanmtz.github.com/bootstrap/ WEB TOOLS | FERRAMENTAS EFICIENTES 7 /8
  • 8.
    2012 Distrito Federal CONTATO 8 /8 TheJoomla! ® Community Magazine Tutorial em inglês: http://migre.me/c9KBx

Notas do Editor

  • #7 Preparar, apontar, vai!Depois de baixar a última versão:    1. Descompacte o arquivo e renomei a pasta (por exemplo MyTemplate)2. Edite o arquivo templateDetails.xml         Preencha todas as informações         Altere o nome de arquivo dos arquivos de idioma         ("... templatename ..." por "... MyTemplate ...")3. Altere o nome de arquivo dos arquivos de idioma no "línguas" pasta     ("... templatename ..." por "... MyTemplate ...")     4.Substituir as imagens seguintes         template_preview.png         template_thumbnail.png         favicon.icoZip a pasta ddotemplate