<?xml version="1.0" encoding="UTF-8" ?>

<chapter id="using-quanta-3-2">
<chapterinfo>
<title
>Trabalhar Com...</title>
<authorgroup>
<author
><firstname
>Robert</firstname
> <surname
>Nickel</surname
> <affiliation
> <address
><email
>robert@artnickel.com</email
></address>
</affiliation>
</author>

<othercredit role="reviewer"
><firstname
>Christopher</firstname
> <surname
>Hornbaker</surname
> <affiliation
> <address
><email
>chrishornbaker@earthlink.net</email
></address>
</affiliation>
<contrib
>Revisão</contrib>
</othercredit>

<othercredit role="reviewer"
><firstname
>Fabrice</firstname
> <surname
>Mous</surname
> <affiliation
> <address
><email
>fabrice@kde.nl</email
></address>
</affiliation>
<contrib
>Revisão</contrib>
</othercredit>

<othercredit role="translator"
><firstname
>Pedro</firstname
><surname
>Morais</surname
><affiliation
><address
><email
>morais@kde.org</email
></address
></affiliation
><contrib
>Tradução</contrib
></othercredit
> 

</authorgroup>
</chapterinfo>

<title
>Trabalhar Com...</title>

<para
>Este capítulo descreve as partes do &quantaplus; com as quais você irá interagir mais vezes. Estas não só o tornam mais produtivo, mas também lhe permitem personalizar o &quantaplus; de acordo com o seu ritmo de trabalho. </para>

<sect1 id="toolbars-howto-3-2">
<title
>Barras de Ferramentas</title>

<para
>Como foi referido anteriormente, as barras de ferramentas no &quantaplus; são geridas em primeiro lugar no menu <menuchoice
><guimenu
>Barras de Ferramentas</guimenu
> </menuchoice
>. A sua utilização e criação são feitas de forma diferente. A criação vai ser deixada para uma secção posterior chamada <quote
><link linkend="creating-toolbars-3-2"
>Criar Barras de Ferramentas</link
>.</quote
> </para>

<para
>A utilização das barras de ferramentas é muito simples. Carregue no ícone da 'tag' desejada para que aconteça uma de três possibilidades: a 'tag' é inserida (opcionalmente com uma 'tag' de fecho) (p.ex. a 'tag' de negrito em HTML), é activa uma janela da 'tag' para que possa preencher as várias funcionalidades da mesma (p.ex., a 'tag' de âncora de HTML) e, por último, é activada uma acção que faça algo de útil no seu projecto/ficheiro/o que for. Se você achar que está a fazer trabalho cansativo e redundante para um determinado elemento que não se encontre no &quantaplus;, então poderá adicioná-lo. Veja em <xref linkend="dtep-intro-3-2"/> como obter mais informações. </para>

<para
>Uma janela de 'tags' ou marcas assemelha-se à seguinte: <mediaobject>
<imageobject>
<imagedata fileref="taginputex.png" format="PNG"/>
</imageobject>
<caption
><para
>Um exemplo de uma janela de marca.</para
></caption>
</mediaobject>
</para>

<para
>A imagem acima é a janela para as marcas de âncoras. Se você perceber de &XHTML;, então deverá já ter reparado que todos os atributos que você pode usar, num elemento de âncora, estão disponíveis. Repare nas páginas em cima para o <guilabel
>Principal</guilabel
>, <guilabel
>Básico e i18n</guilabel
>, <guilabel
>Eventos</guilabel
> e <guilabel
>Foco</guilabel
>; todas elas contêm os outros atributos, de acordo com o seu fim, que estão disponíveis para o elemento de âncora. Tudo o que você tem a fazer é: preencher os campos em branco para os atributos que deseja na sua âncora, omitir os atributos que não deseja e carregar em OK. A partir de agora passará a ter uma âncora configurada na posição actual do cursor. </para>
</sect1>
&quanta-projects; <sect1 id="templates-3-2">
<title
>Modelos</title>

