Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Conectar-se

Esqueci minha senha

Últimos assuntos
» Mudar cor da fonte/letra do perfil
Hoje à(s) 10:13 pm por Ketholy123

» Notificação de novas mensagens
Hoje à(s) 08:18 pm por Luiz

» Questão sobre aspeto de blog
Hoje à(s) 08:14 pm por Luiz

» Como mudar a cor e imagem desta caixinha?
Hoje à(s) 07:32 pm por Luiz

» Como fixa a mensagem
Hoje à(s) 06:37 pm por Luiz

» Como remover as mensagens de informação do chatbox
Hoje à(s) 06:36 pm por Luiz

» Slides bugado
Hoje à(s) 06:24 pm por iScroll

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
Luiz
 
iScroll
 
Matt Shultz
 
Harleen
 
Ketholy123
 
T1ag0
 
zHugh
 
PlayWillian
 
ranzatti
 
Lecxa
 

Quem está conectado
246 usuários online :: 8 usuários cadastrados, Nenhum Invisível e 238 Visitantes :: 2 Motores de busca

CesarWatsom2, iScroll, Lost154, soldado, uvmyyvpew, weverson lopes, xDominiC_., zHugh

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Como eu consigo por mais de um icone na loja de icones do fórum.

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por JrMAFiA em 17/11/15, 12:35 pm

Detalhes da questão


Endereço do fórum: http://mastersuporte.forumeiros.com/
Versão do fórum: PunBB

Descrição


Galera to tendo uma certa dificuldade de adicionar mais um icone para a pessoa comprar em meu fórum,olhei o tutorial  http://ajuda.forumeiros.com/t99911-addon-criar-loja-de-icones mais não consegui colocar mais um icone para as pessoas poder comprar no tutorial fala que é depois da virgula mais sou pessimo em HTML,por isso to tendo essa difículdade grande.
avatar

JrMAFiA
Usuário avançado

Masculino
Inscrito dia : 20/04/2015
Mensagens : 377
Pontos Ativos : 638

Ver perfil do usuário

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por MateusAnjosV em 17/11/15, 12:37 pm

Boa tarde!

Teste esse código:
Código:
<script type="text/javascript">
  $(function() {
  var produtos = {

    /* Ícones da loja abaixo.
    Lembre-se de adicionar uma vírgula ao final de cada novo ítem adicionado.
    Não adicione vírgula após o último ítem adicionado. */
   
    'Gold Star': {
        icone: 'http://i.imgur.com/taaL40o.png',
        preco: '200',
        descricao: 'Stars WHOA'
    },
  'nomeicon': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
    'Helmet': {
        icone: 'http://png.findicons.com/files/icons/2169/picnic/70/helmet2.png',
        preco: '250',
        descricao: 'Capacete de batalha'
    },
 
    'Charmander': {
        icone: 'http://i72.servimg.com/u/f72/18/07/42/17/shop_i33.png',
        preco: '250',
        descricao: 'Pokemón tipo fogo'
    }
    // Perceba que não existe vírgula após o último ítem. Caso queira adicionar mais ítens após o último, adicione uma vírgula logo após a chave "}". Lembre-se de deixar apenas o último ítem sem vírgula ao final.
 
 
  };
 
 
  var content = $('.content .itens');
      $.each(produtos, function (key, value) {
          content.append(
          '<tr class="item">' +
          '  <td class="icone" style="width: 10%;"><img src="' + value.icone + '" /></td>' +
          '  <td style="width: 50%;"><strong class="nome">' + key + '</strong><br /><br />' + value.descricao + '</td>' +
          '  <td>' +
          '  <ul>' +
          '  <li class="preco" data-myprice="' + value.preco + '"><img src="http://i.imgur.com/qdiucii.png" /> Preço: ' + value.preco + ' pontos</li>' +
          '  <br />' +
          '  <li><input type="button" onclick="addToCart(this)" value="Adicionar ao carrinho" /></li>' +
    '  </ul>' +
          '  </td>' +
          '</tr>'
          );
      });
      $.ajax({
        url: '/u' + _userdata.user_id,
        type: 'GET',
        success: function(responseHtml)
        {
        var myPoints = $('#field_id-13 dd', responseHtml).text();
        $('.myPoints').html('Meu saldo de pontos: <span class="totalPoints">' + myPoints + '</span>');
        },
        error: function(err)
        {
          console.log("AJAX error in request (Store points)");
        }
      });
  });
  var $total = 0;
  function addToCart(item) {
    var getItem = $(item).parents('.item').find('.nome').text();
    var getPrice = parseInt($(item).parents('.item').find('.preco').attr('data-myprice'));
    $total += getPrice;
    $('.total').html('Valor total: <span class="totalVal">' + $total + '</span> pontos');
    $('.cart').append('<span class="item-cart" onclick="removeFromCart(this)" data-myprice="' + getPrice + '">' + getItem + '</span>');
  }
  function removeFromCart(item) {
    var getPrice = parseInt($(item).attr('data-myprice'));
    $total -= getPrice;
    $('.total').html('Valor total: <span class="totalVal">' + $total + '</span> pontos');
    $(item).remove();
  }
  function resetItems() {
    $('.cart').empty();
    $total = 0;
    $('.total').empty();
  }
  function buyItems() {
    if(!$('.cart').is(':empty')) {
      var valPoints = parseInt($('.totalPoints').text());
      var valTotal = parseInt($('.totalVal').text());
      if(valPoints >= valTotal) {
      var texto = '';
      var total = 0;
      $('.item-cart').each(function() {
        var item = $(this).text();
        var preco = parseInt($(this).attr('data-myprice'));
        texto += '[b]' + item.charAt(0).toUpperCase() + item.slice(1)
        //add line break at the end
        + ':[/b] ' + preco + " pontos\n";
        total += preco;
      });
      texto += '\n\n[b]Valor total:[/b] ' + total + ' pontos';
      $.post('/privmsg', {
            'mode': 'post',
            'post': '1',
            'folder': 'inbox',
            'usergroup': '1',
            'subject': 'Pedido da loja',
            'message': texto
      }).done(function() {
        alert("Seu pedido foi enviado! Aguarde até que um administrador adicione seus ítens");
        resetItems();
      });
      } else {
        alert("Você não tem pontos suficiente para efetuar a compra");
      }
    } else {
      alert("O carrinho está vazio");
    }
  }
