Widget de compra

• Descrição:

Queria um código JS com essa função, ao clicar em comprar direciona ja para o link do pagseguro
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

• Informações:

Fórum:	[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]	Versão:	PUNBB
Tipo:	Pedido de código	Tags:	Widget,compra

Você tem conta no PagSeguro?
Você precisa criar os botões através da ferramenta do PagSeguro, após isso será gerado um código para você adicionar em seu "site/forum".
Depois é só criar um novo widget e colocar o código que foi gerado pelo PagSeguro.

Painel  Módulos [Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]Portal & Widgets  [Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]Gestão dos widgets do fórum  [Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]Criar um widget personalizado

Sim meu amigo mas eu queria desse jeito que ele fez ai com esse código pra ficar listado assim e tal, ja tenho os botoes e tal

Poderia descrever melhor sua questão? no titulo do tópico você diz que quer um "widget".
Porem o que deu a entender é que você quer uma pagina html com o estilo da imagem de ilustração certo?
Se for isso a vários fatores que precisam ser editados na sua postagem.
Exemplo: você não deixou claro que tipo compra haverá na pagina; o texto ou descrição de cada produto; o código de cada produto do PagSeguro

Amigo, então essa img ai é um final de um portal de um fórum [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] se você reparar é um widget com o código que da esse visual todo nele e tudo mais, eu queria esse código.

Amigo, vá no pagseguro e crie um botão, e os code vc muda em baixo.
Mude: https://pagseguro.uol.com.br/checkout/v2/cart.html?action=add
e 9868A2C6D4D4066004290F94C5247DE3

Coloque na página HTML

Código:

<form method="post" action="https://pagseguro.uol.com.br/checkout/v2/cart.html?action=add">
<input value="9868A2C6D4D4066004290F94C5247DE3" name="itemCode" type="hidden">
<input name="submit" value="Comprar" class="iheload-comprar" type="submit">
</form>

CSS:

(não precisa mudar nada)

Código:

.iheload-comprar {
  border-color: #0FADDB;
  border-bottom-color: #0D91B7;
  background: linear-gradient(to bottom, #2AC3DF, #10B9EC);
  border-width: 1px;
  border-style: solid;
  box-shadow: inset 0px 1px 0 rgba(255,255,255,0.2);
  text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
  color: #fff;
  display: inline-block;
  padding: 7px 15px;
  border-radius: 4px;
  outline: none;
  cursor: pointer;
}


O botão funciona perfeitamente mas e essa estrutura toda ai com forma de caixas e tal. Como dar esse visual ?

Adicione um Widget no Portal do fórum!

Código:

<div class="grid-block iheload-corpo">
      
   <div class="grid-box width25 iheload-corpobg">
         
      <div>
          <span class="cash">Conta VIP</span>  
         <div class="price">
              <span class="cash">CASH</span>10.000<span class="cash">/MÊS</span>  
         </div>
            
         <ul class="zebra">
               
            <li>
                 Ganha 2 níveis  
            </li>
               
            <li>
                 Ganha $5.000.000 in-game  
            </li>
               
            <li>
                 /KitVIP nas Lojas de Armas  
            </li>
               
            <li>
                 Mais dinheiro no PayDay  
            </li>
               
            <li>
                 Poderá comprar empresa  
            </li>
               
            <li>
                 Relatório com cor diferenciada  
            </li>
               
            <li>
                 Poderá falar no /v (Chat VIP)  
            </li>
               
            <li>
                 Não vai para o hospital quando morre  
            </li>
               
            <li>
                 Utiiza título VIP  
            </li>
               
            <li>
                 Poderá desligar o celular  
            </li>
               
            <li>
                 Poderá ter até 4 casas  
            </li>
               
            <li>
                 Comprar casas sem contar o nível  
            </li>
               
            <li>
                 Equipar VIP em sua organização.  
            </li>
               
            <li>
                 -  
            </li>
               
            <li>
                 -  
            </li>
               
            <li>
                 -  
            </li>
               
            <li>
                 -  
            </li>
               
         </ul>
            
         <form action="https://pagseguro.uol.com.br/checkout/v2/cart.html?action=add" method="post">
             <input type="hidden" name="itemCode" value="9868A2C6D4D4066004290F94C5247DE3" /><input type="submit" class="iheload-comprar" value="Comprar" name="submit" />  
         </form>
            
      </div>
         
   </div>
      
   <div class="grid-box width25 iheload-corpobg">
         
      <div>
          <span class="cash">Conta Sócio</span>  
         <div class="price">
              <span class="cash">CASH</span>15.000<span class="cash">/MÊS</span>  
         </div>
            
         <ul class="zebra">
               
            <li>
                 Ganha 4 níveis  
            </li>
               
            <li>
                 Ganha $10.000.000 in-game  
            </li>
               
            <li>
                 /KitVIP nas Lojas de Armas  
            </li>
               
            <li>
                 Mais dinheiro no PayDay  
            </li>
               
            <li>
                 Poderá comprar empresa Sócio  
            </li>
               
            <li>
                 Relatório com cor diferenciada  
            </li>
               
            <li>
                 Poderá falar no /s (Chat Sócio)  
            </li>
               
            <li>
                 Não vai para o hospital quando morre  
            </li>
               
            <li>
                 Utiiza título Sócio  
            </li>
               
            <li>
                 Poderá desligar o celular  
            </li>
               
            <li>
                 Poderá ter até 5 casas  
            </li>
               
            <li>
                 Comprar casas sem contar o nível  
            </li>
               
            <li>
                 Equipar Sócio em sua organização  
            </li>
               
            <li>
                 Poderá comprar mansões Sócio  
            </li>
               
            <li>
                 -  
            </li>
               
            <li>
                 -  
            </li>
               
            <li>
                 -  
            </li>
               
         </ul>
            
         <form method="post" action="https://pagseguro.uol.com.br/checkout/v2/cart.html?action=add">
             <input value="50927C77A5A58F3334035FAE9676006D" name="itemCode" type="hidden" /><input type="submit" class="iheload-comprar" value="Comprar" name="submit" />  
         </form>
            
      </div>
         
   </div>
      
   <div class="grid-box width25 iheload-corpobg">
         
      <div>
          <span class="cash">Conta Sócio - Power</span>  
         <div class="price">
              <span class="cash">CASH</span>25.000<span class="cash">/MÊS</span>  
         </div>
            
         <ul class="zebra">
               
            <li>
                 Ganha 6 níveis  
            </li>
               
            <li>
                 Ganha $30.000.000 in-game  
            </li>
               
            <li>
                 /KitVIP nas Lojas de Armas  
            </li>
               
            <li>
                 Mais dinheiro no PayDay  
            </li>
               
            <li>
                 Poderá comprar empresa Sócio - Power  
            </li>
               
            <li>
                 Relatório com cor diferenciada  
            </li>
               
            <li>
                 Poderá falar no /s (Chat Sócio)  
            </li>
               
            <li>
                 Não vai para o hospital quando morre  
            </li>
               
            <li>
                 Utiliza título Sócio - Power  
            </li>
               
            <li>
                 Poderá desligar o celular  
            </li>
               
            <li>
                 Poderá ter até 5 casas  
            </li>
               
            <li>
                 Comprar casas sem contar o nível  
            </li>
               
            <li>
                 Equipar Sócio - Power em sua organização  
            </li>
               
            <li>
                 Poderá comprar mansões Sócio - Power  
            </li>
               
            <li>
                 Poderá utilizar o comando /jetpack  
            </li>
               
            <li>
                 Poderá utilizar o comando /entrarorg  
            </li>
               
            <li>
                 Poderá utilizar o comando /tunar  
            </li>
               
         </ul>
            
         <form method="post" action="https://pagseguro.uol.com.br/checkout/v2/cart.html?action=add">
             <input value="A6EABDA6CBCB94E334305FB4F899D2F1" name="itemCode" type="hidden" /><input type="submit" class="iheload-comprar" value="Comprar" name="submit" />  
         </form>
            
      </div>
         
   </div><style>
.cash {
  font-size: 13px;
  font-weight: 700;
}
.iheload-corpobg {
  border: 1px solid #fff;
  border-bottom-color: rgba(0,0,0,0.2);
  border-radius: 5px;
  background: linear-gradient(to bottom, #f7f7f7, #f4f4f4);
  background-clip: padding-box;
  box-shadow: inset 0px 1px 0 rgba(255,255,255,1);
}
.iheload-corpo {
  text-shadow: 0 1px 0 #fff;
  text-align: center;
  overflow: hidden;
}
ul.zebra > li:first-child, table.zebra tbody tr:first-child td {
  border-top: 1px solid #d1d1d1;
  box-shadow: inset 0 1px 0 rgba(255,255,255,1), 0 1px 0 rgba(255,255,255,1);
}
ul.zebra > li, table.zebra tbody td {
  border-bottom: 1px solid #d1d1d1;
  box-shadow: 0 1px 0 rgba(255,255,255,1);
}
ul.zebra>li {
  padding: 5px;
}
.iheload-corpo .grid-box>div {
  padding: 15px;
  border: 0 solid #d1d1d1;
  border-left-width: 1px;
  box-shadow: inset 1px 0 0 #fff;
}
.clearfix:before, .clearfix:after, .grid-block:before, .grid-block:after, .deepest:before, .deepest:after {
  content: "";
  display: table;
}
[class*='width'] {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.width25 {
  width: 30%;
}
.grid-box {
  float: left;
}
.iheload-corpo .price {
  border: 1px solid #d1d1d1;
  border-radius: 5px;
  background: #f1f1f1;
  font: bold 30px/54px Arial, Helvetica, sans-serif;
}
.iheload-corpo .grid-box div>* {
  margin: 15px 0 0 0;
}
ul.blank, ul.space, ul.line, ul.check, ul.zebra {
  list-style: none;
  margin: 0;
  padding: 0;
}
.pun .main-content ol, .pun .main-content ul {
  padding-left: 0px !important;
}
ul.zebra > li:nth-of-type(odd), table.zebra tbody tr:nth-of-type(odd) {
  background: rgba(0,0,0,0.02);
}
.color1 {
  color: #0D93B9;
}
.color1, .color2 {
  text-shadow: 0 1px #fff;
}
.iheload-comprar {
  border-color: #0FADDB;
  border-bottom-color: #0D91B7;
  background: linear-gradient(to bottom, #2AC3DF, #10B9EC);
  border-width: 1px;
  border-style: solid;
  box-shadow: inset 0px 1px 0 rgba(255,255,255,0.2);
  text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
  color: #fff;
  display: inline-block;
  padding: 7px 15px;
  border-radius: 4px;
  outline: none;
  cursor: pointer;
}
.iheload-comprar:hover {
  border-color: #0FADDB;
  border-bottom-color: #0D91B7;
  background: linear-gradient(to bottom, #0FB6E6, #0FAAD7);
}
.iheload-comprar:active {
  border-color: #0D97BF;
  background: linear-gradient(to bottom, #0FAAD7, #0FB6E5);
}
</style>
</div>

Salve, e não adicione o Widget no corpo do Portal.

Deça um pouco e ache: Adição/remoção de widgets pessoais

Coloque o nome do Widget que vc colocou

Em Colocação : Menu de Navegação


e dá um Adicionar Widget.

tu é o cara brother! vlw!
 Poderia me dizer como pegou o código?