<para
>Os modelos não são mais do que documentos-esqueleto, pedaços de código e ficheiros com os quais fazer a associação. O &quanta; usa os modelos fundamentalmente como um sistema de ficheiros padrão com uma organização e interface melhorada. O utilizador poderá copiar, mover ou criar uma ligação a qualquer repositório do seu sistema para a árvore de modelos. Pense nos modelos do &quantaplus; como tendo, em sentido lato, as limitações à sua imaginação que o seu sistema de ficheiros tenha. </para>

<para
>Os modelos existem em pastas aninhadas. Não existe nenhum limite de profundidade para a colocação dos modelos dentro de uma pasta; todavia, para qualquer pasta indicada, o &quantaplus; espera uma acção consistente para o tipo de modelo de base descrito em baixo. Para além disso, os modelos permitem concatenar o pré-texto e o pós-texto aos modelos que não tenham tipo definido de documento. Isto facilita a criação de 'tags'. A próxima actualização depois da introdução pretende adicionar a capacidade de passar variáveis ao texto, como por exemplo a informação do tamanho da imagem, de modo a assistir à criação das 'tags'. </para>

<para
>O nosso objectivo em relação aos modelos é extendê-los de modo a incluir o conceito de modelos multi-ficheiro para as coisas do tipo "criar um pedido" ou a criação de uma secção "acerca". Idealmente, isto seria uma ferramenta para tornar o seu trabalho ainda mais produtivo e dinâmico. Um objectivo eventual será ter um modo de desenho estrutural dos modelos, o qual o utilizador poderia usar para desenhar e actualizar interactivamente os seus 'sites'. Se se quiser envolver, veja a nossa página de <ulink url="http://quanta.sourceforge.net/main1.php?contfile=needs"
>pedido de ajuda</ulink
>. </para>

<important>
<para
>Alguns dos modelos que vêm com o &quantaplus; têm condições para a sua utilização. Veja com atenção as condições de utilização no topo de cada modelo antes de o usar. </para>
</important>

<sect2 id="template-types-3-2">
<title
>Tipos de Modelo</title>

<para
>Neste momento, os modelos estão limitados a ser de um dos seguintes tipos de objectos: </para>

<simplelist>
<member
>Documento</member>
<member
>Texto a inserir num documento</member>
<member
>Um ficheiro a ligar de forma a criar um documento</member>
</simplelist>

<para
>Os documentos poderão ser de qualquer tipo. Geralmente, o utilizador deverá querer associar os documentos mais específicos e diversos em sub-pastas. Aqui poderá criar uma arquitectura básica para o que faz e passá-la para o seu trabalho de uma forma organizada, para poder obter uma maior eficiência. A introdução de texto poderá ser desde um excerto de código até o que quiser utilizar. Isto sobrepõe-se à capacidade de introduzir blocos de texto como uma acção despoletada a partir da barra de ferramentas. Os ficheiros associados poderão ser binários, bibliotecas de classes de &PHP; ou o que se desejar. </para>

</sect2>

<sect2 id="template-scope-3-2">
<title
>Validade dos Modelos</title>

<para
>Os modelos estão acessíveis de acordo com o seu <link linkend="quanta-workspaces-3-2"
>espaço de trabalho</link
> estabelecido no &quantaplus; </para>

</sect2>

<sect2 id="creating-templates-3-2">
<title
>Criação de Modelos</title>

<para
>Crie a estrutura do documento que desejar (&XML;, &HTML;, DocBook, &etc;.) e carregue em <menuchoice
> <guimenu
>Ficheiro</guimenu
> <guimenuitem
>Gravar Como um Modelo</guimenuitem
> <guimenuitem
>Gravar Como um Modelo Local/do Projecto</guimenuitem
> </menuchoice
>. </para>

<para
>Logo que isso tenha sido feito, irá reparar que (mesmo que tenha sido gravado como um modelo do projecto), o modelo <emphasis
>não</emphasis
> aparece na página do projecto. Veja na página dos modelos do Projecto para o encontrar. </para>