</script>
<style type="text/css">
table.content {
  background: #fafafa;
  border: 1px solid #eaeaea;
  border-collapse: separate;
  empty-cells: show;
  table-layout: fixed;
  width: 100%;
}
.itens .nome {font-size: 14px;}
.itens .icone {
text-align: center;
}
.itens .icone img {
  height: 50px;
  width: 50px;
}
.item-cart {
  background: orange url(https://cdn0.iconfinder.com/data/icons/very-basic-android-l-lollipop-icon-pack/24/close-16.png) no-repeat 5px;
  margin: 3px 4px;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  padding: 5px;
  padding-left: 25px;
  color: white;
  border-radius: 3px;
}
table.content tr td {padding: 10px;background: #f0f0f0;border-bottom: 1px solid #e0e0e0;}
.itens ul li {list-style-type: none;}
.daemon {
  background: #333;
  text-align: center;
  padding: 10px;
}
#cart {
  background: #f0f0f0;
  border: 1px solid #e0e0e0;
  margin-top: 5px;
  padding: 5px;
}
.cart {
  background: white url("https://cdn1.iconfinder.com/data/icons/flat-artistic-shopping-icons/32/shopping-32.png") no-repeat 10px center;
  min-height: 50px;
  padding-left: 55px;
  border: 1px solid #ddd;
}
.total, .myPoints {font-size: 13px;display: block;margin-top: 5px;font-family: arial;display: block;font-style: italic;font-weight: bold;}
</style>
<div class="daemon">
  <span style="color: white;font-size: 28px;font-weight: bold;">Loja</span>
</div>
<table class="content">
      <tbody class="itens"></tbody>
</table>
<div id="cart">
  <div class="cart"></div>
  <span class="myPoints"></span>
  <span class="total"></span>
</div>
<div class="daemon">
  <input type="button" value="Concluir compra" onclick="buyItems()" />
  <input type="button" value="Resetar ítens" onclick="resetItems()" />
</div>

Feliz
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1435
Pontos Ativos : 2004

Ver perfil do usuário http://ajuda.forumeiros.com/

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por JrMAFiA em 17/11/15, 12:40 pm

mateus eu ja tenho esse codigo colocado em meu fórum,mais eu não consigo por mais de um icone.
avatar

JrMAFiA
Usuário avançado

Masculino
Inscrito dia : 20/04/2015
Mensagens : 377
Pontos Ativos : 638

Ver perfil do usuário

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por MateusAnjosV em 17/11/15, 12:41 pm

Boa tarde!

Você o testou? Eu acrescentei mais um ícone:
Código:
'nomeicon': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
Verifique... diga quantos quer adicionar.

Feliz
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1435
Pontos Ativos : 2004

Ver perfil do usuário http://ajuda.forumeiros.com/

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por JrMAFiA em 17/11/15, 12:44 pm

A sim mateus,eu quero 8,mais pelo que eu vi depois disso }, voce acrescentou mais um ?
avatar

