Observação:

Os widgets do Spry foram substituídos pelos widgets do jQuery no Dreamweaver CC e posterior. Embora ainda possa modificar os widgets do Spry existentes na página, você não pode adicionar novos.

Sobre widgets do Spry

Um widget do Spry é um elemento de página que enriquece a experiência do usuário por meio de interação. Um widget do Spry consiste no seguinte:

Estrutura do widget

Um bloco de código HTML que define a composição estrutural do widget.

Comportamento do widget

JavaScript que controla como o widget responde a eventos iniciados pelo usuário.

Estilo de widget

CSS que especifica a aparência do widget.

A estrutura do Spry utiliza um conjunto de widgets reutilizáveis desenvolvidos em HTML, CSS e JavaScript padrão. Você pode inserir facilmente esses widgets (o código é HTML e CSS bem simplificados) e, em seguida, aplicar o estilo. Os comportamentos na estrutura incluem funções que permitem aos usuários mostrar ou ocultar conteúdo na página, alterar a aparência (como cor) da página, interagir com itens de menu, e muito mais.

Cada widget na estrutura do Spry está associado a arquivos CSS e JavaScript exclusivos. O arquivo CSS contém tudo o que é necessário para criar o estilo do widget, e o arquivo JavaScript é responsável pela funcionalidade do widget. Quando você insere um widget usando a interface do Dreamweaver, o Dreamweaver vincula automaticamente esses arquivos à sua página, e o widget ganha funcionalidade e estilo.

Os arquivos CSS e JavaScript associados a determinado widget recebem o nome do widget para que você possa facilmente correlacionar os arquivos aos widgets. (Por exemplo, os arquivos associados ao widget Acordeão chamam-se SpryAccordion.css e SpryAccordion.js). Quando você insere um widget em uma página salva, o Dreamweaver cria um diretório SpryAssets no site e salva os arquivos JavaScript e CSS correspondentes nesse local.

Recursos e tutoriais dos dispositivos do spry

Os recursos online a seguir fornecem mais informações sobre como personalizar os dispositivos do Spry.

Amostras de dispositivos do Spry

Personalização de barras de menu do Spry no Dreamweaver

Dispositivos de validação do Spry (tutorial em vídeo)

Inserir um widget do Spry

  1. Selecione Inserir > Spry e escolha o widget a ser inserido.

Ao inserir um widget, Dreamweaver você automaticamente inclui os arquivos JavaScript e CSS necessários do Spry em seu site quando salva a página.

Observação:

Para inserir widgets do Spry, você também pode usar a categoria Spry no painel Inserir.

Selecionar um widget do Spry

  1. Mantenha o ponteiro do mouse sobre o widget até aparecer a estrutura azul com abas.
  2. Clique na aba no canto superior esquerdo do widget.

Editar um widget do Spry

  1. Selecione o widget para editá-lo e fazer alterações no Inspetor de propriedades (Janela > Propriedades).

Para obter detalhes sobre como efetuar alterações em determinados widgets, consulte as seções apropriadas a cada widget.

Criar o estilo de um widget do Spry

  1. Localize o arquivo CSS apropriado para o widget na pasta SpryAssets do site e edite o CSS de acordo com suas preferências.

Para obter detalhes sobre como criar o estilo de determinados widgets, consulte as seções apropriadas sobre personalização para cada widget.

Observação:

Você também pode formatar um widget do Spry editando os estilos no painel CSS, da mesma forma que faria com qualquer outro elemento com estilo na página.

Obter mais widgets

Há muito mais widgets da Web disponíveis além dos widgets do Spry instalados com o Dreamweaver. O Adobe Exchange fornece widgets da Web desenvolvidos por outros profissionais de criação.

  1. Escolha Procurar widgets da Web no menu Estender Dreamweaver, na Barra de aplicativos.

Para obter uma visão geral em vídeo da equipe de engenharia do Dreamweaver sobre o funcionamento com widgets da web, consulte www.adobe.com/go/dw10widgets_br.

Alterar a pasta de ativos padrão do Spry

Quando você insere um widget, um conjunto de dados ou um efeito do Spry em uma página salva, o Dreamweaver cria um diretório SpryAssets no site e salva os arquivos JavaScript e CSS correspondentes nesse local. Você pode alterar o local padrão em que o Dreamweaver salva os ativos do Spry, caso prefira salvá-los em outro local.

  1. Selecione Arquivos > Gerenciar sites.
  2. Selecione o seu site na caixa de diálogo Gerenciar sites e clique em Editar.
  3. Na caixa de diálogo Configuração de site, expanda as Configurações avançadas e selecione a categoria Spry.
  4. Informe um caminho para a pasta a ser usada para os ativos do Spry e clique em OK. Você também pode clicar no ícone de pasta para navegar até determinado local.

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online