Siga um destes procedimentos:
Última atualização em
07/05/2021
Use o Dreamweaver com serviços Adobe Online, incluindo BrowserLab e Business Catalyst InContext Editing.
Os serviços online da Adobe são aplicativos da Web hospedados que funcionam de maneira semelhante às ferramentas de área de trabalho tradicionais. No entanto, a vantagem dos serviços online é que eles estão sempre atualizados, por serem hospedados na Web e não em seu computador.
O Dreamweaver se integra diretamente com o Adobe® BrowserLab e o Adobe® Business Catalyst InContext Editing. A ajuda para trabalhar com esses serviços está incluída nas seções da Ajuda a seguir.
O Dreamweaver também se integra com os serviços online do Adobe® CS Live (que inclui o BrowserLab). Para obter mais informações sobre como trabalhar com o CS Live, consulte Usar o Adobe CS Live.
Para obter informações sobre o gerenciamento de serviços online da Adobe, consulte o site da Adobe em www.adobe.com/go/learn_creativeservices_br.
BrowserLab
O Adobe BrowserLab permite que você visualize o conteúdo da Web local no Dreamweaver, sem que seja necessário postá-lo primeiro em um servidor de acesso público. É possível visualizar arquivos a partir do seu site local Dreamweaver ou de um servidor remoto ou de teste.
Para obter informações sobre como usar o serviço online BrowserLab, incluindo informações sobre como usar o BrowserLab com o Dreamweaver, consulte www.adobe.com/go/lr_abl_br.
Business Catalyst InContext Editing
Business Catalyst InContext Editing
O Adobe Business Catalyst InContext Editing é um componente de edição do Adobe Business Catalyst que permite aos usuários fazerem alterações simples de conteúdo em um navegador da Web. Para alterar uma página da Web, basta aos usuários navegarem para a página, fazer logon no InContext Editing e editar a página. As opções de edição são simples e elegantes e o respectivo uso não exige nenhum conhecimento anterior de código HTML nem edição na Web.
No entanto, antes de habilitar a realização de alterações ao vivo pelos usuários na Web, você precisa usar o Dreamweaver para tornar suas páginas HTML editáveis. Isso pode ser feito com a especificação de regiões na página que você deseja permitir que os usuários editem. Por exemplo, você pode ter uma página de notícias com títulos e balões para os artigos. Você pode selecionar esse conteúdo e transformá-lo em uma região editável do InContext Editing de forma que quando um usuário se conectar ao InContext Editing, possa editar os títulos e os balões diretamente em um navegador.
Esta documentação explica como trabalhar com as regiões editáveis do InContext Editing no Dreamweaver; mas a Adobe também fornece outros recursos para ajudá-lo a trabalhar com o InContext Editing:
Para ver a documentação sobre como usar o InContext Editing para editar páginas em um navegador, consulte www.adobe.com/go/learn_dw_incontextediting_browser_br.
Para ver a documentação sobre como trabalhar com o painel de administração do InContext Editing, consulte www.adobe.com/go/learn_dw_incontextediting_administration_guide_br.
Para obter mais informações sobre o Adobe Business Catalyst, visite www.businesscatalyst.com.
Observação:
o Adobe AIR não fornece suporte para o Adobe Business Catalyst InContext Editing. Se você usar o AIR Extension para Dreamweaver para exportar um aplicativo que contém regiões do InContext Editing, os recursos do InContext Editing não funcionarão.
Criar uma região editável do InContext Editing
Uma região editável do InContext Editing consiste em um par de tags HTML incluindo o atributo ice:editable na tag de abertura. A região editável define uma área na página que pode ser editada diretamente por um usuário em um navegador.
Observação:
se você estiver adicionando uma região editável do InContext Editing a uma página baseada em um modelo do Dreamweaver, essa nova região editável deve existir dentro de uma região que já é editável.
-
Selecione uma tag div, th ou td que você deseje transformar em uma região editável.
Posicione o ponto de inserção onde você pretende inserir uma nova região editável na página.
Selecione exatamente uma região editável em um modelo do Dreamweaver (arquivo DWT).
Selecione outro conteúdo na página que você deseje tornar editável (por exemplo, um bloco de texto).
-
Escolha Inserir > InContext Editing > Criar região editável.
-
As opções variam dependendo de sua seleção.
Se você tiver selecionado uma tag div, th ou td, o Dreamweaver a transformará em uma região editável sem a necessidade de outras etapas.
Se estiver inserindo uma nova região editável em branco, siga um destes procedimentos:
Selecione Inserir nova região editável no ponto de inserção atual e clique em OK. O Dreamweaver insere uma tag div no seu código com o atributo ice:editable na tag de abertura.
Selecione Transformar a tag-mãe em uma região editável se quiser que o Dreamweaver transforme a tag-mãe da seleção no elemento de contêiner da região. Somente algumas tags HTML podem ser transformadas: div, th e td.
Observação:esta segunda opção está disponível somente quando o nó pai atende aos critérios exatos para transformação. Por exemplo, ele deve ser uma das tags transformáveis listadas e não deve estar sujeito a nenhum dos erros listados em Mensagens de erro do InContext Editing.
- Se você selecionou uma região editável de modelo do Dreamweaver, clique em OK na caixa de diálogo Criar região editável. O Dreamweaver coloca a região editável de modelo entre as tags div que atuam como um contêiner para a nova região editável do InContext Editing.
- Se você tiver selecionado outro conteúdo que deseje tornar editável, siga um destes procedimentos:
- Selecione Delimitar a seleção atual com uma tag DIV e transformá-la se quiser delimitar sua seleção com uma tag div e transformá-la em uma região editável. A tag div com a qual o Dreamweaver delimita o conteúdo atua como contêiner da região editável.
Observação:adicionar tags div às páginas pode alterar o processamento das páginas e os efeitos das regras de CSS. Por exemplo, se você tiver um regra de CSS que aplica uma borda vermelha ao redor das tags div, verá uma borda vermelha ao redor de sua seleção atual quando o Dreamweaver colocá-la entre as tags div e transmiti-la. Se você quiser evitar esse tipo de conflito, poderá reescrever as regras de CSS que afetam a seleção atual ou desfazer a transformação (Editar > Desfazer) e, em seguida, selecionar e transformar uma tag suportada que o Dreamweaver não precisa colocar entre as tags div.
- Selecione Transformar a tag-mãe em uma região editável se quiser que o Dreamweaver transforme a tag-mãe da seleção no elemento de contêiner da região editável. Somente algumas tags HTML podem ser transformadas: div, th e td.
-
Na Visualização de design, clique na guia azul da região editável para selecioná-la, se ainda não estiver selecionada.
Observação:se você estiver trabalhando em um modelo do Dreamweaver, certifique-se de selecionar a região editável InContext Editing (a região do contêiner) e não a região editável de modelo do Dreamweaver.
-
Selecione ou cancele a seleção de opções no Inspetor de propriedades da região editável. As opções que você selecionar estarão disponíveis para um usuário que editar o conteúdo da região editável em um navegador. Por exemplo, se você selecionar a opção Negrito, o usuário poderá formatar o texto em negrito; se você selecionar as opções Lista numerada e Lista com marcadores, o usuário poderá criar listas numeradas e com marcadores; se você selecionar a opção Link, o usuário poderá criar links; e assim por diante. Passe o mouse sobre o ícone de cada opção para ver uma dica de ferramenta indicando a função ativada pela opção.
-
Salve a página.
Se for a primeira vez que você adiciona funções do InContext Editing a uma página, o Dreamweaver informará sobre o acréscimo dos arquivos de suporte do InContext Editing ao seu site: ice.conf.js, ice.js e ide.html. Certifique-se de carregar esses arquivos no servidor quando carregar sua página. Caso contrário, os recursos do InContext Editing não funcionarão em um navegador.
Criar uma região repetitiva do InContext Editing
Uma região repetitiva do InContext Editing consiste em um par de tags HTML incluindo o atributo ice:repeating na tag de abertura. A região repetitiva define uma área na página que um usuário pode “repetir” e à qual pode adicionar conteúdo ao fazer a edição em um navegador. Por exemplo, se você tem um cabeçalho e, em seguida, um parágrafo de texto, pode transformar esses elementos em uma região repetitiva que um usuário poderá duplicar em uma página.
Além de adicionar regiões repetitivas com base na região original, você também pode oferecer ao usuário a opção de excluir regiões, adicionar regiões completamente novas (não baseadas no conteúdo da região original) e mover as regiões para cima ou para baixo.
Quando você cria uma região repetitiva, o Dreamweaver a delimita em outro contêiner, chamado de grupo de regiões repetitivas. Esse contêiner, uma tag div com o atributo ice:repeatinggroup adicionado à tag de abertura, atua como contêiner de todas as regiões repetitivas editáveis que um usuário pode adicionar ao grupo. Você não pode mover as regiões repetitivas para fora de seus contêineres de grupos de regiões repetitivas. Além disso, você não deve adicionar manualmente tags de grupos de regiões repetitivas à sua página. O Dreamweaver as adiciona automaticamente quando necessário.
Observação:
ao criar uma região repetitiva a partir de uma linha da tabela (tag tr), o Dreamweaver aplica o atributo de grupo de regiões repetitivas à tag-mãe (por exemplo, a tag table) e não insere uma tag div.
Se você estiver trabalhando em uma página que contém um grupo de regiões repetitivas e tentar adicionar uma região repetitiva imediatamente depois de um grupo existente, o Dreamweaver detectará que o grupo de regiões repetitivas precede a região que você está tentando adicionar e apresenta a opção de adicionar a nova região ao grupo existente. Você pode optar por adicionar a nova região repetitiva ao grupo existente ou criar um grupo de regiões repetitivas totalmente novo.
Observação:
se você estiver adicionando uma região repetitiva do InContext Editing a uma página baseada em um modelo do Dreamweaver, essa nova região repetitiva deve existir dentro de uma região que já é editável.
Para criar uma região repetitiva no Dreamweaver, siga estas etapas.
-
Siga um destes procedimentos:
Selecione uma tag que você deseja transformar em uma região repetitiva. A lista de tags possíveis é extensa: a, abbr, acronym, address, b, big, blockquote, center, cite, code, dd, dfn, dir, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, label, li, menu, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, tr, tt, u, ul e var.
Observação:somente as tags div podem conter atributos de região editável e repetitiva simultaneamente.
- Posicione o ponto de inserção onde você pretende inserir uma nova região repetitiva na página.
- Selecione exatamente uma região repetitiva em um modelo do Dreamweaver (arquivo DWT).
- Selecione outro conteúdo na página que você deseje tornar repetível (por exemplo, um cabeçalho e um bloco de texto).
-
Escolha Inserir > InContext Editing > Criar região repetitiva.
-
As opções variam dependendo de sua seleção.
Se você tiver selecionado uma tag transformável, o Dreamweaver a transformará em uma região repetitiva sem a necessidade de outras etapas.
Se estiver inserindo uma nova região repetitiva em branco, siga um destes procedimentos:
Selecione Inserir nova região repetitiva no ponto de inserção atual e clique em OK.
Selecione Transformar a tag-mãe em uma região repetitiva se quiser que o Dreamweaver transforme a tag-mãe da seleção no elemento de contêiner da região. Somente algumas tags HTML podem ser transformadas: a, abbr, acronym, address, b, big, blockquote, center, cite, code, dd, dfn, dir, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, label, li, menu, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, tr, tt, u, ul e var.
Observação:esta segunda opção está disponível somente quando o nó pai atende aos critérios exatos para transformação. Por exemplo, ele deve ser uma das tags transformáveis listadas e não deve estar sujeito a nenhum dos erros listados em Mensagens de erro do InContext Editing.
- Se você selecionou uma região repetitiva de modelo do Dreamweaver, clique em OK na caixa de diálogo Criar região repetitiva. O Dreamweaver coloca a região repetitiva de modelo entre as tags div que atuam como um contêiner para a nova região repetitiva do InContext Editing.
- Se você tiver selecionado outro conteúdo que deseje tornar repetível, siga um destes procedimentos:
- Selecione Delimitar a seleção atual com uma tag DIV e transformá-la se quiser delimitar sua seleção com uma tag div e transformá-la em uma região repetitiva. A tag div com a qual o Dreamweaver delimita o conteúdo atua como contêiner da região repetitiva.
- Selecione Transformar a tag-mãe em uma região repetitiva se quiser que o Dreamweaver transforme a tag-mãe da seleção no elemento de contêiner da região repetitiva. Somente algumas tags HTML podem ser transformadas: a, abbr, acronym, address, b, big, blockquote, center, cite, code, dd, dfn, dir, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, label, li, menu, ol, p, pre, q, s, samp, small, span, strike, strong, sub, sup, table, tbody, tr, tt, u, ul e var.
-
Na Visualização de design, clique na guia azul da região repetitiva para selecioná-la, se ainda não estiver selecionada. Observe que o Dreamweaver obriga você a selecionar a guia do grupo de regiões repetitivas. Isso ocorre porque todas as regiões repetitivas existem em um grupo de regiões repetitivas, e você precisa definir opções para essas regiões configurando as opções do grupo inteiro.
-
Selecione ou cancele a seleção de opções no Inspetor de propriedades do grupo de regiões repetitivas. Há duas opções disponíveis: Reordenar e Adicionar/remover. Quando você seleciona Reordenar, os usuários podem mover as regiões repetitivas para cima ou para baixo durante a edição em um navegador. Quando você seleciona Adicionar/remover, os usuários podem adicionar ou remover regiões repetitivas durante a edição em um navegador. Ambas as opções são selecionadas por padrão, e você sempre deve selecionar pelo menos uma delas.
-
Salve a página.
Se for a primeira vez que você adiciona funções do InContext Editing a uma página, o Dreamweaver informará sobre o acréscimo dos arquivos de suporte do InContext Editing ao seu site: ice.conf.js, ice.js e ide.html. Certifique-se de carregar esses arquivos no servidor quando carregar sua página. Caso contrário, os recursos do InContext Editing não funcionarão em um navegador.
Excluir uma região
É melhor excluir uma região usando o Inspetor de propriedades da região. O uso do Inspetor de propriedades da região garante a exclusão de todo o código associado a ela.
Selecione uma região editável, uma região repetitiva ou um grupo de regiões repetitivas.
No Inspetor de propriedades da região, clique no botão Remover região.
Especificar classes de CSS para formatação
O InContext Editing gerencia as classes CSS disponíveis. O recurso está obsoleto desde a Dreamweaver CS5.
Mensagens de erro do InContext Editing
Não é possível aplicar o InContext Editing às tags que contêm tags de script ou bloco(s) de código do servidor.
Se a sua seleção contiver código do servidor, o Dreamweaver não permitirá que você a transforme em uma região editável ou repetitiva. Essa questão tem relação com a forma como o InContext Editing salva as páginas editáveis quando o usuário está trabalhando no navegador. Quando um usuário salva a página após a edição, o InContext Editing remove da região o código do servidor.
A seleção atual não pode ser transformada nem ter quebra automática com uma tag DIV, pois o nó-pai não permite DIV como tag-filha
Quando a seleção que deseja transformar em sua página não pode ser transformada diretamente, o Dreamweaver precisa colocar a seleção entre as tags div que atuam como o contêiner para a nova região editável ou repetitiva. Por essa razão, as tags-mãe daquilo que deseja transformar devem permitir as tags div como filhas. Se a tag-mãe da tag que você está tentando transformar não permitir tags div filhas, o Dreamweaver não permitirá que você realize a transformação.
A seleção atual já contém ou está dentro de uma Região editável. Regiões editáveis aninhadas não são permitidas.
Se a sua seleção estiver dentro de uma região editável ou se houver uma região editável dentro da seleção, o Dreamweaver não permitirá que você realize a transformação. O InContext Editing não oferece suporte a regiões editáveis aninhadas.
Regiões editáveis não devem conter Regiões repetitivas nem Grupos de regiões repetitivas.
As regiões editáveis do InContext Editing não podem conter nenhum outro recurso do InContext Editing. Se você tentar adicionar uma região repetitiva ou um grupo de regiões repetitivas a uma região editável, o Dreamweaver não permitirá que você realize a transformação.
Regiões repetitivas não devem conter Regiões editáveis nem Grupos de regiões repetitivas.
As regiões editáveis do InContext Editing não podem conter nenhum outro recurso do InContext Editing. Se você tentar adicionar uma região repetitiva ou um grupo de regiões repetitivas a uma região editável, o Dreamweaver não permitirá que você realize a transformação. Além disso, o Dreamweaver não transformará um elemento em uma região editável ou repetitiva se ele já contiver um grupo de regiões repetitivas.
A seleção atual já contém ou está dentro de uma Região repetitiva. Regiões repetitivas aninhadas não são permitidas.
Se a sua seleção estiver dentro de uma região repetitiva ou se houver uma região repetitiva dentro da seleção, o Dreamweaver não permitirá que você realize a transformação. O InContext Editing não oferece suporte a regiões repetitivas aninhadas.
A seleção deve conter exatamente uma região editável/repetitiva de modelo do Dreamweaver ou estar em qualquer região editável de modelo do Dreamweaver.
Ao trabalhar com arquivos de modelo do Dreamweaver (arquivos .dwt), você precisa seguir algumas regras. Para transformar uma região editável/repetitiva de modelo do Dreamweaver em uma região editável/repetitiva do InContext Editing, você precisa selecionar exatamente uma região editável/repetitiva de modelo do Dreamweaver na página e transformá-la. Para transformar outra seleção na página (por exemplo, um bloco de texto), a seleção precisa estar dentro de uma região editável de modelo do Dreamweaver.
Somente tags DIV podem ter os recursos Região editável e Região repetitiva aplicados ao mesmo tempo.
Se a sua seleção não for uma tag div e já tiver um atributo de região repetitiva aplicado a ela, o Dreamweaver não permitirá que você aplique também o atributo de região editável à tag. Somente as tags div podem ter atributos de região editável e repetitiva aplicados simultaneamente.
O Dreamweaver detectou que a tag Grupo de regiões repetitivas precede a Região repetitiva
Todas as regiões repetitivas do InContext Editing precisam existir dentro de um grupo de regiões repetitivas. Quando você adiciona uma nova região repetitiva a uma página, o Dreamweaver detecta se já existe um grupo de regiões repetitivas imediatamente anterior. Se existir, o Dreamweaver oferecerá a você a opção de adicionar a nova região repetitiva ao grupo de regiões repetitivas já existente, ou então criar um novo grupo de regiões repetitivas para conter a nova região repetitiva.