<para
>Para além disso, se olhar para as opções do menu do &RMB;, irá ver as ferramentas completas de gestão de ficheiros para criar as pastas ou copiar e colar os modelos de um lado para o outro. </para>

</sect2>

<sect2 id="using-templates-with-projects-3-2">
<title
>Utilizar Modelos nos Projectos</title>

<para
>Os modelos dos projectos permitem-lhe estar focado mais estritamente. Poderá criar cabeçalhos, rodapés ou mesmo conteúdos dinâmicos ao fazer a inclusão de ficheiros de &PHP; e ligá-los. Para além disso, poderão existir algumas coisas interessantes a ter em consideração ao usar os modelos nos projectos. </para>

<para
>Ao criar um projecto poderá optar por copiar todos os modelos locais e globais. Um projecto legado poderão obter as capacidades de modelos predefinidas, como tal nada se perde. Poderá escolher onde quer localizar os seus ficheiros de modelo, de modo a que possam estar na base do seu servidor, e poder-se-á tornar fácil enviar os ficheiros, mas também poderá torná-los seguros para se ligar à raiz do servidor em baixo, o que acaba por ser um truque útil. Ao ligar-se a um ficheiro que não conste nos modelos do projecto ser-lhe-á questionado se quer copiar o ficheiro para os modelos do projecto antes de efectuar a associação. Isto irá evitar as ligações quebradas no envio. O utilizador terá sempre o controlo onde coloca os seus modelos, por isso poderá optar por movê-los. O &quantaplus;, contudo, não regista isto por isso terá de alterar as ligações. </para>

</sect2>

<sect2 id="managing-templates-3-2">
<title
>Gerir o Comportamento dos Modelos</title>

<para
>A estrutura dos modelos na página de modelos baseia-se nos ficheiros existentes nas pastas <filename class="directory"
>$<envar
>KDEDIR</envar
>/share/apps/quanta/templates</filename
> e <filename class="directory"
>$<envar
>HOME</envar
>/.kde/share/apps/quanta/templates</filename
>. Cada uma destas pastas corresponde a um dos tipos de gestão: </para>

<variablelist>
<varlistentry>
<term
>ficheiros/tudo</term>
<listitem>
<para
>os binários e todos os itens que são introduzidos através do seu &URL; (p.ex., as imagens num <sgmltag class="starttag"
>img src=/src/url</sgmltag
>). </para>
</listitem>
</varlistentry>
<varlistentry>
<term
>texto/tudo</term>
<listitem>
<para
>O texto que pode introduzir no documento actual do &quantaplus;, como por exemplo blocos repetitivos. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
>modelos/tudo</term>
<listitem>
<para
>Os modelos de documentos a partir dos quais poderá criar novos documentos. Estes criam uma nova janela no &quantaplus;. </para>
</listitem>
</varlistentry>
</variablelist>

<para
>Para definir o comportamento de cada pasta, carregue com o &RMB; na janela dos modelos na respectiva pasta e carregue em Propriedades. Irá aparecer uma janela como a seguinte: <mediaobject>
<imageobject>
<imagedata fileref="template-rmb.png" format="PNG"/>
</imageobject>
<caption
><para
>Janela de propriedades.</para
></caption>
</mediaobject>
</para>

<variablelist>
<varlistentry>
<term
><guilabel
>Tipo</guilabel
></term>

<listitem>
<para
>Uma lista com os três tipos definidos anteriormente: ficheiros, texto e modelo. Esta lista ficará desactivada se tiver assinalado a opção <guilabel
>herdar as propriedades do pai</guilabel
>. </para>
</listitem>
</varlistentry>

