Introdução ao ContentManagement System:   Ari Stopassola Junior       @stopassola
Características• Criado pelo dinamarquês Kasper Skårhøj em 1997• Gerenciador de conteúdo open source muito  popular na Eur...
Equipe brasileira de tradução do             Typo3
Preparando a instalação1. Acesse o phpMyAdmin do Zend Server   CE:   http://localhost:10081/phpmyadmin/2. Se logue como us...
Instalação1. Identifique o usuário default do Apache (no   Zend Server) para atribuirmos permissões:   more /usr/local/zen...
Diferença entre pacotes• Pacote source permite uma única instalação  Typo3 suprindo vários sites• Os sites utilizam seu pr...
Abra o assistente de instalação:     http://localhost/portal/    Alerta: problema de        permissões
Siga as etapashttp://localhost/portal/
Componentes do Typo3• Frontend:  http://localhost/portal/ Erro?!• Backend  http://localhost/portal/typo3/  login admin  se...
Extensões: TemplaVoilà!1. Clique em "Extension Manager”2. Aba "Import extensions”3. Retrieve / Update4. Faça uma busca por...
Certifique-se de chegar até           aqui…
Templates (modelos)Construa em tableless ou baixe um modelo pronto:• http://wiki.typo3.org/TYPO3_templates_repository• htt...
Incorporando o modelo ao gestor• Baixe o template “Abundant” (por exemplo)  do site Typo3Coder.com• Descomprima o .zip• Co...
AlertaPara cada mudança mais significativa deconteúdo é recomendado limpar todo tipo decache do sistema – para que as alte...
Continuação…• Após a varredura de todos os templates  disponíveis, o “Step 1” mostra um  index.html  Clique em [Choose as ...
AlertaError: No Data Structure Record could be found with UID                          "x"!          Erro!Se ocorrer algum...
Step 3: Mapeamento1              Comece o             mapeamento
Mapeamento (continuação)Elementos básicos gerenciáveis pelo               CMS 2
Altere o modo de visualização3
Identifique o elemento3
Se o conteúdo dinâmico deve    preservar (ou não) a respectiva                 <div>4
Repetir o processo para os demais       elementos da página   Ex.: Main menu  <div id="menu">             E por fim…
Step 4: cabeçalhos1.   Pressione “Select HTML header parts”2.   Clique na aba “Header Parts”3.   Marque todos os itens4.  ...
Step 5: TypoScript gerado automaticamentepara construção do menu/submenu dinâmico(s)
Quanto o sub-menu não éidentificado na estrutura do HTML
1    2        3
Próximos tópicos• Mapeamento de novas áreas do site• Tipos de conteúdo: imagens, vídeos, contato e  busca• Construção de s...
Referências
ContatosE-mail:  stopassola@acimainteractive.com  ari.junior@ist.utl.ptMSN: stopassola@hotmail.comSkype: stopassolaGoogle ...
Próximos SlideShares
Carregando em…5
×

Typo3 - instalação e template

1.946 visualizações

Publicada em

Apresentação sobre Typo3 - gestor de conteúdo muito popular na Europa, com mais de 5 mil extensões, open source, feito em PHP

Publicada em: Educação
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
1.946
No SlideShare
0
A partir de incorporações
0
Número de incorporações
2
Ações
Compartilhamentos
0
Downloads
17
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide
  • http://wiki.typo3.org/Brazilian-Translation-Team
  • Éprecisoatribuirumasenhapara o usuário root do MySQL, poissemele o Typo3 nãoavança (mesmoquenãohajaumasenhadefinida).
  • Versãoatualé a 4.6.3Aoidentificar o usuario do Apache no Linux Ubuntu (11.10) éprecisoaveriguar o arquivo /etc/apache2/envvars (emgeralé o “www-data”)
  • Gerando um erro:Error: No Data Structure Record could be found with UID &quot;1&quot;!
  • Typo3 - instalação e template

    1. 1. Introdução ao ContentManagement System: Ari Stopassola Junior @stopassola
    2. 2. Características• Criado pelo dinamarquês Kasper Skårhøj em 1997• Gerenciador de conteúdo open source muito popular na Europa• Implementado em PHP• Repositório com mais de 5.000 extensões• Suporta TypoScript – linguagem própria interna• Cases: Lufthansa, UNESCO, Omega, MediaMarkt, BASF, AirBus, Ford, Europcar, Unicef, Sanyo, Lidl, Vodafone, Harward, Greenpeace, Pizza Hut, Revell e muito mais*
    3. 3. Equipe brasileira de tradução do Typo3
    4. 4. Preparando a instalação1. Acesse o phpMyAdmin do Zend Server CE: http://localhost:10081/phpmyadmin/2. Se logue como usuário root (sem senha) Atribua uma nova senha
    5. 5. Instalação1. Identifique o usuário default do Apache (no Zend Server) para atribuirmos permissões: more /usr/local/zend/apache2/conf/httpd.conf2. Baixe o pacote “Source + Dummy”: http://typo3.org/download/packages/3. Descompacte, renomeie a pasta e acesse-a via terminal. Execute os seguintes comandos: sudo chgrp -R daemon fileadmin typo3temp typo3conf uploads sudo chmod -R g+rwX,o-w fileadmin typo3temp typo3conf uploads touch typo3conf/ENABLE_INSTALL_TOOL
    6. 6. Diferença entre pacotes• Pacote source permite uma única instalação Typo3 suprindo vários sites• Os sites utilizam seu próprio dummy (esqueleto)• Para uso compartilhado aponte os diretórios em dummy (através de links simbólicos) para seus correspondentes em source
    7. 7. Abra o assistente de instalação: http://localhost/portal/ Alerta: problema de permissões
    8. 8. Siga as etapashttp://localhost/portal/
    9. 9. Componentes do Typo3• Frontend: http://localhost/portal/ Erro?!• Backend http://localhost/portal/typo3/ login admin senha password
    10. 10. Extensões: TemplaVoilà!1. Clique em "Extension Manager”2. Aba "Import extensions”3. Retrieve / Update4. Faça uma busca por “templavoila” e clique no ícone (da peça de lego) para importar5. Ele foi importado mas ainda falta instalar – clique no ícone6. Atenda as dependências - “import now”, “install now” e “Make updates” (jamais ignore um pré- requisito): – static_info_tables7. Verifique a instalação e faça as mudanças
    11. 11. Certifique-se de chegar até aqui…
    12. 12. Templates (modelos)Construa em tableless ou baixe um modelo pronto:• http://wiki.typo3.org/TYPO3_templates_repository• http://www.layoutstemplatesdirectory.com/free- templates-layouts-sites/list-of-sites-that-offer-free- typo3-templates-skins-themes/• http://www.typo3coder.com/ Dê preferência os modelos em tableless
    13. 13. Incorporando o modelo ao gestor• Baixe o template “Abundant” (por exemplo) do site Typo3Coder.com• Descomprima o .zip• Copie o subdiretório “template” para o diretório “fileadmin” na instalação do Typo3• Renomeie o diretório de “template” (singular) para “templates” (no plural)• Clique em WEB  “TemplaVoilà!” (menu a esquerda) e pressione o botão “Start wizard now!”
    14. 14. AlertaPara cada mudança mais significativa deconteúdo é recomendado limpar todo tipo decache do sistema – para que as alteraçõessejam percebidas:1. Clique em “Clear cache”“Clear all caches”2. Se a mensagem persistir, vá em “Extension Manager”, localize o
    15. 15. Continuação…• Após a varredura de todos os templates disponíveis, o “Step 1” mostra um index.html Clique em [Choose as Template]• Preencha com os dados do site: – Título – Endereço – Usuário administrativo• Pressione o botão “Create new site”• Clique em “Start the mapping process”
    16. 16. AlertaError: No Data Structure Record could be found with UID "x"! Erro!Se ocorrer algum erro no assistente doTemplaVoilà! (passo 3) interrompa oprocesso, remova a extensão (inclusive a suadependência: static_info_tables) e certifique-sede que as mudanças propostas pelo instaladortenham sido realmente efetivadas –principalmente aquela que trata do charset
    17. 17. Step 3: Mapeamento1 Comece o mapeamento
    18. 18. Mapeamento (continuação)Elementos básicos gerenciáveis pelo CMS 2
    19. 19. Altere o modo de visualização3
    20. 20. Identifique o elemento3
    21. 21. Se o conteúdo dinâmico deve preservar (ou não) a respectiva <div>4
    22. 22. Repetir o processo para os demais elementos da página Ex.: Main menu  <div id="menu"> E por fim…
    23. 23. Step 4: cabeçalhos1. Pressione “Select HTML header parts”2. Clique na aba “Header Parts”3. Marque todos os itens4. Pressione “Save and return”
    24. 24. Step 5: TypoScript gerado automaticamentepara construção do menu/submenu dinâmico(s)
    25. 25. Quanto o sub-menu não éidentificado na estrutura do HTML
    26. 26. 1 2 3
    27. 27. Próximos tópicos• Mapeamento de novas áreas do site• Tipos de conteúdo: imagens, vídeos, contato e busca• Construção de sub-menu multi-nível flutuante (CSS)• Novas extensões: CoolURI, Comments, News etc• Conteúdo restrito (frontend) para usuários autorizados• Suporte a multi-idiomas• SEO – Search Engine Optimization• Favorite icon, mapa do site, “onde estou” e
    28. 28. Referências
    29. 29. ContatosE-mail: stopassola@acimainteractive.com ari.junior@ist.utl.ptMSN: stopassola@hotmail.comSkype: stopassolaGoogle Talk: arijunior@gmail.comRedes sociais: http://pt.linkedin.com/in/stopassola http://www.facebook.com/arijunior http://twitter.com/stopassola

    ×