Colocar FLAG ou "TAG" de Black Friday nos pordutos

Layout
3

Eu consegui fazer um código simples que pode servir como base para essa solução. Primeiro você insere esse CSS na sua loja:

.selo-black-friday {
    max-width: 100px;
    right: 0;
    left: auto;
}

Depois você adiciona esse JavaScript no rodapé de todas as páginas:

$(document).ready(function() {
	/*Adiciona selo na Home*/
	var produto = $('#listagemProdutos > ul > li > div > ul > li > div');
	produto.append(`
		<div class="bandeiras-produto selo-black-friday">
			<img src="https://us1.discourse-cdn.com/flex024/uploads/lojaintegrada/original/3X/6/8/68f297a0999901e3b699daf37749b46fb9814351.png" />
		</div>
	`);
	/*Adiciona selo na página do produto*/
	var produto2 = $('#corpo > div > div.secao-principal.row-fluid.sem-coluna > div > div > div > div.listagem.aproveite-tambem.borda-alpha > ul > li > ul > li > div');
	produto2.append(`
		<div class="bandeiras-produto selo-black-friday">
			<img src="https://us1.discourse-cdn.com/flex024/uploads/lojaintegrada/original/3X/6/8/68f297a0999901e3b699daf37749b46fb9814351.png" />
		</div>
	`);
});

Não testei em todas as páginas, então não sei dizer se serve para a loja toda, mas já serve de base para algumas personalizações.

6 curtidas