Tags especiais

Tags especiais genéricas

 

Os arquivos HTML enviados ao site podem conter tags especiais que serão substituídas por conteúdo obtido do banco de dados da loja. Estas tags permitem criar páginas dinâmicas, sempre atualizadas com as informações sobre produtos, lançamentos, promoções, etc.


Com estas tags também é possível personalizar os menus de navegação e criar links para novas páginas. Clique aqui para ver exemplos de uso.


Tag:  <storeName> ou <nomeloja>

Substituída pelo nome da loja, informado em Dados da loja.

Tag:  <contactMail> ou <mailinfo>

Substituída pelo e-mail de contato, informado em Dados da loja.

Tag:  <storeMail> ou <mailloja>

Substituída pelo e-mail de pedidos, informado em Dados da loja.

Tag:  <storeDomain>

Substituída pelo domínio da loja com protocolo (http ou https).

Exemplos:

Lojas com domínio próprio:
http://www.meudominio.com.br

Lojas sem domínio próprio:
http://subdominio.lojavirtualfc.com.br

Tag:  <companyName>

Substituída pelo nome da empresa, informado em Dados da empresa.

Tag:  <companyDocument>

Substituída pelo CNPJ ou CPF, informado em Dados da empresa.

Tag:  <companyAddress>

Substituída pelo endereço da empresa, informado em Dados da empresa.

Tag:  <companyAddressInfo>

Substituída pelo endereço da empresa, informado em Dados da empresa. Inclui o nome do país.

Tag:  <companyPhone>

Substituída pelo telefone da empresa, informado em Dados da empresa.

Tag:  <StoreLanguage>

Substituída pelo número do idioma da loja com 2 dígitos, sendo 00=Português brasileiro, 01=inglês, 02=espanhol, 03=português de Portugal.

Tag:  <pathTo file="nomearquivo.ext">

Substituída pelo caminho para arquivo hospedado nas pastas da loja. Permite criar links para os arquivos .htm, .js, .css e para as imagens da loja.

Ex: Para criar link para uma imagem chamada Empresa.jpg existente na pasta /images, utilize <img src=<pathTo file="images/Empresa.jpg">>

No arquivo referenciado na tag <pathto>, é possível utilizar a tag <StoreLanguage>, que será substituída pelo número do idioma da loja com 2 dígitos.

Ex: Para referenciar um arquivo de resource de acordo com o idioma da loja, use <script src='<PathTo file="htm/js/resource-<StoreLanguage>.js">'></script>

Tag:  <pathAMP url="/caminho">

Substituída pela URL para página da loja acessada através do Google AMP Cache. Usar em páginas htm para voltar para AMP, se usar configuração de backlink, ou em páginas htm do AMP design (ex: amhbarratopo.htm).

Ex: Para criar link para a home da loja, utilize <a href=<pathAMP file="/">>

Tag:  <storePath> ou <baseloja>

Caminho para o diretório virtual da loja. Permite criar links para imagens do site e outros arquivos enviados.

Ex: Para criar link para uma imagem chamada Empresa.jpg, utilize
<img src="<storePath>images/Empresa.jpg">

ATENÇÃO: Para melhor performance na navegação, utilize a tag <pathTo> ao invés desta.

Tag:  <storeHTM> ou <HTMLoja>

Utilizada para criar links para páginas HTML enviadas. Ao serem acessadas, estas páginas serão posicionadas no corpo da loja.
Serão mantidos os menus e demais elementos fixos do site.

Ex: Para criar link para uma página chamada Empresa.htm, utilize
<a href="<storeHTM>Empresa.htm">

O link ficará desta forma:
<a href="/custom.asp?arq=Empresa.htm">

Tag:  <storeFuHTM> ou <HTMLojaUA>

Utilizada para criar links para páginas HTML enviadas, de acordo com a configuração de URL amigável da loja. Ao serem acessadas, estas páginas serão posicionadas no corpo da loja.
Serão mantidos os menus e demais elementos fixos do site.

Ex: Para criar link para uma página chamada Empresa.htm, utilize
<a href="<storeFuHTM>Empresa.htm">

