- Seção
FC 15020 :: Como criar tags personalizadas?
Utilize as tags personalizadas nos arquivos CSS, JS e HTML da loja, para facilitar e agilizar alterações nestes arquivos.
É possível criar tags personalizadas para facilitar as alterações dos textos contidos nos arquivos que compõem o design da loja, personalizar as imagens e cores utilizadas no CSS, inicializar variáveis utilizadas em JS etc.
Seguem os passos para a criação das tags personalizadas:
1º Passo
Acesse Textos & imagens > Textos e Tags, na seção Tags personalizadas marque o campo Utilizar tags personalizadas e clique em Gravar ao final da página.
Acesse novamente a seção Textos e Tags e clique na seta ao lado direito do campo Utilizar tags personalizadas.
2º Passo
Na janela Cadastro de Tags, preencha os seguintes campos:
- Nome: informe o nome da tag (exemplo: Telefone).
- Descrição: informe a finalidade da tag (exemplo: mostrar o telefone de contato).
- Tipo: marque o campo JS se a tag for utilizada em arquivos .js, CSS para arquivos .css, HTM para arquivos .htm e .html e PROD para os arquivos EstiloProduto.htm e EstiloProdutoOut.htm.
- Grupo: opcionalmente, selecione no campo Grupo o arquivo onde a tag é mais utilizada. Se preferir, clique no ícone ao lado do campo para criar um novo grupo.
- Ativa: marque para ativar ou desativar a tag.
- Conteúdo: preencha com o conteúdo da sua tag, seja ela um texto simples, um código CSS, JS ou HTM.
Após preencher os campos, clique no botão Incluir para gravar a nova tag.
3º Passo
Para saber qual é o nome da sua tag que vai adicionar ao código basta clicar sobre a tag e verificar a informação indicada no destaque.
4º Passo
Agora basta editar o arquivo no qual a tag vai ser utilizada, inserir a tag e gravar. Assim ela vai poder aparecer na loja.
As tags personalizadas podem ser utizadas diretamente nos arquivos HTML que compõem o design loja (exemplo: BarraEsquerda.htm). Para incluir estas tags em arquivos .js e .css, utilize a tag especial <IncludeTagged> para referenciar estes arquivos.
A tag <IncludeTagged> é substituída por referência ao arquivo .js ou .css indicado no atributo src= da tag. Este arquivo deve existir na pasta HTM ou subpasta desta. O arquivo poderá conter tags personalizadas pela loja, para facilitar sua alteração.
Utilize o atributo async para que o carregamento do arquivo ocorra de forma assíncrona.
Exemplo: <IncludeTagged src="css/cores.css" async>
|
