como criar um "rádio" em uma página em HTML

Detalhes da questão

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

Descrição

Olá,
Eu gostaria de criar uma página em HTML e criar uma rádio interativa com os membros... Onde eu possa modificar as músicas e atender os pedidos dos membros, o código seria no estilo da loja, mas ao invés de comprar um item seria comprar a música.

O código da barra de músicas que quero utilizar é essa:

Código:

<!--   SCM Music Player http://scmplayer.net   --><script type="text/javascript" src="http://scmplayer.net/script.js" data-config="{'skin':'skins/scmPurple/skin.css','volume':50,'autoplay':true,'shuffle':false,'repeat':1,'placement':'top','showplaylist':false,'playlist':[{'title':'Adele - Hello','url':'https://www.youtube.com/watch?v=YQHsXMglC9A'},{'title':'Ariana Grande - Focus','url':'https://www.youtube.com/watch?v=lf_wVfwpfp8'},{'title':'Demi Lovato - Confident','url':'https://www.youtube.com/watch?v=cwLRQn61oUY'},{'title':'Drake - Hotline Bling','url':'https://www.youtube.com/watch?v=uxpDa-c-4Mc'},{'title':'Justin Bieber - Sorry','url':'https://www.youtube.com/watch?v=fRh_vgS2dFE'},{'title':'Meghan Trainor - Like I%27m Gonna Lose You ft. John Legend','url':'https://www.youtube.com/watch?v=2-MBfn8XjIU'},{'title':'One Direction - Perfect','url':'https://www.youtube.com/watch?v=Ho32Oh6b4jc'},{'title':'Selena Gomez - Same Old Love','url':'https://www.youtube.com/watch?v=9h30Bx4Klxg'},{'title':'Shawn Mendes - Stitches','url':'https://www.youtube.com/watch?v=VbfpW0pbvaU'},{'title':'Taylor Swift - Wildest Dreams','url':'https://www.youtube.com/watch?v=IdneKLhsWOQ'}]}"></script>
<!--   SCM Music Player script end   -->

Será nesta página: Rádio Soul Song

Código da Página:

Código:

