- Postagens: 7
- Obrigados Recebidos: 0
[TUTORIAL] 5 passos Convertendo HTML Template para Joomla
14 anos 7 meses atrás #15535
por Neo*
Neo* created the topic: [TUTORIAL] 5 passos Convertendo HTML Template para Joomla
Pessoal resolvi postar este tutorial para ajudar o povo, pois sem que muito é pedido esse assunto...
Esse tutorial é só um quebra galho... Não é uma solução... |Mas sim para vc tirar noções melhores de como proceder na conversão.
E visto também que sou novato no Joomla isso tambem me limita bastante...
5 Easy Steps Convertendo HTML Template para Joomla Template
Convertendo um modelo HTML de um template Joomla não é tão duro como você pensa. Only five easy steps, and you can create and use your Joomla template. Apenas cinco passos simples, e você pode criar e usar o seu template Joomla.
Por que você quer saber isso? porque talvez você tropeça em html livre lindos modelos enquanto navega na net e realmente quiser usá-lo para o seu site com joomla.
Passo 1
Prepare o seu modelo. O modelo deve ser (X) HTML e CSS compliant. Existem muitos modelos HTML na internet, basta procurar-los usando o tio Google. Verifique se o arquivo HTML, imagens e arquivos CSS estão dentro de um único diretório criado em pasta de modelos. Por exemplo, dê uma olhada no template do Joomla estrutura abaixo:
Joomla Template Estrutura de Diretórios
Joomla irá procurar index.php dentro do diretório template. So, rename the index.html file to index.php. Então, renomeie o arquivo index.html para index.php.
Passo 2
Substituir o código HTML antes da tag do corpo do seu arquivo HTML com este código.
Você deve notar neste código:
Alterar your_template_name "para o nome do seu modelo", your_css_directory "ao nome do seu diretório do CSS, eo último," mudança your_css_file.css "ao nome do seu arquivo CSS. Se você tiver mais de um css, você deve declará-los um por um.
Se você tem alguns arquivos javascript, você deve declará-los com a mesma forma.
Passo 3
O padrão Joomla modelo tem algumas posições módulo, como trilha, esquerda, direita, superior, user1, user2, user3, user4, rodapé, depurar sindicato. As posições joomla módulo são mostradas abaixo.
Joomla Module Position
Para criar uma posição de módulo, temos de colocar este código <jdoc:include type="modules" name="your_module_position_name" /> a adequá posição. O atributo name é o nome da posição do módulo. O trecho de código para criar uma posição do módulo é:
Após isso, você precisa colocar um componente. O código é mostrado abaixo.
Se você precisa incluir a mensagem, você só precisa incluir este código:
Passo 4
Criar um arquivo XML. Você precisa criar um arquivo de manifesto para listar todos os arquivos que você usou. Se você não criá-lo, ele irá causar erro durante a instalação do seu modelo. Aqui está o exemplo de um arquivo de manifesto:
Não se esqueça de inscrever todos os seus arquivos usado em seu recém-feito modelo tag arquivos dentro. Se você perdeu, os arquivos não serão copiados para Joomla template diretório durante o processo de instalação. positions tag is used to declare the position name used in your template. tag posições é usado para declarar o nome da posição usada em seu modelo.
Passo 5
Pacote-lo. Você pode criar uma miniatura (thumbnail) do seu modelo antes de embalá-lo. Ela deve ter 206px de largura e 150px de altura e, finalmente, comprimir o seu modelo para um arquivo zip e seu modelo está pronto para ir. Não se esqueça de testá-lo antes de compartilhá-lo à Internet no caso de você sentir como ele.
Fonte: http://www.tobacamp.com/tutorial/5-easy ... -template/
Esse tutorial é só um quebra galho... Não é uma solução... |Mas sim para vc tirar noções melhores de como proceder na conversão.
E visto também que sou novato no Joomla isso tambem me limita bastante...
5 Easy Steps Convertendo HTML Template para Joomla Template
Convertendo um modelo HTML de um template Joomla não é tão duro como você pensa. Only five easy steps, and you can create and use your Joomla template. Apenas cinco passos simples, e você pode criar e usar o seu template Joomla.
Por que você quer saber isso? porque talvez você tropeça em html livre lindos modelos enquanto navega na net e realmente quiser usá-lo para o seu site com joomla.
Passo 1
Prepare o seu modelo. O modelo deve ser (X) HTML e CSS compliant. Existem muitos modelos HTML na internet, basta procurar-los usando o tio Google. Verifique se o arquivo HTML, imagens e arquivos CSS estão dentro de um único diretório criado em pasta de modelos. Por exemplo, dê uma olhada no template do Joomla estrutura abaixo:
Joomla Template Estrutura de Diretórios
Joomla irá procurar index.php dentro do diretório template. So, rename the index.html file to index.php. Então, renomeie o arquivo index.html para index.php.
Passo 2
Substituir o código HTML antes da tag do corpo do seu arquivo HTML com este código.
#
<? php
#
#
// no direct access / / No acesso directo
#
defined( '_JEXEC' ) or die( 'Restricted access' ); defined ( '_JEXEC') or die ( 'Acesso restrito');
#
?> ?>
#
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> DOCTYPE html PUBLIC "- / / W3C / / DTD XHTML 1.0 Transitional / / EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
#
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" > <html xmlns = "http://www.w3.org/1999/xhtml" xml: lang = "<? php echo $ this-> language;?>" lang = "<? php echo $ this-> language; ?> ">
#
<head> <head>
#
<jdoc:include type="head" /> <jdoc:include type="head" />
#
#
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" /> <link rel = "stylesheet" href = "<? php echo $ this-> baseurl?> / templates / system / CSS / system.css" type = "text / css" />
#
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" /> <link rel = "stylesheet" href = "<? php echo $ this-> baseurl?> / templates / system / CSS / general.css" type = "text / css" />
#
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/your_template_name/your_css_directory/your_css_file.css" type="text/css" /> <link rel = "stylesheet" href = "<? php echo $ this-> baseurl?> / templates / your_template_name / your_css_directory / your_css_file.css" type = "text / css" />
#
#
</head> </ head>Você deve notar neste código:
Alterar your_template_name "para o nome do seu modelo", your_css_directory "ao nome do seu diretório do CSS, eo último," mudança your_css_file.css "ao nome do seu arquivo CSS. Se você tiver mais de um css, você deve declará-los um por um.
Se você tem alguns arquivos javascript, você deve declará-los com a mesma forma.
<link rel = "stylesheet" href = "<? php echo $ this-> baseurl?> / templates / your_template_name / your_css_directory / your_css_file.css" type = "text / css" />Passo 3
O padrão Joomla modelo tem algumas posições módulo, como trilha, esquerda, direita, superior, user1, user2, user3, user4, rodapé, depurar sindicato. As posições joomla módulo são mostradas abaixo.
Joomla Module Position
Para criar uma posição de módulo, temos de colocar este código <jdoc:include type="modules" name="your_module_position_name" /> a adequá posição. O atributo name é o nome da posição do módulo. O trecho de código para criar uma posição do módulo é:
#
<div id="header_r">
#
<div id="logo"></div> <div id="logo"> </ div>
#
<jdoc:include type="modules" name="top" /> <jdoc:include type="modules" name="top" />
#
</div> </ div>Após isso, você precisa colocar um componente. O código é mostrado abaixo.
<jdoc:include type="component" />Se você precisa incluir a mensagem, você só precisa incluir este código:
<jdoc:include type="message" />Passo 4
Criar um arquivo XML. Você precisa criar um arquivo de manifesto para listar todos os arquivos que você usou. Se você não criá-lo, ele irá causar erro durante a instalação do seu modelo. Aqui está o exemplo de um arquivo de manifesto:
#
<? xml version = "1.0" encoding = "UTF-8"?
#
<!DOCTYPE install PUBLIC "-//Joomla! 1.5//DTD template 1.0//EN" "http://dev.joomla.org/xml/1.5/template-install.dtd"> DOCTYPE instalar PUBLIC "- / / Joomla! 1,5 / / DTD modelo 1.0 / / EN" "http://dev.joomla.org/xml/1.5/template-install.dtd">
#
<install version = "1.5" type = "template" > versão <install = tipo "1.5" = "template">
#
<name > your_template_name </name > <nome> your_template_name </ name>
#
<creationDate > 25/01/2009 </creationDate > <creationDate> 25/01/2009 </ creationDate>
#
<author > Dani Gunawan </author > <author> Dani Gunawan </ author>
#
<authorEmail > dani.gunawan@yahoo.com </authorEmail > <authorEmail> dani.gunawan @ yahoo.com </ authorEmail>
#
<authorUrl > http://tobacamp.com </authorUrl > <authorUrl> http://tobacamp.com </ authorUrl>
#
<copyright > </copyright > <copyright> </ copyright>
#
<license > GNU/GPL </license > <license> GNU / GPL </ license>
#
<version > 1.0.0 </version > <version> 1.0.0 </ version>
#
<description > template description goes here </description > <description> template descrição vai aqui </ description>
#
<files > <arquivos>
#
<filename > index.php </filename > <filename> index.php </ filename>
#
<filename > templateDetails.xml </filename > <filename> templateDetails.xml </ filename>
#
<filename > template_thumbnail.png </filename > <filename> template_thumbnail.png </ filename>
#
<filename > images/arrow.png </filename > <filename> images / arrow.png </ filename>
#
<filename > images/logo.png </filename > <filename> images / logo.png </ filename>
#
<filename > css/template.css </filename > <filename> CSS / template.css </ filename>
#
</files > </ files>
#
<positions > <positions>
#
<position > breadcrumb </position > <position> breadcrumb </ position>
#
<position > left </position > <position> left </ position>
#
<position > right </position > <position> right </ position>
#
<position > top </position > <position> top </ position>
#
<position > user1 </position > <position> user1 </ position>
#
<position > user2 </position > <position> user2 </ position>
#
<position > user3 </position > <position> user3 </ position>
#
<position > user4 </position > <position> user4 </ position>
#
<position > footer </position > <position> footer </ position>
#
<position > debug </position > <position> debug </ position>
#
<position > syndicate </position > <position> syndicate </ position>
#
</positions > </ posições>
#
</install > </ install>Não se esqueça de inscrever todos os seus arquivos usado em seu recém-feito modelo tag arquivos dentro. Se você perdeu, os arquivos não serão copiados para Joomla template diretório durante o processo de instalação. positions tag is used to declare the position name used in your template. tag posições é usado para declarar o nome da posição usada em seu modelo.
Passo 5
Pacote-lo. Você pode criar uma miniatura (thumbnail) do seu modelo antes de embalá-lo. Ela deve ter 206px de largura e 150px de altura e, finalmente, comprimir o seu modelo para um arquivo zip e seu modelo está pronto para ir. Não se esqueça de testá-lo antes de compartilhá-lo à Internet no caso de você sentir como ele.
Fonte: http://www.tobacamp.com/tutorial/5-easy ... -template/
