Inserir mais uma aba de "características"



  • Muito Obrigado @charles



  • Gostaria de implantar na minha loja também as novas abas nos produtos -
    ID da loja: 89698



  • @charles Gostaria de adicionar na minha loja aba adicional de caracteristica . Não tenho acesso ao código para fazer essa adição é a minha primeira loja na Xtech sou desenvolvedor.

    ID da loja: 111483

    Como faço para cadastrar como desenvolvedor, goommerce não é lançado nunca



  • @charles Gostaria muito de implementar no nosso site. Pois a aba Cuidados e limpeza é fundamental para nosso produto



  • @charles

    @charles disse em Inserir mais uma aba de "características":

    Olá @noxsolucoes, bem isso é feito por personalização nas lojas, não vem na plataforma, então eu já adicionei o código com esse tipo de programação na sua loja e já pode ser realizado esse tipo de ação em sua loja. Então eu fiz um modelo preview de como ficou na sua loja nesse produto: https://roger-pneus.xtechcommerce.com/home/Calota-Calotinha-Centro-Roda-Audi-A3-A4-A5-A6-A7 e no seu painel administrativo já foi feito 2 abas com um modelo de funcionamento explicativo de como é feito, basta seguí-los. Para encontrar isso no seu painel, vai no menu em LAYOUT > CONTEÚDOS > Abas do Produto I - [Max: 50 itens] e lá tem os detalhes de modelo de exemplo.

    Qualquer dúvida sobre o uso, é só falar comigo!

    @charles Você consegue me dar uma posição sobe a inclusão dessa nova Aba porfavor. Vamos lançar nosso site na quinta-feira. Preciso inserir Aba garantia e cuidados com os tapetes



  • Olá @tapetemais, segue o código bem simples para add a funcionalidade:

    1 - Add o código no arquivo settings.json, para criar um painel de edição das abas visualmente:

    0_1558462567994_screenshot-teste2019.xtechcommerce.com-2019.05.21-15-13-21.png

    - CÓDIGO PARA SER ADICIONADO NA LOJA:

    "tabs_prod": {
                "name": "Abas da página de Produto [Limite de 50 itens]",
                "listing": "text:name",
                "fields": {
                    "text:name":        {"label": "Nome da lista (apenas para referência na listagem)"},
                    "text:order":       {"label": "Ordem da aba (Apenas número - Ordem crescente)"},
                    "text:id":          {"label": "ID do Produto (identifica o produto para adição da aba). Pode deixar em BRANCO caso use para todos os produtos da categoria."},
                    "if:if_nome_cat":   {"label": "Adicionar abas para todos os produtos em uma categoria?"},
                    "text:nome_cat":    {"label": "Nome da categoria (add abas em todos os produtos da categoria). Pode deixar em BRANCO caso use em um produto específico."},
                    "text:tab":         {"label": "Nome da Aba"},
                    "textarea:tab":     {"label": "Conteúdo da Aba", "rich": true}
                }
            }
    
    

    2 - Acesse o arquivo product.html para adicionar o seguinte código:

    0_1558462654690_screenshot-teste2019.xtechcommerce.com-2019.05.21-15-11-12.png

    - CÓDIGOS PARA SEREM ADICIONADOS NA LOJA:

    {# ABAS DO PRODUTO PARA LISTA #}
    {% set cat_prod_name = '' %}
    {% for tab in get_collection('tabs_prod', {'limit': 50})|sort %}
        {% for cat_list in product.categories if tab["text:nome_cat"]|lower == cat_list.slug %}
            {% set cat_prod_name = tab["text:nome_cat"]|lower %}
        {% endfor %}
    	{% if cat_prod_name == tab["text:nome_cat"]|lower and tab["if:if_nome_cat"] %}
    		<li>
    			<a href="#tab-{{loop.index}}" data-toggle="tab">{{ tab['text:tab'] }}</a>
    		</li>
    	{% endif %}
        {% if tab['text:id'] == product.id and tab["if:if_nome_cat"] == false %}
    		<li>
    			<a href="#tab-{{loop.index}}" data-toggle="tab">{{ tab['text:tab'] }}</a>
    		</li>
    	{% endif %}
    {% endfor %}
    
    {# ABAS DO PRODUTO PARA CONTEÚDO #}
    {% for tab in get_collection('tabs_prod', {'limit': 50})|sort %}
        {% for cat_list in product.categories if tab["text:nome_cat"]|lower == cat_list.slug %}
        	 {% set cat_prod_name = tab["text:nome_cat"]|lower %}
        {% endfor %}
        {% if cat_prod_name == tab["text:nome_cat"]|lower and tab["if:if_nome_cat"] %}
    	<div class="tab-pane clearfix" id="tab-{{loop.index}}">
                 {{ tab['textarea:tab']|nl2br }}
            </div>
        {% endif %}
        {% if tab['text:id'] == product.id and tab["if:if_nome_cat"] == false %}
             <div class="tab-pane clearfix" id="tab-{{loop.index}}">
                 {{ tab['textarea:tab']|nl2br }}
            </div>
        {% endif %}
    {% endfor %}
    


  • @charles Muito obrigado !!! Deu super certo. Tem alguma adição ao código para está nova aba ser padrão para todos os itens ou categoria. No caso tenho que criar uma aba para cada produto, não consigo adicionar o ID de uma categoria ou mais de um ID dentro de cada Aba. Obrigado novamente



  • Olá @tapetemais, eu atualizei os códigos acima, eu só add para ele fazer que vc add abas em todos os produtos em uma categoria específica, isso vc vai ver no painel após add o código.



  • @charles Obrigado Mestre pelo rápido Retorno. Já vou testar



  • Boa tarde @charles, tudo bem? Como uso esse código para criar abas individuais para cada produto? Não estou conseguindo usar o id do produto para aparecer apenas nele, só funciona quando ativo: "Adicionar abas para todos os produtos em uma categoria?" mas aparece o mesmo texto em todos os produtos.


Log in to reply