# Trabalhando Com...

Robert
Nickel

    robert@artnickel.com

Christopher
Hornbaker

    chrishornbaker@earthlink.net

Revisão
Fabrice
Mous

    fabrice@kde.nl

Revisão
Marcus
Gama

    marcus_gama@uol.com.br

Tradução

# Trabalhando Com...

Este capítulo descreve as partes do &quantaplus; que você deverá interagir com mais frequência. Elas não somente tornam seu trabalho mais produtivo, mas também elas permitem que você personalize o &quantaplus; para seu jeito de trabalhar.

## Barras de Ferramentas

Como mencionado anteriormente, as barras de ferramentas no &quantaplus; são gerenciadas primariamente através do menu Barras de Ferramentas. A usabilidade e a criação são coisas diferentes. A criação de barras de ferramentas é discutida mais à frente na seção entitulada Criando Barras de Ferramentas.

Usar barras de ferramentas é muito simples. Quando você clica em um ícone para um elemento ou ação desejada, uma de três coisas podem ocorrer: o elemento é inserido (opcionalmente com um elemento de fechamento); um diálogo de elemento é ativado, permitindo que você preencha atributos em uma caixa de diálogo; ou, finalmente, uma ação é ativada e faz algo em seu arquivo atual ou projeto. Se você achar entediante realizar algumas ações manualmente e redundante digitar um elemento em particular, que não esteja no &quantaplus;, então você pode adicionar esta ação ou elemento a uma barra de ferramentas. Veja em para mais informações.

Um diálogo de tag se parece com o seguinte:

Um exemplo de um diálogo de tag.

A imagem acima é o diálogo para a tag âncora. Se você conhece &XHTML;, então você deve perceber que todos os atributos que você pode usar, em um elemento âncora, estão disponíveis. Observe as abas acima para Principal, Core e i18n, Eventos e Foco, que contém todos os outros atributos, de acordo com sua intenção, disponíveis para o elemento âncora. Tudo o que você precisa é fazer isso: preencha nas lacunas os atributos que deseja em sua âncora, omita os atributos que não deseja, e clique OK. Você agora tem um conjunto âncora corretamente formado na posição atual do cursor.

&quanta-projects;

## Modelos

Modelos são basicamente esqueletos de documentos, trechos de código e arquivos para ligação. O &quantaplus; usa modelos fundamentalmente como no sistema de arquivos padrão do sistema mas com um interfaceamento e organização avançados. Você pode copiar, mover ou linkar qualquer repositório atualmente em seu sistema na árvore de modelos. Pense nos modelos do &quantaplus; como tendo aproximadamente as mesmas limitações que a imaginação do seu sistema de arquivos possui.

Modelos existem em pastas aninhadas. Não há limite para a profundidade deste aninhamento, no entanto dentro de qualquer pasta fornecida o &quantaplus; expera uma ação consistente para o tipo de modelo base descrito abaixo. Adicionalmente, modelos permitem que o texto antes e depois seja concatenado para modelos de tipo não documento. Isto facilita a criação de tags. A próxima atualização após a inclusão de modelos que está planejada é adicionar a habilidade de passar variáveis para o texto, como por exemplo informações do tamanho da imagem, para auxiliar na criação de tag.

Nosso objetivo com modelos é extendê-los e incluir o conceito de modelos multi-arquivos, útil para coisas como colocar uma ordem ou criar uma seção 'sobre'. No ponto ideal, ele será uma ferramenta para tornar o seu trabalho mais produtivo e dinâmico. Um objetivo eventual é ter um modo de desenho de estrutura de modelo com a finalidade de ajustar a disposição e estrutura do site que você poderia usar para desenhar e interativamente atualizar seus sites. Se você gostaria de participar do desenvolvimento, verifique nossa página de precisa-se de ajuda.

Alguns dos modelos que são fornecidos com o &quantaplus; possuem condições para seu uso. Por favor leia cuidadosamente as condições de uso no topo de cada modelo antes de usá-lo.

### Tipos de Modelo

Atualmente os modelos estão limitados a serem um dos seguintes tipos de objetos:

- Documento
- Texto para inserir em um documento
- Um arquivo para linkar para formar um documento

Documentos podem ser qualquer tipo de documento. Em termos gerais você desejaria aninhar documentos mais específicos ou variados em subpastas. Aqui você pode criar um ambiente de trabalho básico para que você os crie e empregue em seu trabalho de uma forma organizada e realize as coisas de uma maneira mais eficiente. A insersão de texto pode ser qualquer coisa desde um trecho de código até um script ou qualquer coisa que deseje usar. Isto cobre a habilidade de inserir blocos de texto como uma ação que pode ser disparada a partir da barra de ferramentas. Arquivos lincados podem ser binários, bibliotecas de classes &PHP; ou qualquer coisa que precise.

### Escopos do Modelo

Modelos ficam acessíveis baseados em seu espaço de trabalho estabelecido no &quantaplus;

### Criando Modelos