JrMAFiA
Usuário avançado

Masculino
Inscrito dia : 20/04/2015
Mensagens : 377
Pontos Ativos : 638

Ver perfil do usuário

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por MateusAnjosV em 17/11/15, 12:49 pm

Boa tarde!

Vou lhe explicar e fornecer o código, ok?
Explicação:
A base para adicionar é essa:
Código:
'nomeicon': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
Com isso adicionaremos mais um icon!
Onde adicionar? No código procure por:
Código:
  'Gold Star': {
        icone: 'http://i.imgur.com/taaL40o.png',
        preco: '200',
        descricao: 'Stars WHOA'
    },
Você deve adicionar após a ,
Ex:
Código:
  'Gold Star': {
        icone: 'http://i.imgur.com/taaL40o.png',
        preco: '200',
        descricao: 'Stars WHOA'
    },

'nomeicon': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
Código:
Terá de alterar a url, leia o código!!! Ok? Eu comentei ele, apenas leia e substitua.
Código:
<script type="text/javascript">
  $(function() {
  var produtos = {

    /* Ícones da loja abaixo.
    Lembre-se de adicionar uma vírgula ao final de cada novo ítem adicionado.
    Não adicione vírgula após o último ítem adicionado. */
    
    'Gold Star': {
        icone: 'http://i.imgur.com/taaL40o.png',
        preco: '200',
        descricao: 'Stars WHOA'
    },
  'nomeicon': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
'nomeicon2': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
'nomeicon3': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
'nomeicon4': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
'nomeicon5': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },
'nomeicon6': {
        icone: 'URLNOVOICON',
        preco: '2000',
        descricao: 'DESCRIÇÃONOVOICON'
    },

    'Helmet': {
        icone: 'http://png.findicons.com/files/icons/2169/picnic/70/helmet2.png',
        preco: '250',
        descricao: 'Capacete de batalha'
    },
  
    'Charmander': {
        icone: 'http://i72.servimg.com/u/f72/18/07/42/17/shop_i33.png',
        preco: '250',
        descricao: 'Pokemón tipo fogo'
    }
    // Perceba que não existe vírgula após o último ítem. Caso queira adicionar mais ítens após o último, adicione uma vírgula logo após a chave "}". Lembre-se de deixar apenas o último ítem sem vírgula ao final.
  
  
  };
  
  
  var content = $('.content .itens');
      $.each(produtos, function (key, value) {
          content.append(
          '<tr class="item">' +
          '  <td class="icone" style="width: 10%;"><img src="' + value.icone + '" /></td>' +
          '  <td style="width: 50%;"><strong class="nome">' + key + '</strong><br /><br />' + value.descricao + '</td>' +
          '  <td>' +
          '  <ul>' +
          '  <li class="preco" data-myprice="' + value.preco + '"><img src="http://i.imgur.com/qdiucii.png" /> Preço: ' + value.preco + ' pontos</li>' +
          '  <br />' +
          '  <li><input type="button" onclick="addToCart(this)" value="Adicionar ao carrinho" /></li>' +
    '  </ul>' +
          '  </td>' +
          '</tr>'
          );
      });
      $.ajax({
        url: '/u' + _userdata.user_id,
        type: 'GET',
        success: function(responseHtml)
        {
        var myPoints = $('#field_id-13 dd', responseHtml).text();
        $('.myPoints').html('Meu saldo de pontos: <span class="totalPoints">' + myPoints + '</span>');
        },
        error: function(err)
        {
          console.log("AJAX error in request (Store points)");
        }
      });
  });
  var $total = 0;
  function addToCart(item) {
    var getItem = $(item).parents('.item').find('.nome').text();
    var getPrice = parseInt($(item).parents('.item').find('.preco').attr('data-myprice'));
    $total += getPrice;
    $('.total').html('Valor total: <span class="totalVal">' + $total + '</span> pontos');
    $('.cart').append('<span class="item-cart" onclick="removeFromCart(this)" data-myprice="' + getPrice + '">' + getItem + '</span>');
  }
  function removeFromCart(item) {
    var getPrice = parseInt($(item).attr('data-myprice'));
    $total -= getPrice;
    $('.total').html('Valor total: <span class="totalVal">' + $total + '</span> pontos');
    $(item).remove();
  }
  function resetItems() {
    $('.cart').empty();
    $total = 0;
    $('.total').empty();
  }
  function buyItems() {
    if(!$('.cart').is(':empty')) {
      var valPoints = parseInt($('.totalPoints').text());
      var valTotal = parseInt($('.totalVal').text());
      if(valPoints >= valTotal) {
      var texto = '';
      var total = 0;
      $('.item-cart').each(function() {
        var item = $(this).text();
        var preco = parseInt($(this).attr('data-myprice'));
        texto += '[b]' + item.charAt(0).toUpperCase() + item.slice(1)
        //add line break at the end
        + ':[/b] ' + preco + " pontos\n";
        total += preco;
      });
      texto += '\n\n[b]Valor total:[/b] ' + total + ' pontos';
      $.post('/privmsg', {
            'mode': 'post',
            'post': '1',
            'folder': 'inbox',
            'usergroup': '1',
            'subject': 'Pedido da loja',
            'message': texto
      }).done(function() {
        alert("Seu pedido foi enviado! Aguarde até que um administrador adicione seus ítens");
        resetItems();
      });
      } else {
        alert("Você não tem pontos suficiente para efetuar a compra");
      }
    } else {
      alert("O carrinho está vazio");
    }
  }