Se a loja utiliza URL amigável, o link ficará desta forma:
<a href="/page,arq,Empresa.htm">
Caso contrário, o link ficará desta forma:
<a href="/custom.asp?arq=Empresa.htm">

Tag:  <storeId> ou <IDLoja> ou <IDLojaNum>

Esta tag é substituída pelo ID da loja.

Tag:  <Y>

Esta tag é substituída pelo valor do Y dinâmico, que varia para cada visitante. Utilizada para criar forms para as páginas do Fastcommerce.

Ex: Para incluir campo hidden com o Y correto, utilize

<input type="hidden" name="Y" value="<Y>">

A linha acima resulta em:

<input type="hidden" name="Y" value="1166564875496">

Tag:  <searchText>

Substituída pelo texto utilizado em busca de produtos, informado na URL pelo parâmetro &texto=. Esta tag poderá ser utilizada no campo de value da caixa de busca da loja, para exibir o texto da última busca realizada.

Tag:  <category> ou <categoria>

Substituída pela legenda utilizada para agrupar os produtos da loja, informado em Dados da loja. As legendas disponíveis são: Categoria, Linha, Departamento, Família, Griffe, Coleção, Marca, Seção.

Tag:  <categories> ou <categorias>

Utilize para obter o plural da legenda.

Tag:  <listCat>

Gera lista selecionável das categorias.

Para obter a lista aberta, especifique <listCat out="n">, onde n é o número de colunas. Caso contrário, a lista será exibida em um campo de seleção (tag <select>).

Ao ser selecionada uma categoria, a página com os produtos desta categoria será automaticamente acessada. Para desabilitar este comportamento automático e exibir um <select> simples para uso em formulários personalizados, utilize <listCat em="manual">.

Obs: Para otimizar a performance da loja, cada página pode conter até 5 tags <listCat>. As tags excedentes não serão substituídas.

Tag:  <listPathCat>

Gera lista hierárquica das categorias, caso a loja habilite o campo de subcategorias da página Dados da loja.

Inclua o parâmetro out="m" para alterar o design da lista, onde m é o número do layout:

  • Se o parâmetro out não for informado ou m for igual a 1, a lista será exibida em um campo de seleção (tag <select>). Neste caso, ao ser selecionada uma categoria, a página com os produtos desta categoria será automaticamente acessada. Para desabilitar este comportamento automático e exibir um <select> simples para uso em formulários personalizados, utilize <listPathCat em="manual">

  • Se m for igual a 2, 10 ou 11, a lista navegável será composta em HTML, CSS e javascript. Para obter a lista aberta, use <listPathCat id="n">, onde n é o número do ID da subcategoria, informado no topo da ficha da mesma no site administrativo. Informe valor negativo para n (de -1 a -5) para obter a lista aberta em até n sub-níveis.

  • Se m for igual a 10 e se um item for clicado, a lista navegável apresentará a hieraquia até os filhos e irmãos do item clicado. Os demais itens de primeiro nível serão exibidos fechados.

  • Se m for igual a 11 e se um item for clicado, a lista navegável apresentará a hieraquia até os filhos e irmãos do item clicado. Os demais itens de primeiro nível não serão exibidos. Útil para criar menus exclusivos de categorias.

  • Se m for igual a 12, a lista navegável apresentará somente o primeiro nível de categorias.

  • Se m for igual a 13, a lista será apresentada em uma estrutura hierárquica com as tags <div>, <ul> e <li>.

  • Se m for igual a 14, a lista será apresentada no array de objetos FCLib$.oCatMenu, pronto para ser consumido via javascript. Neste caso, a tag deverá ser incluída em um bloco inline de javascript, ou seja, entre as tags <script> e </script>

Exemplo:

<listPathCat out="10" id="-5">  (mostra menu em HTML aberto até o 2º sub-nível. Se um sub-item for clicado, os itens de primeiro nível serão apresentados fechados)

Obs: Para otimizar a performance da loja, cada página pode conter até 5 tags <listPathCat>. As tags excedentes não serão substituídas.

Tag:  <customerName> ou <NomeCliente>