Crie uma estrutura de documento que você goste (&XML;, &HTML;, DocBook, &etc;) e clique em Arquivo Salvar como Modelo Salvar como Modelo Local/Projeto .

Uma vez isto feito, você perceberá que (caso ele seja salvo como um modelo do Projeto) o modelo não é mostrado na visão de aba do projeto. Procure na visão de modelos para encontrar o seu modelo na aba de modelos do Projeto.

Adicionalmente, se você der uma olhada em suas opções com o &RMB; você verá ferramentas de gerenciamento de arquivo completas para criar pasta ou copiar e colar modelos a partir de uma localização para outra.

### Usando Modelos Com Projetos

Modelos de projeto permitem que você fique mais firmemente focado. Você pode criar cabeçalhos, rodapés ou barras de navegação dinâmicas com os arquivos de inclusão do &PHP; e lincá-los. Além disso existem algumas coisas muito legais que nós levamos em consideração ao usar modelos em projetos.

Ao criar um projeto você pode optar entre copiar para seu projeto local todos os modelos globais e de usuário existentes. Projetos legados adquirem as habilidades de modelos padrões de modo que nada é perdido. Você pode escolher onde localizar seus arquivos de modelo, de modo que eles pode estar na raiz do seu servidor tornando-os fáceis de enviar ou você pode torná-los mais seguros criando links para eles abaixo da raiz do servidor, o que é um truque muito legal. Ao linkar para um arquivo que não esteja nos modelos do projeto, você será questionado se deseja copiar o arquivo para os modelos do projeto antes de linkar. Isto evitará links quebrados ao enviar. Você sempre tem o controle de onde você coloca seus modelos de modo que você pode decidir movê-los se quiser. No entanto, o &quantaplus; não rastreia isto de modo que você precisará mudar os links.

### Gerenciando o Comportamento do Modelo

A estrutura do modelo na aba modelo é baseada em arquivos encontrados em `$`KDEDIR`/share/apps/quanta/templates` e `$`HOME`/.kde/share/apps/quanta/templates`. Cada uma das pastas existentes é especificada como um de três tipos de recipiente:

arquivos/todos

  Binários e coisas que são obtidas por sua &URL; (&ie; imagens como um `img src=/src/url`).

texto/todos

  Texto que você pode inserir no documento &quantaplus;, como blocos repetitivos.

modelo/todos

  Modelos de documento a partir dos quais você pode criar novos documentos. Eles são abertos em uma nova janela no &quantaplus;.

Para configurar o comportamento de cada pasta, clique com o &RMB; na visão modelo na pasta e selecione Propriedades. O seguinte diálogo aparecerá:

Diálogo de propriedades.

Tipo

  Caixa combinada com os três tipos discutidos anteriormente: arquivos, texto e modelo. Esta caixa será desabilitada se você tiver a caixa de herança do atributo pai habilitada.

Herança do atributo pai (`exemplo`)

  Isto é habilitado por padrão e é válido para tudo menos pastas de nível superior na sua árvore de modelos. Se a pasta de nível superior tiver isto habilitado, isto basicamente desativará modelos para aquela pasta e todas que não estiverem configuradas explicitamente abaixo dela. Se esta não é uma pasta de nível superior, então o `blah` dirá algo como `texto/tudo`. Se não disser nada, então provavelmente você está em uma pasta de nível superior.

Usar texto pré/pós

  Habilita o texto pré e pós para modelos nesta pasta. Isto pode ser um cabeçalho/rodapé comum para todos os seus modelos de um determinado projeto e então você copia o conteúdo dos modelos para a pasta e obtém uma página completa com o cabeçalho/ropadé personalizado como ponto inicial.

Pré-texto

  O texto atual a ser inserido antes do conteúdo dos seus modelos.

Pós-texto

  O texto atual a ser inserido após o conteúdo do seu modelo.

## Disposição Visual da Página

Nicolas
Deschildre

    nicolasdchd@ifrance.com

Christopher
Hornbaker

    chrishornbaker@earthlink.net

Revisão
Marcus
Gama

    marcus_gama@uol.com.br

Tradução

## Disposição Visual da Página

### Modos &VPL;

O editor de Disposição Visual da Página (do inglês, &VPL;) (também conhecido como, do inglês, WYSIWYG (O que Você Vê É O que Você Obtém)) permite que você edite um documento &HTML; ou &XHTML; enquanto vê as mudanças no resultadoem tempo real. Como no seu processador de texto preferido, você pode clicar em seu documento e um cursor aparecerá, permitindo que você insira texto, imagens, aplique decorações, &etc;. O &VPL; foi feito para permitir que você crie páginas web completas e válidas sem nenhum conhecimento da linguagem de marcação para Internet.

O &quantaplus; oferece dois modos: Editor &VPL; e Editor &VPL; & de Código, que estão acessíveis a partir do menu Ver. O primeiro substitui o Editor de Código com o Editor &VPL;, e o segundo divide a janela do editor em duas partes: o Editor de Código e o Editor &VPL;.