<varlistentry>
<term
><guilabel
>Herdar atributo do pai</guilabel
> (<sgmltag class="starttag"
>foo</sgmltag
>)</term>
<listitem>
<para
>Esta opção vem assinalada por omissão e é a óptima para todos as pastas, excepto a de topo, na sua árvore de modelos. Se a pasta de topo tiver esta opção assinalada, isto irá desactivar os modelos para essa pasta e para todas as que não estejam assinaladas para baixo. Se esta não for uma pasta de topo, então o <sgmltag class="starttag"
>blah</sgmltag
> irá indicar algo do género <literal
>text/all</literal
>. Se não disser nada, então é provável que esteja numa pasta do nível de topo. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
><guilabel
>Usar o texto prefixo/sufixo</guilabel
></term>
<listitem>
<para
>Permite usar o texto prefixo e sufixo nesta pasta. Este poderá ser um cabeçalho/rodapé comum para todos os seus modelos de um dado projecto e para que possa então copiar os modelos de conteúdo para essa pasta, de modo a ter uma página completa com o cabeçalho e rodapé personalizados como ponto de partida. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
><guilabel
>Texto prefixo:</guilabel
></term>
<listitem>
<para
>O texto a introduzir antes do seu conteúdo-modelo. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
><guilabel
>Texto sufixo:</guilabel
></term>
<listitem>
<para
>O texto a introduzir após o seu conteúdo-modelo. </para>
</listitem>
</varlistentry>
</variablelist>

</sect2>
</sect1>

<sect1 id="vpl-3-2">
<sect1info>
<title
><application
>Disposição Visual da Página</application
></title>
<authorgroup>
<author
><firstname
>Nicolas</firstname
> <surname
>Deschildre</surname
> <affiliation
> <address
><email
>nicolasdchd@ifrance.com</email
></address>
</affiliation>
</author>

<othercredit role="reviewer"
><firstname
>Christopher</firstname
> <surname
>Hornbaker</surname
> <affiliation
> <address
><email
>chrishornbaker@earthlink.net</email
></address>
</affiliation>
<contrib
>Revisão</contrib>
</othercredit>

<othercredit role="translator"
><firstname
>Pedro</firstname
><surname
>Morais</surname
><affiliation
><address
><email
>morais@kde.org</email
></address
></affiliation
><contrib
>Tradução</contrib
></othercredit
> 

</authorgroup>
</sect1info>

<title
><application
>Disposição Visual da Página</application
></title>

<sect2 id="vpl-views-3-2">
<title
>Modos &VPL;</title>

<para
>O editor da <application
>Disposição Visual da Página</application
> (&VPL;) (também conhecido por <acronym
>WYSIWYG</acronym
> (What You See Is What You Get) ) permite-lhe editar um documento de &HTML; ou &XHTML; enquanto observa as alterações na altura. Tal como acontece no seu processador de texto favorito, você poderá carregar no seu documento para aparecer um cursor, o que lhe permitirá introduzir texto, imagens, aplicar decorações de texto, &etc;. O intuito do &VPL; é permitir criar páginas Web impecáveis e válidas sem ter nenhum conhecimento de linguagens de formatação da Internet. </para>

<para
>O &quantaplus; oferece dois modos: o <guilabel
>Editor de &VPL;</guilabel
> e o <guilabel
>&VPL; &amp; Editor de Código</guilabel
>, os quais estão acessíveis no menu <guimenu
>Ver</guimenu
>. O primeiro substitui o <guilabel
>Editor de Código</guilabel
> com o <guilabel
>Editor de &VPL;</guilabel
> e o segundo divide a janela de edição em duas partes: o <guilabel
>Editor de Código</guilabel
> e o <guilabel
>Editor de &VPL;</guilabel
>. </para>

<para
>O <guilabel
>Editor de &VPL;</guilabel
> funciona da seguinte maneira: Carrega um documento como uma página &HTML; ou &XHTML; normal e aparece um cursor. Aí, você poderá editá-lo e voltar ao <guilabel
>Editor de Código</guilabel
>; você poderá então ver que as alterações que fez no <guilabel
>Editor de &VPL;</guilabel
> foram reunidas com o <guilabel
>Editor de Código</guilabel
>. </para>