Substituída pelo nome completo do cliente, conforme cadastro na loja. Utilize para tornar a navegação mais personalizada.
Ex: Frase Olá, Fulano! na página inicial.

Tag:  <customerImage> ou <FotoCliente>

Substituída pela URL da foto do cliente, conforme cadastro na loja. Esta imagem é obtida automaticamente caso o cliente tenha feito login na loja através do Facebook ou do Google.

Tag:  <tagCloud>

Substituída pelo conteúdo do arquivo TagCloud.htm, caso este exista na pasta HTM da loja e se o campo Tag Cloud estiver selecionado na página Dados da loja, que contém mais informações a respeito.

Tag:  <facebookAppID>

Substituída pelo ID da aplicação (AppID) da loja criada no Facebook , informado em Dados da loja > Redes sociais > Facebook > AppID

Tag:  <banner-json>

Substituída por um array de objetos JSON contendo os banners cadastrados na página Banners. Este array poderá ser utilizado por javascript para criar um carrossel de banners.


Para escolher os banners listados no array, utilize o atributo pos="xx,yy,...". Altere xx, yy pelas posições dos banners (de 1 a 250)


Exemplo:

<banners-json pos="88,99,100">

O exemplo acima só retornará os banners cadastrados nas posições 88, 99, 100 (<banner 88>, <banner 99> e <banner 100>). Se este parâmetro não for informado, retorna banners de todas as posições.


Para limitar a quantidade de banners listados no array, utilize o atributo max="xx". Altere xx pela quantidade desejada (de 1 a 20).


Exemplo:

<banners-json max="6">

O exemplo acima retornará apenas 6 banners.



Para determinar as informações em cada objeto JSON de banner, utilize o atributo info="x", onde x é um valor de 0 a 3. Seguem os campos retornados para cada valor:

  1. Retorna somente o id, a imagem e o alt do banner
  2. Inclui o id, a imagem, o alt e a URL do banner
  3. Inclui o id, a imagem, o alt, a URL e a posição do banner
  4. Inclui o id, a imagem, o alt, a URL, a posição, o nome, as datas e o peso do banner

Exemplo com vários parâmetros:

<banners-json info="3" max="6">


Exemplo de resultado:

[
   {
      "bannerID":1330,
      "image":"../lojas/00011264/images/fundotop2.jpg?cccfc=271b5be0",
      "imageMob":"../lojas/00011264/images/fundotop2-mob.jpg?cccfc=271b5be0",
      "alt":"Lançamentos",
      "url":"/banner-redir.ehc?idbanner=1330&url=%2Fprod%2Creleases%2C1%2Creleases%2Ehtm",
      "pos":12,
      "name":"Banner 12",
      "startDate":null,
      "endDate":null,
      "weight":5
   },
   {
      "bannerID":1329,
      "image":"../lojas/00011264/images/fundotop.jpg?cccfc=2731a151",
      "imageMob":"../lojas/00011264/images/fundotop-mob.jpg?cccfc=27331bc3",
      "alt":"Promoções",
      "url":"/banner-redir.ehc?idbanner=1329&url=%2Fprod%2Coffers%2C1%2Coffers%2Ehtm",
      "pos":11,
      "name":"Banner 11",
      "startDate":"2020-11-01T01:00:00",
      "endDate":"2020-11-02T23:00:00",
      "weight":5
   }
]


Observações:

  • A ordem dos banners listados no JSON será sempre randômica, obedecendo o parâmetro de peso no sorteio.
  • Cada banner listado no JSON NÃO SERÁ contabilizado como exibido. Para contabilizar, o JS do carrossel deverá chamar a página /banner-count.ehc?bannerid=99999, a cada banner exibido ao visitante. Substitua 99999 pelo ID do banner exibido.
  • A tag <banners-json> não lista banners que não podem ser exibidos (ex: fora da data de exibição ou que já atingiram limite de exibições)

Tag:  <banner 1> até <banner 250>

Serão substituídas pelos banners cadastrados na página Banners para as posições de <banner 1> a <banner 250>. Somente uma substituição será feita para cada número.