O Editor &VPL; trabalha da seguinte maneira: ele carrega um documento como uma página &HTML; ou &XHTML; normal e um cursor aparece. Então você pode editá-lo, e alternando para o Editor de Código, você vê quais mudanças foram feitas pelo Editor &VPL; sendo mescladas no Editor de Código.

Ao trabalhar no Editor &VPL; com um documento que contém &PHP;, você verá um pequeno ícone verde representando o código &PHP;. Você não pode editar diretamente ele com o Editor &VPL;. Para editar o código &PHP;, você ainda precisará usar o Editor de Código. Não existem planos para mudar esta funcionalidade.

O segundo modo funciona exatamente como o primeiro, exceto que você vê instantaneamente o impacto de suas mudanças tiveram, tanto no Editor de Código como no Editor &VPL;, e os cursores do editor de código e do Editor &VPL; são sincronizados. Pressionar F9 carrega este modo, mas, se ele já estiver carregado, isto moverá o foco de uma visão para outra, mantendo você na mesma localização do documento.

O intervalo de atualização entre o Editor &VPL; e o Editor de Código é configurável. Vá para Configurações Configurar o Quanta... . Selecione a aba Visão &VPL;. Você pode selecionar se deseja atualizar uma visão somente quando você clica nela ou automaticamente. Se selecionar automaticamente, então você pode escolher um intervalo de atualização. A recomendação geral é: Um número pequeno para computadores rápidos e um número grande para os mais lentos.

O modo Editor &VPL; & de Código.

### Editando &VPL;

#### O Diálogo Propriedades do Documento

Agora, vamos dizer que você queira editar o título de sua página web. Como fazer isto? Simplesmente lance o Ferramentas Propriedades do Documento . Esta ferramenta permite a edição de tags invisíveis quando usando o Editor &VPL;. O diálogo de Propriedades do Documento é também lançado quando você cria um novo documento estando no Editor &VPL;. Isto visa diminuir a quantidade de codificação manual que você precisa realizar. Com ele, você pode editar:

Título

  O título do documento.

Ítens meta

  Tags meta permitem armazenar informações sobre o documento propriamente dito, &eg; palavras chave para os motores de busca da Internet. Você pode adicionar ou remover ítens Meta pressionando os dois botões abaixo, e editar clicando-os na lista, &eg; colocar keywords na coluna nome e palavra chave 1 palavra chave 2 na coluna conteúdo.

Regras CSS

  As Regras CSS são uma nova maneira de dizer ao seu navegador como apresentar a página. Você pode adicionar ou excluir as Regras CSS pressionando os botões abaixo. Você pode também preencher os campos como nos Ítens Meta. A editão de Regras CSS ainda não é suportada.

Linkar com Folha de Estilo CSS

  Você pode também linkar com um folha de estilo CSS esterna. Simplesmente clique no botão Navegar e selecione seu arquivo.

#### O Editor &VPL;

Você pode usar seu cursor como o faz em um processador de texto, movendo-o com as setas. Pode acontecer que o cursor não queira ir aonde você deseja (um erro problemático). A seleção funciona normalmente. Você pode inserir texto digitando-o e remover texto pressionando as teclas &Backspace; ou Delete.

Agora vejamos a inserção de tag. Você pode inserir imagens, mini-aplicativos, decorações de texto como o negrito e assim por diante usando as mesmas barras de ferramentas que você usa no editor de código. Observe que a inserção de tags não remove as tags anteriores, &eg; se você inserir uma tag de âncora ao redor de algum texto, então você deve remover qualquer outra tag ao redor dele.

Alguns ítens das barras de ferramentas serão desabilitados, como o Assistente Tabela ou o Assistente Lista Rápida. Eles funcionarão mais tarde no &VPL;, mas para esta versão, você deve usar as barras de ferramentas Tabelas ou Listas.

Para editar uma tag (seja ela uma imagem, um mini-aplicativo ou o que for), alterne para a Árvore de Atributos, acessível através do Ver Visões em Árvore . Clique na tag que deseja editar, ou, se não puder acessá-la, clique em um objeto que a contenha. A Árvore de Atributos mostrará o nome atual da tag bem como uma lista de todos os seus pais e atributos. Atualmente o &VPL; não suporta, digamos, &XHTML;+MathML, mas você verá que pode editar espaços de nomes através desta visão. Você pode simplesmente clicar no campo Valor e modificar o que desejar. Se você deseja acessar um pai da tag atual, então selecione-a e a Árvore de Atributos o carregará.

Para excluir uma tag, nós usaremos a Árvore de Atributos. Você deve ter reparado nas duas pequenas cruzes vermelhas no canto superior direito? A primeira exclui somente a tag atualmente selecionada, e, se a especificação &HTML;/&XHTML; não permitir que alguns filhos da tag excluída sejam filhos da tag pai, então eles também serão excluídos, e assim por diante. A segunda cruz excluirá a tag bem como todos os seus filhos, logo seja cuidadoso!