<note>
<para
>Ao trabalhar no <guilabel
>Editor de &VPL;</guilabel
> com um documento que contenha &PHP;, você verá um pequeno ícone verde que representa o código de &PHP;. Você não o poderá editar directamente com o <guilabel
>Editor de &VPL;</guilabel
>. Para editar o &PHP;, você irá necessitar à mesma de usar o <guilabel
>Editor de Código</guilabel
>. Não existem planos para alterar esta funcionalidade. </para>
</note>

<para
>O segundo modo comporta-se exactamente da mesma forma que o primeiro, excepto que você poderá ver imediatamente o impacto que as suas alterações terão feito, quer no <guilabel
>Editor de Código</guilabel
> quer no <guilabel
>Editor de &VPL;</guilabel
>; para além disso, os cursores do editor de código e do <guilabel
>Editor de &VPL;</guilabel
> estão sincronizados. Se carregar em <keycap
>F9</keycap
> carrega este modo mas, se já estiver carregado, irá passar o primeiro plano de uma vista para a outra, enquanto que fica na mesma localização do documento. </para>

<para
>Os intervalos de actualização entre o <guilabel
>Editor de &VPL;</guilabel
> e o <guilabel
>Editor de Código</guilabel
> são configuráveis. Vá a <menuchoice
> <guimenu
>Configuração</guimenu
> <guimenuitem
>Configurar o Quanta...</guimenuitem
> </menuchoice
>. Seleccione a página <guimenu
>Vista &VPL;</guimenu
>. Aí poderá escolher se deseja actualizar uma das vistas só quando carregar nela ou se o quer automaticamente. Se optar pelo modo automático, então poderá definir um intervalo de actualização. A recomendação geral é: Um valor baixo para os computadores rápidos e um valor mais elevado para os computadores mais lentos. </para>

<mediaobject>
<imageobject>
<imagedata fileref="vplsourceview.png" format="PNG"/>
</imageobject>
<caption
><para
>O modo de  <guilabel
>Editor de &VPL; &amp; de Código</guilabel
>.</para
></caption>
</mediaobject>
</sect2>

<sect2 id="vpl-editing-3-2">
<title
>Edição &VPL;</title>

<sect3 id="doc-prop-dia-3-2">
<title
>A Janela <guilabel
>Propriedades do Documento</guilabel
></title>

<para
>Agora, imagine-se que você deseja editar o título da sua página Web. Como é que faz isso? Basta carregar em <menuchoice
> <guimenu
>Ferramentas</guimenu
> <guimenuitem
>Propriedades do Documento</guimenuitem
> </menuchoice
>. Esta ferramenta permite a edição das marcas <quote
>invisíveis</quote
> ao usar o <guilabel
>Editor de &VPL;</guilabel
>. A janela de <guilabel
>Propriedades do Documento</guilabel
> também é lançada quando você cria um novo documento enquanto permanece no <guilabel
>Editor de &VPL;</guilabel
>. Isto serve para reduzir a quantidade de código escrito à mão necessário para definir essa propriedade. Com isto, você poderá editar: </para>