Tag:  <banner-image n>, <banner-image-mobile n>, <banner-redir n> e <banner-alt n>

Serão substituídas pelas informações dos banners cadastrados na página Banners para as posições de 1 a 250 (n). Somente uma substituição será feita para cada número.

  • banner-image: Caminho da imagem do banner
  • banner-image-mobile: Caminho da imagem do banner para utilizar na versão mobile da loja (insere o prefixo -mob no nome da imagem do banner. Ex: banner-home-mob.jpg)
  • banner-redir: URL de redirecionamento do banner
  • banner-alt: Atributo "alt" do banner

Obs¹: Caso a loja já utilize a tag <banner 1> (que já inclui a imagem, a URL de redirecionamento e o alt do banner 1), as tags <banner-image 1>, <banner-image-mobile 1>, <banner-redir 1> e <banner-alt 1> não serão substituídas na mesma página. O mesmo ocorre para os demais números (2 a 250).

Obs²: Para usar as tags <banner-redir 1> e <banner-alt 1>, a tag <banner-image 1> deve ser utilizada. O mesmo ocorre para os demais números (2 a 250).

Tag:  <cartValue> ou <ValorCesta> , <cartWeight> ou <PesoCesta>, <cartQty> ou <QtdCesta>

Serão substituídas pelos seguintes dados da cesta de produtos do visitante: valor total, peso total e quantidade de itens. É possível também utilizar XML ou AJAX para exibir dados da cesta. Veja os detalhes clicando na interrogação ao lado do campo Exibe dados da cesta, na página Dados da loja.

Tag:  <StoreInterests>

Substituída por variáveis em javascript que podem ser utilizadas nas funções que exibem parcelamento nos produtos da loja e desconto para pagamento à vista. São usados os parcelamentos cadastrados nas bandeiras de cartão de crédito na página Pagamentos do site administrativo. O campo de desconto à vista fica na página Dados da loja, seção Produtos.


Exemplo de script gerado pela tag:

<script>
var iPaymentDiscount=10.0;
var iMaxParcelsStore=6;
var ParcelsInterests=[0,0,0,1.99,1.99,1.99];
var ParcelsValues=[0,50.0,75.0,100.0,125.0,150.0];
</script>


No exemplo acima:

  • A loja oferece 10% de desconto para pagamento à vista, definido na variável iPaymentDiscount.
  • A loja parcela em até 6x, definido na variável iMaxParcelsStore.
  • A loja oferece 2x e 3x sem juros, e 4x, 5x e 6x com juros de 1,99% ao mês, definidos no array ParcelsInterests.
  • A loja oferece parcela mínima de R$ 25, onde R$ 50 em 2x, R$ 75 em 3x etc, definidos no array ParcelsValues.

Tag:  <includeHTML>

Substituída pelo arquivo .htm, .html, .js, .css ou .svg indicado no atributo src= da tag. Este arquivo deve existir na pasta HTM ou subpasta desta.


Exemplo:

<includeHTML src="outros/more.htm">


Para minificar o arquivo incluído, utilize o atributo minify="true". Serão removidos espaços duplicados, quebras de linha e comentários com a sintaxe /* coments */.


Ao incluir arquivos .js, utilize as tags <script> e </script> como no exemplo abaixo:


Exemplo:

<script>

<includeHTML src="js/autosuggest.js" minify="true">

</script>



Ao incluir arquivos .css, utilize as tags <style> e </style> como no exemplo abaixo:


Exemplo:

<style>

<includeHTML src="css/buytogether.css" minify="true">

</style>



Opcionalmente, pode-se utilizar os atributos param1= até param9=. Estes atributos serão substituídos respectivamente pelas tags <param1> até <param9>, caso estas existam nos arquivo incluídos.


Exemplo:

<includeHTML src="teste.htm" param1="Vitrine especial" param2="50" param3="#BB0000">


Os arquivos incluídos podem conter tags <includeHTML>, ou seja, é possível fazer inclusões dentro de inclusões, de forma recursiva. No total, até 20 tags <includeHTML> serão substituídas por arquivo e suas inclusões.

Tag:  <includeHTMLIn>

Substituída pelo arquivo .htm, .html, .js, .css ou .svg indicado no atributo src= nas páginas indicadas com o atributo in="nomedapagina". Onde em nomedapagina deve-se indicar em quais páginas este include será inserido. Este arquivo deve existir na pasta HTM ou subpasta.


Exemplo:

<includeHTMLIn src="teste.htm" in="home,categorias">

Neste exemplo o include será feito apenas quando o cliente estiver em home ou em categorias da loja. Se desejar que seja feito apenas na home da loja, insira apenas "home".

Opcionalmente, pode-se utilizar os atributos param1= até param9=. Estes atributos serão substituídos respectivamente pelas tags <param1> até <param9>, caso estas existam nos arquivo incluídos.


Exemplo:

<includeHTMLIn src="teste.htm" in="home,categorias" param1="Vitrine especial" param2="50" param3="#BB0000">

No total, até 2 tags <includeHTMLIn> serão substituídas por arquivo e suas inclusões.


Nomes das páginas que podem ser usadas no parâmetro "in":

home, categorias, listaprodutos, account, cadastro, addmult, addproduto, buscaavancada, checkout, faleconosco, custom, ajuda, noticias, newsletter, opiniao, indique, track, wishlist


Para minificar o arquivo incluído, utilize o atributo minify="true". Serão removidos espaços duplicados, quebras de linha e comentários com a sintaxe /* coments */.


Ao incluir arquivos .js, utilize as tags <script> e </script> como no exemplo abaixo:


Exemplo:

<script>

<includeHTMLIn src="js/autosuggest.js" in="home,categorias" minify="true">

</script>



Ao incluir arquivos .css, utilize as tags <style> e </style> como no exemplo abaixo:


Exemplo:

<style>

<includeHTMLIn src="css/buytogether.css" in="home,categorias" minify="true">

</style>

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>

Tag:  <prod>

Permite o posicionamento de informações de produtos selecionados. Possui a seguinte sintaxe:

<prod [em="[lanc],[prom],[capa],[rand]"] [out="[n]"] [id="idprod1,idprod2,..."] [cod="codprod1,codprod2,..."] [cat="catprod1,catprod2,..."]>

onde:

em indica onde o produto se enquadra (opções podem ser combinadas, entre vírgulas):

  • lanc: produto em lançamento

  • prom: em promoção

  • capa: em destaque para capa

  • rand: sorteia novo produto a cada 120 minutos

out define o layout selecionado (onde n>=1). Se omitido, será utilizado o layout 1. Para personalizar, envie arquivo EstiloProdutoOut.htm e informe p1 a p255. Clique aqui para ver exemplos de cada layout disponível para home e para barra direita.

id permite especificar o ID interno do produto.
Pode-se informar até 10 IDs de 6 dígitos, separados por vírgula.

cod permite especificar o código do produto.
Pode-se informar até 4 códigos de 15 caracteres, separados por vírgula.

cat permite especificar a categoria do produto.
Pode-se informar até 4 categorias de 25 caracteres, separadas por vírgula.

a1 permite especificar o descritor especial 1 do produto.
Pode-se informar até 4 descritores de 30 caracteres, separados por vírgula.

a2 permite especificar o descritor especial 2 do produto.
Pode-se informar até 4 descritores de 30 caracteres, separados por vírgula.

a3 permite especificar o descritor especial 3 do produto.
Pode-se informar até 4 descritores de 30 caracteres, separados por vírgula.


Exemplos:

<prod em="lanc">  (mostra produto em oferta, no layout 1)

<prod cod="XP221">  (mostra produto cód XP221, no layout 1)

<prod cat="Som" em="rand">  (sorteia produto da categoria Som)

<prod id="2343,2312,3451" em="rand">  (sorteia produto entre 3 IDs)

<prod a3="nike,adidas">  (nike ou adidas no descritor especial 3)

<prod em="rand,prom,capa">  (sorteia produto em promoção na capa)

<prod em="rand" out="5">  (sorteia produto, com layout 5)


Obs: Para otimizar a performance da loja, cada página pode conter até 100 tags <prod>. As tags excedentes não serão substituídas.

 