<script type="text/javascript">
  $(function() {
  var produtos = {

    'Infinity': {
        icone: 'http://todateen.uol.com.br/tt/wp-content/uploads/2015/09/one-direction-capa-album-made-in-am.jpg',
        preco: '500',
        descricao: 'One Direction - Infinity'
    },
 
    'All About The Bass': {
        icone: 'http://www.papelpop.com/papelpop/wp-content/uploads/2014/09/meghan.jpg',
        preco: '500',
        descricao: 'Meghan Trainor - All About The Bass'
    },
 
    'Cool For The Summer': {
        icone: 'http://assets.nydailynews.com/polopoly_fs/1.2282292!/img/httpImage/image.jpg_gen/derivatives/article_635/lovato6f-3-web.jpg',
        preco: '500',
        descricao: 'Demi Lovato - Cool For The Summer'
    },

  'Bang': {
        icone: 'https://lh3.googleusercontent.com/-Qb_e3oXpJmo/VhkLtTpm5gI/AAAAAAAAAdc/qYoRj92RPmk/s600/Bang.jpg',
        preco: '500',
        descricao: 'Anitta - Bang'
    },
   
  'Till It Happens To You': {
        icone: 'http://www.didiwagner.com.br/wp-content/uploads/2015/09/till-it-happens-to-you-lady-gaga.jpg',
        preco: '500',
        descricao: 'Lady Gaga – Till It Happens To You'
    },
  };
 
 
  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': 'Compra de Música',
            '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 de Pontos</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 onclick="buyItems()" value="Concluir compra" type="button" />  <input onclick="resetItems()" value="Resetar ítens" type="button" />
</div>

UP! @Shek

Boa noite!

Como seria a compra? O mesmo sistema de enviar mp? Me forneça detalhes... Poderia ser: "ao clicar no ícone da música", a música toca e a loja se mantem no estilo? Como seria interagir com os players? Eles ficariam naquela página html pedindo música... mas por onde pediriam música?

Atenciosamente,
MateusAnjosV.

Assim, o sistema da loja continua o mesmo, mas gostaria de colocar tipo um local de postagens com os pedidos.

Local de pedidos de música:

gostaria de que na pagina criasse um Ranking com as músicas mais compradas durante a semana e a que ganhar irá ser tocada na rádio.

Olá,
O senhor queria a loja para os membros comprar a  musica que no caso seria essa :

Código:

<script type="text/javascript">
  $(function() {
  var produtos = {

    'Infinity': {
        icone: 'http://todateen.uol.com.br/tt/wp-content/uploads/2015/09/one-direction-capa-album-made-in-am.jpg',
        preco: '500',
        descricao: 'One Direction - Infinity'
    },
  
    'All About The Bass': {
        icone: 'http://www.papelpop.com/papelpop/wp-content/uploads/2014/09/meghan.jpg',
        preco: '500',
        descricao: 'Meghan Trainor - All About The Bass'
    },
  
    'Cool For The Summer': {
        icone: 'http://assets.nydailynews.com/polopoly_fs/1.2282292!/img/httpImage/image.jpg_gen/derivatives/article_635/lovato6f-3-web.jpg',
        preco: '500',
        descricao: 'Demi Lovato - Cool For The Summer'
    },

  'Bang': {
        icone: 'https://lh3.googleusercontent.com/-Qb_e3oXpJmo/VhkLtTpm5gI/AAAAAAAAAdc/qYoRj92RPmk/s600/Bang.jpg',
        preco: '500',
        descricao: 'Anitta - Bang'
    },
    
  'Till It Happens To You': {
        icone: 'http://www.didiwagner.com.br/wp-content/uploads/2015/09/till-it-happens-to-you-lady-gaga.jpg',
        preco: '500',
        descricao: 'Lady Gaga – Till It Happens To You'
    },
  };
  
  
  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': 'Compra de Música',
            '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 de Pontos</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 onclick="buyItems()" value="Concluir compra" type="button" />  <input onclick="resetItems()" value="Resetar ítens" type="button" />
</div>

e um player  HTML de musica,na qual o senhor colocaria a musica que queria,é isso ? se for posso ajudar-lo .

Sim, mas também gostaria de um "Chat" onde os membros podem pedir músicas!
Assim que eles pedirem eu adiciono a música na loja!
Tipo assim:

Assim ficaria um pouco complicado que a imagem que o senhor passou tinha que se aplicar o HTML em cima da imagem isso difículta um pouco,não era mais facil,o senhor por o xat.com ou por uma votação das musicas votadas etc.

Bom, A base que eu posso fazer-lo.

Código:

<!DOCTYPE html>
<html>
<body>

<form action="">
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

<p><b>Note:</b> When a user clicks on a radio-button, it becomes checked, and all other radio-buttons with equal name become unchecked.</p>

</body>
</html>

Código:

<iframe src="URL_RADIO_=dddddd" height="49px" width="100%" frameborder="0" scrolling="no"></iframe>

então assim  o senhor ia por nos widged do fórum e a musica iria tocar,na qual o senhor escolheu,se quiser eu posso fazer para voce,so mandar os nomes da musicas,

Até mais,

Olá, 
O HTML fonte da Página é esse:

Código:

<script type="text/javascript">
  $(function() {
  var produtos = {

    'Infinity': {
        icone: 'http://todateen.uol.com.br/tt/wp-content/uploads/2015/09/one-direction-capa-album-made-in-am.jpg',
        preco: '500',
        descricao: 'One Direction - Infinity'
    },
 
    'All About The Bass': {
        icone: 'http://www.papelpop.com/papelpop/wp-content/uploads/2014/09/meghan.jpg',
        preco: '500',
        descricao: 'Meghan Trainor - All About The Bass'
    },
 
    'Cool For The Summer': {
        icone: 'http://assets.nydailynews.com/polopoly_fs/1.2282292!/img/httpImage/image.jpg_gen/derivatives/article_635/lovato6f-3-web.jpg',
        preco: '500',
        descricao: 'Demi Lovato - Cool For The Summer'
    },

  'Bang': {
        icone: 'https://lh3.googleusercontent.com/-Qb_e3oXpJmo/VhkLtTpm5gI/AAAAAAAAAdc/qYoRj92RPmk/s600/Bang.jpg',
        preco: '500',
        descricao: 'Anitta - Bang'
    },
   
  'Till It Happens To You': {
        icone: 'http://www.didiwagner.com.br/wp-content/uploads/2015/09/till-it-happens-to-you-lady-gaga.jpg',
        preco: '500',
        descricao: 'Lady Gaga – Till It Happens To You'
    },
  };
 
 
  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': 'Compra de Música',
            '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;">Rádio Store</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>

Ele é o da loja, mas gostaria que o incrementasse e colocasse um local onde os membros possa escrever e publicar a música que eles gostariam que tivessem na loja!

As músicas que primeiramente estarão na rádio serão:

Adele - Hello
Ariana Grande - Focus
Demi Lovato -Confident
Drake - Hotline Bling
Justin Bieber - Sorry
Meghan Trainor - Like I'm Gonna Lose You ft. John Legend
One Direction - Perfect
Selena Gomez - Same Old Love
Shawn Mendes - Stitches
Taylor Swift - Wildest Dreams

Proibido dar UP em menos de 24 horas da ultima resposta.

Quanto a sua duvida amigo, eu tou sem tempo pra algo assim, mas acredito que hoje a tarde, eu me livre de alguns compromissos e elaboro o codigo Html a você da maneira que você deseja, com esse local pros membros escreverem, mas você deseja que essas mensagens dos membros seja enviada pro seu MP ou pro Email?

e deseja que seja só o campo de texto ou com informações, ou até mesmo com opções pra assinalar.

Tiupkit escreveu:Proibido dar UP em menos de 24 horas da ultima resposta.

Quanto a sua duvida amigo, eu tou sem tempo pra algo assim, mas acredito que hoje a tarde, eu me livre de alguns compromissos e elaboro o codigo Html a você da maneira que você deseja, com esse local pros membros escreverem, mas você deseja que essas mensagens dos membros seja enviada pro seu MP ou pro Email?

e deseja que seja só o campo de texto ou com informações, ou até mesmo com opções pra assinalar.

Olha eu gostaria que fosse enviado via MP, alem de texto gostaria que tivesse outras informações como: Sexo, Nickname, Nome da música, Cantor...

Boa noite.

Eu não entendi. Poderia explicar exatamente o que deseja?
Obrigado desde já.

Até mais.
Fraise

Olá,
Desisti da página HTML!
Resolvi criar um portal, e nesse portal gostaria de colocar um Widget, e nesse Widget gostaria que fosse como um mural, onde o Membro coloque o nome de uma música que ele quer ouvir.

Foi o máximo que consegui arranjar:

Código:

<script type="text/javascript">
  jQuery.ajaxSetup({ cache: true });
 
  jQuery.getScript("https://static.jappix.com/server/get.php?l=pt&t=js&g=mini.xml", function() {
    JappixMini.launch({
        connection: {
          domain: "anonymous.jappix.com",
        },

        application: {
          network: {
              autoconnect: true,
          },

          interface: {
              showpane: true,
              animate: true,
          },

          user: {
              random_nickname: true,
          },

          groupchat: {
              open: ["Pedidos de música"],
          },
        },
    });
  });
</script>

Adicione o código num widget.

Até mais.
Fraise

Desculpe, mas não funcionou