<variablelist>
<varlistentry>
<term
><guilabel
>Título</guilabel
></term>
<listitem>
<para
>O título do documento. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
><guilabel
>Meta itens</guilabel
></term>
<listitem>
<para
>As meta-marcas ou 'meta-tags' permitem-lhe guardar informações acerca do documento em si &eg; as palavras-chave para os motores de busca da Internet. Você poderá adicionar ou remover os <guilabel
>Meta-itens</guilabel
> ao carregar nos dois botões em baixo, e editá-los na lista, &eg;, pondo as <quote
>palavras-chave</quote
> no campo do <quote
>nome</quote
> e a <quote
>palavra-chave1 palavra-chave2</quote
> na coluna de  <quote
>conteúdo</quote
>. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
><guilabel
>Regras CSS</guilabel
></term>
<listitem>
<para
>As <guilabel
>Regras de CSS</guilabel
> são a única forma de indicar ao seu navegador Web como apresentar a página. Você poderá adicionar ou remover as <guilabel
>Regras de CSS</guilabel
> ao carregar nos botões em baixo. Você também poderá preencher os campos da mesma forma que os <guilabel
>Meta-itens</guilabel
>. A edição das <guilabel
>Regras do CSS</guilabel
> ainda não é suportada. </para>
</listitem>
</varlistentry>
<varlistentry>
<term
><guilabel
>Ligar Folha de Estilo CSS</guilabel
></term>
<listitem>
<para
>Você poderá também associar ou ligar uma folha de estilo ('stylesheet') CSS externa. Basta carregar no botão <guilabel
>Escolher</guilabel
> e seleccionar o seu ficheiro. </para>
</listitem>
</varlistentry>
</variablelist>

</sect3>

<sect3 id="vpl-editor-3-2">
<title
>O <guilabel
>Editor &VPL;</guilabel
></title>

<para
>Você poderá usar o seu cursor como num processador de texto, movendo-o com as teclas correspondentes. Poderá acontecer que o cursor não queira ir para onde você deseja (um erro chato). A selecção também funciona de forma normal. Você poderá introduzir texto se o escrever ou removê-lo se carregar nas teclas &Backspace; ou Delete. </para>

<para
>Agora vamos para a introdução de marcas. Você poderá introduzir imagens, 'applets', decorações do texto como negrito ou itálico, e assim por diante, se usar as mesmas barras de ferramentas que utiliza no editor de código. Repare que a introdução de marcas não remove as marcas idênticas anteriores, &eg; se introduzir uma âncora à volta de determinado texto, então você terá de remover as outras âncoras à volta do mesmo. </para>

<note>
<para
>Alguns dos itens da barra de ferramentas irão estar desactivados, como o <guilabel
>Assistente de Tabelas</guilabel
> ou o <guilabel
>Assistente de Listas Rápido</guilabel
>. Eles irão funcionar mais tarde na &VPL;, mas, para esta versão, você deverá usar as barras de <guilabel
>Tabelas</guilabel
> ou de  <guilabel
>Listas</guilabel
>. </para>
</note>

<para
>Para editar uma marca (seja ela uma imagem, uma 'applet' ou o que for), mude para a <guilabel
>Árvore de Atributos</guilabel
>, a qual está acessível através da opção <menuchoice
> <guimenu
>Ver</guimenu
> <guisubmenu
>Vistas em árvore</guisubmenu
> </menuchoice
>. Carregue na marca que deseja editar ou, se não lhe conseguir aceder, carregue num objecto que esta contenha. A <guilabel
>Árvore de Atributos</guilabel
> irá mostrar o nome da marca actual, assim como uma lista de todos os seus elementos-pais e atributos. De momento, o &VPL; não suporta, por exemplo, o &XHTML;+<acronym
>MathML</acronym
>, mas você verá que pode editar os espaços de nomes com esta janela. Basta você carregar no campo <guilabel
>Valor</guilabel
> e modificar o que quiser. Se quiser aceder a um elemento-pai da marca actual, então seleccione-o para que a <guilabel
>Árvore de Atributos</guilabel
> o carregue. </para>

<para
>Para remover uma marca, nós iremos usar a <guilabel
>Árvore de Atributos</guilabel
>. Já reparou nas duas pequenas cruzes vermelhas no canto superior direito? A primeira apaga apenas a marca seleccionada e, se a especificação de &HTML;/&XHTML; não permitir que alguns dos filhos da marca a ser removida possam pertencer aos pais da mesma, então estes filhos serão removidos também, e assim por diante. A segunda cruz irá remover a marca seleccionada e todos os seus filhos, por isso tenha cuidado! </para>

</sect3>
</sect2>
</sect1>
</chapter>