Tags especiais para redes sociais:

Para utilizar estas tags, é necessário marcar o campo Usar tags especiais da seção de redes sociais da página Dados da loja.


Tag:  <shareFacebook>

Substituída pelo ícone pequeno do Facebook, que poderá ser clicado pelo visitante para compartilhar a página atual no seu perfil no Facebook.

Tag:  <shareTwitter>

Substituída pelo ícone pequeno do Twitter, que poderá ser clicado pelo visitante para twittar a página atual em seu profile no Twitter.

Tag:  <sharePinterest>

Substituída pelo ícone pequeno do Pinterest, que poderá ser clicado pelo visitante para compartilhar a página atual no seu perfil no Pinterest.

Tag:  <facebook type="plugin">

Substituída pelo código do Facebook que exibirá um social plugin do Facebook. Estes plugins são utilizados para que o visitante possa comentar, recomendar, curtir ou enviar a página atual para seu perfil no Facebook.


Plugins mais utilizados:

<facebook type="comments">: exibe os comentários feitos pelos visitantes sobre a página atual (ex: comentários sobre um determinado produto). Estes comentários podem ser moderados pela loja, se o campo Facebook AppID da página Dados da loja estiver preenchido e a aplicação estiver corretamente configurada no Facebook. Clique aqui para mais informações.


<facebook type="like-box">: exibe uma caixa de integração com diversos recursos configuráveis: botão Like, stream de posts da página e faces das pessoas que curtiram-na. Para utilizar esta tag, é necessário preencher o campo Page da seção Facebook, na página Dados da loja. Clique aqui para mais informações.


<facebook type="like">: exibe o botão Curtir. Esta tag pode também ser configurada para exibir o botão Recomendar (veja abaixo nos exemplos de parâmetros).


<facebook type="send">: exibe o botão Enviar. Esta tag permite ao visitante enviar um resumo da página atual para um amigo no Facebook.


<facebook type="recommendations">: exibe uma caixa de objetos relacionados à página atual.


<facebook type="activity">: exibe uma caixa de objetos relacionados às atividades mais recentes na página atual.


É possível incluir parâmetros para configurar os recursos de cada plugin.


Exemplos:

<facebook type="comments" width="700" num_posts="5">

Exibe os 5 posts mais recentes em uma caixa de 700 pixels de largura.


<facebook type="like" send="true" layout="button_count" show_faces="false">

Exibe botão Curtir com contador e sem exemplificar nomes de pessoas que curtiram a página.


<facebook type="like-box" width="160" show_faces="true" stream="true" header="true">

Exibe caixa de integração com os principais recursos ativados.


Clique aqui para mais informações sobre cada plugin e para obter os respectivos parâmetros.


Tag:  <twitterProfile data-widget-id="999999999999999999">

Substituída pelo código do Twitter que exibirá uma caixa com os tweets mais recentes do perfil da loja no Twitter. Para utilizar esta tag, é necessário autorizar publicações através do botão de autorização da seção Twitter da página Dados da loja e criar um id para este widget, acessando a sua conta do Twitter, em Configurações > Widgets > Botão "Criar novo" > Aba "Histórico do usuário" > Preencha as opções e clique em "Criar Widget", copie o valor informado em data-widget-id do código gerado para usar em sua tag twitterProfile conforme o exemplo a esquerda.


É possível incluir parâmetros para configurar os recursos deste widget.


Exemplos:

<twitterProfile data-widget-id="999999999999999999" width="300" height="300">

Exibe os posts mais recentes em uma caixa de 300 pixels de largura e 300 pixels de altura.


<twitterProfile data-widget-id="999999999999999999" data-tweet-limit="3">

Exibe apenas os 3 posts mais recentes.


<twitterProfile data-widget-id="999999999999999999" data-chrome="nofooter noborders transparent" data-link-color="#cc0000">

Exibe os posts sem rodapé, sem bordas e transparente no widget e com as cores do links em vermelho.


Veja mais detalhes sobre a personalização deste recurso.

Clique aqui para mais informações sobre este recurso do Twitter.