- Guia do usuário do Dreamweaver
- Introdução
- Dreamweaver e Creative Cloud
- Áreas de trabalho e exibições do Dreamweaver
- Configurar sites
- Sobre sites do Dreamweaver
- Configurar uma versão local do site
- Conectar-se a um servidor de publicação
- Configurar um servidor de teste
- Importar e exportar configurações de site do Dreamweaver
- Trazer sites existentes de um servidor remoto para a raiz do site local
- Recursos de acessibilidade do Dreamweaver
- Configurações avançadas
- Definir preferências de site para transferência de arquivos
- Especificar configurações do servidor proxy no Dreamweaver
- Sincronizar as configurações do Dreamweaver com a Creative Cloud
- Como usar o Git no Dreamweaver
- Gerenciar arquivos
- Criar e abrir arquivos
- Gerenciamento de arquivos e pastas
- Obter e colocar arquivos no servidor
- Devolver e retirar arquivos
- Sincronizar arquivos
- Comparar arquivos em busca de diferenças
- Encobrir arquivos e pastas em seu site do Dreamweaver
- Ativar as Design Notes para sites do Dreamweaver
- Impedir possível ataque ao Gatekeeper
- Layout e design
- CSS
- Noções sobre as folhas de estilos em cascata
- Aplicar layout às páginas usando o CSS Designer
- Usar pré-processadores de CSS no Dreamweaver
- Como definir preferências de estilo CSS no Dreamweaver
- Mover regras de CSS no Dreamweaver
- Converter CSS inline em uma regra de CSS no Dreamweaver
- Trabalhar com tags div
- Aplicação de degradês ao fundo
- Criar e editar efeitos de transição do CSS3 no Dreamweaver
- Formatar código
- Conteúdo e ativos de página
- Definir propriedades da página
- Configurar propriedades de cabeçalho e propriedades de link de CSS
- Trabalhar com texto
- Localizar e substituir texto, tags e atributos
- Painel DOM
- Editar na Visualização dinâmica
- Codificar documentos do Dreamweaver
- Selecionar e exibir os elementos na janela Documento
- Definir propriedades de texto no Inspetor de propriedades
- Verificar ortografia de uma página Web
- Usar regras horizontais no Dreamweaver
- Adicionar e modificar combinações de fontes no Dreamweaver
- Trabalhar com ativos
- Inserir e atualizar datas no Dreamweaver
- Criar e gerenciar ativos favoritos no Dreamweaver
- Inserir e editar imagens no Dreamweaver
- Adicionar objetos de mídia
- Adição de vídeos no Dreamweaver
- Inserir vídeo HTML5
- Inserir arquivos SWF
- Adicionar efeitos de áudio
- Inserir áudio HTML5 no Dreamweaver
- Trabalhar com itens da biblioteca
- Usar texto em árabe e hebraico no Dreamweaver
- Vinculação e navegação
- Efeitos e widgets do jQuery
- Programar sites
- Sobre codificação no Dreamweaver
- Ambiente de codificação no Dreamweaver
- Definir preferências de codificação
- Personalizar codificação por cores
- Escrever e editar código
- Dicas de código e preenchimento de código
- Recolher e expandir código
- Reutilizar código com snippets
- Linting de código
- Otimizar código
- Editar código na Visualização de design
- Trabalhar com conteúdo do cabeçalho das páginas
- Inserir inclusões de servidor no Dreamweaver
- Usar bibliotecas de tags no Dreamweaver
- Importar tags personalizadas para o Dreamweaver
- Usar comportamentos JavaScript (instruções gerais)
- Aplicar comportamentos internos do JavaScript
- Sobre XML e XSLT
- Executar transformações XSL do servidor no Dreamweaver
- Executar transformações XSL do cliente no Dreamweaver
- Adicionar entidades de caracteres para XSLT no Dreamweaver
- Formatar código
- Fluxos de trabalho entre produtos
- Instalar e usar extensões no Dreamweaver
- Atualizações dentro do aplicativo no Dreamweaver
- Inserir documentos do Microsoft Office no Dreamweaver (somente Windows)
- Trabalho com o Fireworks e o Dreamweaver
- Editar conteúdo em sites do Dreamweaver usando o Contribute
- Integração do Business Catalyst ao Dreamweaver
- Criar campanhas de email personalizadas
- Modelos
- Sobre os modelos do Dreamweaver
- Reconhecimento de modelos e documentos baseados em modelo
- Criar um modelo do Dreamweaver
- Criar regiões editáveis nos modelos
- Criar regiões e tabelas repetitivas no Dreamweaver
- Usar regiões opcionais em modelos
- Definir atributos de tag editáveis no Dreamweaver
- Como criar modelos aninhados no Dreamweaver
- Editar, atualizar e excluir modelos
- Exportar e importar conteúdo xml no Dreamweaver
- Aplicar ou remover um modelo em um documento
- Editar conteúdo em modelos do Dreamweaver
- Regras de sintaxe para tags de modelo no Dreamweaver
- Definir preferências de realce para regiões de modelo
- Vantagens de usar modelos no Dreamweaver
- Dispositivo móvel e multitela
- Sites dinâmicos, páginas e formulários Web
- Noções sobre aplicativos Web
- Configurar o computador para desenvolvimento de aplicativos
- Solucionar problemas de conexões de banco de dados
- Remover scripts de conexão no Dreamweaver
- Criar páginas dinâmicas
- Visão geral das fontes de conteúdo dinâmico
- Definir origens de conteúdo dinâmico
- Adicionar conteúdo dinâmico a páginas
- Alterar conteúdo dinâmico no Dreamweaver
- Exibir registros de banco de dados
- Fornecer e solucionar problemas de live data no Dreamweaver
- Adicionar comportamentos personalizados de servidor no Dreamweaver
- Criar formulários usando o Dreamweaver
- Usar formulários para reunir informações de usuários
- Criar e ativar formulários do ColdFusion no Dreamweaver
- Criar formulários Web
- Suporte aprimorado a HTML5 para elementos de formulário
- Desenvolver um formulário usando o Dreamweaver
- Criação visual de aplicativos
- Criar páginas mestre e detalhadas no Dreamweaver
- Criar páginas de pesquisa e de resultados
- Criar uma página de inserção de registro
- Criar uma página de registro de atualização no Dreamweaver
- Criar páginas de exclusão de registro no Dreamweaver
- Usar comandos ASP para modificar um banco de dados no Dreamweaver
- Criar uma página de registro
- Criar uma página de logon
- Criar uma página que apenas usuários autorizados podem acessar
- Proteger pastas no ColdFusion usando o Dreamweaver
- Usar componentes do ColdFusion no Dreamweaver
- Testar, visualizar e publicar sites
- Solução de problemas
Saiba como inserir e editar objetos de mídia em páginas da Web do Dreamweaver, usar o Design Notes e muito mais.
Além de arquivos SWF e FLV, você pode inserir outros objetos de áudio ou vídeo em um documento do Dreamweaver. Se você inseriu atributos de acessibilidade com um objeto de mídia, poderá definir atributos de acessibilidade e editar esses valores no código HTML.
-
Coloque o ponto de inserção na janela Documento onde deseja inserir o objeto.
-
Insira o objeto seguindo um destes procedimentos:
Na categoria HTML do painel Inserir, selecione o ícone referente ao tipo de objeto a ser inserido.
Selecione o objeto apropriado no submenu Inserir > HTML.
Uma caixa de diálogo será exibida, permitindo que você selecione um arquivo de origem e especifique determinados parâmetros para o objeto de mídia.
Observação:para evitar que essas caixas de diálogo apareçam, selecione Editar > Preferências > Geral (Windows) ou Dreamweaver > Preferências > Geral (Macintosh) e desmarque a opção Mostrar caixa de diálogo ao inserir objetos. Para anular qualquer preferência definida para a exibição de caixas de diálogo, mantenha pressionada a tecla Control (Windows) ou Option (Macintosh) enquanto insere o objeto.
-
Complete a caixa de diálogo Selecionar arquivo e clique em OK.Observação:
a caixa de diálogo Atributos de acessibilidade é exibida se você tiver optado por mostrar atributos ao inserir a mídia na caixa de diálogo Editar > Preferências.
-
Defina os atributos de acessibilidade.Observação:
você também pode editar os atributos do objeto de mídia selecionando o objeto e editando o código HTML na Visualização de código, ou clicando com o botão direito do mouse (Windows) ou mantendo a tecla Control pressionada enquanto clica (Macintosh), e selecionando Editar código de tag.
Título
Digite um título para o objeto de mídia.
Chave de acesso
Digite um equivalente de teclado (uma letra) na caixa de texto para selecionar o objeto de formulário no navegador. Isso permite que um visitante do site use a tecla Control (Windows) com a tecla de acesso para acessar o objeto. Por exemplo, se você digitar B como tecla de acesso, use Control+B para selecionar o objeto no navegador.
Índice de abas
Digite um número para a ordem de abas do objeto de formulário. A definição de uma ordem de abas é útil quando há outros links e objetos de formulário na página e o usuário precisa percorrer esses itens em uma ordem específica. Se você definir a ordem das abas de um objeto, não deixe de definir essa ordem para todos eles.
-
Clique em OK para inserir o objeto de mídia.Observação:
se você clicar em Cancelar, um alocador de espaço de objeto de mídia aparecerá no documento, mas o Dreamweaver não associará tags ou atributos de acessibilidade a ele.
Para especificar um arquivo de origem ou definir dimensões e outros parâmetros e atributos, use o Inspetor de propriedades para cada objeto. Você pode editar os atributos de acessibilidade de um objeto.
Iniciar um editor externo para arquivos de mídia
Você pode iniciar um editor externo no Dreamweaver para editar a maioria dos arquivos de mídia. Também é possível especificar o editor que o Dreamweaver iniciará para editar o arquivo.
-
Verifique se o tipo de arquivo de mídia está associado a um editor no sistema.
Para descobrir que editor está associado ao tipo de arquivo, selecione Editar > Preferências no Dreamweaver e selecione Tipos de arquivos/editores na lista Categoria. Clique na extensão do arquivo na coluna Extensões para exibir o(s) editor(es) associado(s) na coluna Editores. Você pode alterar o editor associado a um tipo de arquivo.
-
Clique duas vezes no arquivo de mídia no painel Arquivos para abri-lo no editor externo.
O editor iniciado quando você clica duas vezes no arquivo no painel Arquivos é chamado editor principal. Se você clicar duas vezes em um arquivo de imagem, por exemplo, o Dreamweaver abrirá o arquivo no editor externo de imagem principal como Adobe Fireworks.
-
Se você não deseja usar o editor externo principal para editar o arquivo, poderá usar outro editor no sistema para editar o arquivo seguindo um destes procedimentos.
No painel Arquivos, clique com o botão direito do mouse (Windows) ou mantenha pressionada a tecla Control enquanto clica (Macintosh) no nome de arquivo e selecione Abrir com no menu de contexto.
Na Visualização de design, clique o botão direito do mouse (Windows) ou mantenha pressionada a tecla Control enquanto clica (Macintosh) no elemento de mídia na página atual, e selecione Editar com no menu de contexto.
Especificar o editor a ser iniciado no Dreamweaver
Você pode especificar o editor que o Dreamweaver deve usar para editar um tipo de arquivo e adicionar ou excluir tipos de arquivo que o Dreamweaver reconheça.
Especificar explicitamente quais editores externos devem ser iniciados para um determinado tipo de arquivo
-
Selecione Editar > Preferências e, em seguida, selecione Tipos de arquivos/editores na lista Categoria.
Extensões de nome de arquivo, como .gif, .wav e .mpg, são listadas à esquerda, abaixo de Extensões. Os editores associados de uma extensão selecionada são listados à direita, abaixo de Editores.
-
Selecione a extensão de tipo de arquivo na lista Extensões e siga um destes procedimentos:
Para associar um novo editor ao tipo de arquivo, clique no botão de adição (+) acima da lista Editores e preencha a caixa de diálogo exibida.
Por exemplo, selecione o ícone de aplicativo para que o Acrobat o associe ao tipo de arquivo.
Para tornar um editor o editor principal para um tipo de arquivo (ou seja, o editor que é aberto quando você clica duas vezes no tipo de arquivo no painel Arquivos), selecione o editor na lista Editores e clique em Tornar primário.
Para dissociar um editor de um tipo de arquivo, selecione o editor na lista Editores e clique no botão de subtração (-) acima da lista Editores.
Adicionar um novo tipo de arquivo e editor associado
-
Clique no botão de adição (+) acima da lista Extensões e digite uma extensão de tipo de arquivo (incluindo o ponto no início da extensão) ou várias extensões relacionadas separadas por espaços.
Por exemplo, você poderia digitar .xml .xsl se quisesse associá-los a um editor XML instalado no sistema.
-
Selecione um editor para o tipo de arquivo clicando no botão de adição (+) acima da lista Editores e preenchendo a caixa de diálogo exibida.
Remover um tipo de arquivo
-
Selecione o tipo de arquivo na lista Extensões e clique no botão de subtração (-) acima da lista Extensões.Observação:
não é possível desfazer a remoção de um tipo de arquivo. Portanto, é preciso ter a certeza de que deseja removê-lo.
Usar as Design Notes com objetos de mídia
Assim como com outros objetos do Dreamweaver, você pode adicionar Design Notes a um objeto de mídia. As Design Notes são notas associadas a um arquivo específico que são armazenadas em um arquivo separado. Você pode usar as Design Notes para controlar as informações de arquivo extras associadas aos documentos, como nomes de arquivo de origem de imagem e comentários sobre status de arquivos.
-
Clique com o botão direito do mouse (Windows) ou mantenha pressionada a tecla Control enquanto clica (Macintosh) no objeto na janela Documento.Observação:
você deve definir o site antes de adicionar as Design Notes a qualquer objeto.
-
Selecione Design Notes da página no menu de contexto.
-
Digite as informações desejadas na Design Note.Observação:
você também pode adicionar uma Design Note a um objeto de mídia no painel Arquivos selecionando o arquivo, revelando o menu de contexto e escolhendo as Design Notes no menu de contexto.
Adicionar vídeo (não FLV)
Você pode adicionar vídeo à página da Web de diferentes formas e usando diferentes formatos. O vídeo pode ser baixado para o usuário ou pode ser transmitido de modo que seja reproduzido durante o download.
-
Coloque o clipe na pasta do site.
Esse clipes estão geralmente no formato de arquivo AVI ou MPEG.
-
Vincule-se ao clipe ou incorpore-o na página.
Para vincular o clipe, digite um texto para o link, como “Clipe de Download”, selecione o texto e clique no ícone de pasta no Inspetor de propriedades. Navegue até o arquivo de vídeo e selecione-o.
Observação:o usuário deve baixar um aplicativo de ajuda (um plug-in) para exibir formatos comuns de fluxo contínuo, como Real Media, QuickTime e Windows Media.
Inserir conteúdo de plug-in
Você pode criar um conteúdo como um filme QuickTime para um plug-in de um navegador e, em seguida, usar o Dreamweaver para inserir esse conteúdo em um documento HTML. Os plug‑ins mais comuns são RealPlayer e QuickTime, ao passo que alguns arquivos de conteúdo incluem mp3s e filmes QuickTime.
Você pode visualizar filmes e animações que se baseiam nos plug-ins de navegador diretamente na Visualização de design da janela Documento. É possível reproduzir todos os elementos de plug-in simultaneamente para ver como a página aparecerá para o usuário ou reproduzir cada um individualmente para garantir que você incorporou o elemento de mídia correto.
você não pode visualizar filmes ou animações que se baseiam em controles ActiveX.
Após a inserção do conteúdo para um plug-in do , use o Inspetor de propriedades para definir parâmetros para esse conteúdo. Para exibir as propriedades a seguir no Inspetor de propriedades, selecione um objeto de plug-in.
Inicialmente, o Inspetor de propriedades exibe as propriedades mais utilizadas. Clique na seta de expansão no canto inferior direito para ver todas as propriedades.
Inserir conteúdo de plug-in e definir suas propriedades
-
Na Visualização de design da janela Documento, coloque o ponto de inserção no local em que deseja inserir o conteúdo e siga um destes procedimentos:
Na categoria Comum do painel Inserir, clique no botão Mídia e selecione o ícone Plug-in no menu.
Selecione Inserir > Mídia > Plug-in.
-
Na caixa de diálogo exibida, selecione um arquivo de conteúdo para um plug-in do e clique em OK.
-
Defina as opções de plug-in no Inspetor de propriedades.
Nome
Especifica um nome para identificar o plug-in para script. Digite um nome na caixa de texto sem rótulo no lado esquerdo do Inspetor de propriedades.
L e A
Especifica, em pixels, a largura e a altura alocadas para o objeto na página.
Origem
Especifica o arquivo de dados de origem. Clique no ícone de pasta para navegar até um arquivo ou digite um nome de arquivo.
URL do Plg
Especifica o URL do atributo pluginspace. Digite o URL completo do site em que os usuários podem baixar o plug-in. Se o usuário que estiver visualizando a página não tiver o plug-in, o navegador tentará baixá-lo a partir deste URL.
Alinhar
Determina como o objeto é alinhado na página.
Espaço V e Espaço H
Especifica o número de pixels de espaço em branco acima, abaixo e em ambos os lados do plug-in.
Borda
Especifica a largura da borda em torno do plug-in.
Parâmetros
Abre uma caixa de diálogo para a inserção de parâmetros adicionais que serão transmitidos ao plug-in. Vários plug-ins respondem a parâmetros especiais.
Você também pode exibir os atributos atribuídos ao plug-in selecionado clicando no botão Atributo. É possível editar, adicionar e excluir atributos como largura e altura nesta caixa de diálogo.
Reproduzir conteúdo de plug-in na janela Documento
-
Insira um ou mais elementos de mídia usando um dos métodos descritos na seção anterior.
-
Siga um destes procedimentos:
Selecione um dos elementos de mídia inserido e, em seguida, selecione Exibir > Plug-ins > Reproduzir ou clique no botão Reproduzir no Inspetor de propriedades.
Selecione Exibir > Plug-ins > Reproduzir tudo para reproduzir todos os elementos de mídia na página selecionada baseada nos plug‑ins.
Observação:o recurso Reproduzir tudo se aplica somente ao documento atual. Ele não se aplica a outros documentos em um conjunto de quadros, por exemplo.
Interromper reprodução do conteúdo de plug-in
-
Selecione um elemento de mídia e, em seguida, selecione Exibir > Plug-ins > Parar ou clique no botão Parar do Inspetor de propriedades.
Você também pode selecionar Exibir > Plug-ins > Parar tudo para interromper a reprodução de todo o conteúdo de plug-in.
Solucionar problemas de plug-ins
Se você seguiu as etapas de reprodução do conteúdo de plug-in na janela Documento, mas ainda não consegue reproduzir algum conteúdo, tente o seguinte:
Verifique se o plug-in associado está instalado no computador e se o conteúdo é compatível com a versão do plug-in que você tem.
Abra o arquivo Configuration/Plugins/UnsupportedPlugins.txt em um editor de texto e verifique se o plug-in problemático está listado. Esse arquivo controla os plug-ins que ocasionam problemas no Dreamweaver e que, portanto, não recebem suporte. (Se você está com problemas em um plug-in específico, é recomendável adicioná-lo a esse arquivo.)
Verifique se há memória suficiente. Alguns plug-ins requerem mais 2 a 5 MB de memória para serem executados.
Usar comportamentos para controlar mídia
Você pode adicionar comportamentos à página para iniciar e interromper vários objetos de mídia.
Controlar Shockwave ou Flash
Reproduza, interrompa, retroceda ou vá para um quadro em um filme Shockwave ou arquivo SWF.
Tocar som
Permite reproduzir um som; por exemplo, você pode reproduzir um efeito de som sempre que o usuário move o ponteiro do mouse sobre um link.
Verificar plug-in
Permite verificar se os visitantes do site têm o plug-in necessário instalado e, em seguida, os roteiam a diferentes URLs, dependendo o plug-in dos visitantes. Isso se aplica somente a plug-ins do , já que o comportamento Verificar plug-in não verifica controles ActiveX.
Usar parâmetros para controlar objetos de mídia
Defina parâmetros especiais para controlar arquivos SWF e plug-ins. Os parâmetros são usados com as tags object, embed e applet. Os parâmetros definem atributos específicos a diferentes tipos de objetos. Por exemplo, um arquivo SWF pode usar um parâmetro de qualidade <paramname="quality"value="best"> para a tag de objeto. A caixa de diálogo Parâmetro está disponível no Inspetor de propriedades. Consulte a documentação do objeto que você está usando para obter informações sobre os parâmetros necessários.
não há um padrão amplamente aceito para a identificação de arquivos de dados para controles ActiveX. Consulte a documentação do controle ActiveX que você está usando para descobrir quais parâmetros devem ser utilizados.
Inserir um nome e valor para um parâmetro
-
Selecione um objeto que possa ter parâmetros na janela Documento.
-
Abra o Inspetor de propriedades caso ele ainda não esteja aberto e clique no botão Parâmetros localizado na metade inferior do Inspetor de propriedades. (Verifique se o Inspetor de propriedades está expandido.)
-
Clique no botão de adição (+) e digite o nome e valor de parâmetro nas colunas apropriadas.
Remover um parâmetro
-
Selecione um parâmetro e pressione o botão de subtração (–).
Reordenar parâmetros
-
Selecione um parâmetro e use os botões de seta para cima e para baixo.