O recurso de arquivos relacionados dá aos usuários acesso aos arquivos relacionados e de suporte associados ao arquivo no qual estão trabalhando. Os arquivos relacionados podem ser CSS, scripts, SSI (Inclusões do servidor) ou XML.
Por exemplo, se um arquivo CSS estiver associado ao arquivo principal, este recurso facilita a exibição e a edição do arquivo CSS. O usuário também pode exibir o arquivo principal enquanto edita o arquivo relacionado.
Agora, quando um documento é aberto a partir do caminho local do site e não é carregado a partir do servidor de teste, os URLs relativos de protocolo (começando com //) e os URLs de protocolo de arquivo (começando com file:// ou file:///), nos quais o recurso não está no computador local, são resolvidos através de http.
- Se os ativos não estiverem disponíveis em http, o Dreamweaver tentará carregar os arquivos relacionados por https.
- Se os ativos também não estiverem disponíveis em https, o Dreamweaver falhará ao carregar o arquivo relacionado ou os ativos. Além disso, uma caixa de diálogo de logon será exibida se o servidor de rede onde os ativos estão localizados precisar de autenticação.
Como funcionam os arquivos relacionados
Os arquivos relacionados melhoram a experiência de edição dos usuários, ajudando-os nas seguintes tarefas:
Os usuários podem exibir e acessar os arquivos relacionados enquanto exibem o arquivo principal. Ao exibir uma página que tenha arquivos relacionados (por exemplo, um arquivo CSS), você poderá ver o seguinte:
O design da página de um lado
O arquivo relacionado de outro
A barra de arquivos relacionados contém os documentos que afetam a geração de HTML pai. Os usuários podem ver o HTML de origem, o HTML gerado e os documentos filho de primeiro nível.
Ao selecionar qualquer arquivo relacionado exibido na barra de arquivos relacionados, os usuários podem realizar as seguintes tarefas:
Exibir e editar o arquivo relacionado na Visualização de código
Exibir a página pai na Visualização de design
Selecionar conteúdo na Visualização de design e fazer alterações no arquivo relacionado não descartam a seleção quando a Visualização de design é atualizada.
Se você alterar o código do arquivo relacionado, as alterações serão refletidas na Visualização de design.
Quando um arquivo não é encontrado, uma mensagem de que o arquivo não foi encontrado é exibida em uma barra na parte superior da janela vazia.
Terminologia dos arquivos relacionados
Os seguintes termos são frequentemente usados com os arquivos relacionados:
Termo |
Descrição |
Exemplo |
|---|---|---|
Documento de nível superior |
Qualquer documento aberto pelo usuário |
|
Documento pai |
Qualquer documento de nível superior exibido na Visualização de design. |
|
Documento filho de primeiro nível |
Qualquer documento que esteja um nível abaixo do documento pai. Esses documentos afetam a geração de código HTML, exceto os documentos CSS. Os arquivos CSS podem incluir outros arquivos CSS, mas todos juntos determinam os estilos finais aplicados à página. |
|
Documento filho de nível mais profundo |
Qualquer documento que esteja a mais de dois níveis de distância do documento pai. Esses documentos afetam a geração de código HTML. |
|
Arquivo não relacionado |
Qualquer documento que não afeta a geração de código HTML ou qualquer arquivo que um usuário não edite ativamente. |
|
Os seguintes arquivos relacionados são compatíveis:
Tipo |
Descrição |
Nível de aninhamento |
|---|---|---|
Script do lado do cliente |
Todos os idiomas |
1 (script de aninhamento não é possível) |
Inclusões do servidor |
Quando todas as seguintes condições extensíveis forem verdadeiras:
Exceção: instruções include file em estilo Apache (<!--#include ... -->) em documentos HTML são reconhecidas. |
1 |
Conjunto de dados Spry |
1 (script de aninhamento não é possível) |
|
CSS |
|
Infinito |
APIs de arquivos relacionados
Você pode personalizar o menu de arquivos relacionados para exibir o seguinte:
Nomes de arquivos relacionados
HTML de origem e o código de origem gerado
A função dreamweaver.openRelatedFile() exibe o arquivo relacionado na Visualização de código, e a função dreamweaver.getActiveRelatedFilePath() exibe o caminho do arquivo relacionado aberto no momento. Para obter mais informações sobre como usar essas APIs, consulte “Funções de arquivos relacionados” na Referência de API do Dreamweaver.