</script>
<style type="text/css">
table.content {
  background: #fafafa;
  border: 1px solid #eaeaea;
  border-collapse: separate;
  empty-cells: show;
  table-layout: fixed;
  width: 100%;
}
.itens .nome {font-size: 14px;}
.itens .icone {
text-align: center;
}
.itens .icone img {
  height: 50px;
  width: 50px;
}
.item-cart {
  background: orange url(https://cdn0.iconfinder.com/data/icons/very-basic-android-l-lollipop-icon-pack/24/close-16.png) no-repeat 5px;
  margin: 3px 4px;
  cursor: pointer;
  display: inline-block;
  font-weight: bold;
  padding: 5px;
  padding-left: 25px;
  color: white;
  border-radius: 3px;
}
table.content tr td {padding: 10px;background: #f0f0f0;border-bottom: 1px solid #e0e0e0;}
.itens ul li {list-style-type: none;}
.daemon {
  background: #333;
  text-align: center;
  padding: 10px;
}
#cart {
  background: #f0f0f0;
  border: 1px solid #e0e0e0;
  margin-top: 5px;
  padding: 5px;
}
.cart {
  background: white url("https://cdn1.iconfinder.com/data/icons/flat-artistic-shopping-icons/32/shopping-32.png") no-repeat 10px center;
  min-height: 50px;
  padding-left: 55px;
  border: 1px solid #ddd;
}
.total, .myPoints {font-size: 13px;display: block;margin-top: 5px;font-family: arial;display: block;font-style: italic;font-weight: bold;}
</style>
<div class="daemon">
  <span style="color: white;font-size: 28px;font-weight: bold;">Loja</span>
</div>
<table class="content">
      <tbody class="itens"></tbody>
</table>
<div id="cart">
  <div class="cart"></div>
  <span class="myPoints"></span>
  <span class="total"></span>
</div>
<div class="daemon">
  <input type="button" value="Concluir compra" onclick="buyItems()" />
  <input type="button" value="Resetar ítens" onclick="resetItems()" />
</div>
avatar

MateusAnjosV
Membro do Fórum

Masculino
Inscrito dia : 16/10/2015
Mensagens : 1435
Pontos Ativos : 2004

Ver perfil do usuário http://ajuda.forumeiros.com/

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por JrMAFiA em 17/11/15, 12:50 pm

Tendeu agora muito obrigado mesmo mateus Muito feliz
avatar

JrMAFiA
Usuário avançado

Masculino
Inscrito dia : 20/04/2015
Mensagens : 377
Pontos Ativos : 638

Ver perfil do usuário

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por JrMAFiA em 17/11/15, 12:52 pm

Só uma pergunta os membros quando comprar eu recebo a notificação ?
avatar

JrMAFiA
Usuário avançado

Masculino
Inscrito dia : 20/04/2015
Mensagens : 377
Pontos Ativos : 638

Ver perfil do usuário

Resolvido Re: Como eu consigo por mais de um icone na loja de icones do fórum.

Mensagem por Wamki em 17/11/15, 01:36 pm

Olá,
Cuidado com double-post, ao sua pergunta ontem, somente só se for configurado enviando pra conta /u1 (conta fundadora) que irá funcionar tudo perfeitamente.




Wamki
avatar

Wamki
Usuário avançado

Masculino
Inscrito dia : 22/10/2015
Mensagens : 332
Pontos Ativos : 451

Ver perfil do usuário http://infostyle.forumbrasil.net

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum