Il varietà dove canti, mangi,bevie, balli e ti diverti alla Grande

Benvenuti nel mondo di The Social Karaoke, un format di varietà che trasforma ogni serata in un’esperienza indimenticabile! Qui si canta, si mangia, si balla, si beve e, soprattutto, ci si diverte alla grande. The Social Karaoke è molto più di un semplice karaoke; è un evento che coinvolge tutti i partecipanti, creando un’atmosfera unica e festosa.
Immaginate di trovarvi in un luogo dove tutti diventano amici, dove la musica e il divertimento si intrecciano in una serata indimenticabile. The Social Karaoke è costruito attorno alle persone che partecipano, permettendo a chiunque di esibirsi con le proprie canzoni preferite e di brillare sul palco. Che si tratti di un grande classico o di un successo recente, ogni canzone diventa un momento di condivisione e gioia.
Ma non finisce qui! Per rimanere sempre aggiornati sulle nostre serate e interagire con altri appassionati, seguiteci sulle nostre pagine Facebook e Instagram, dove potrete trovare foto, video e tutti i dettagli sui prossimi eventi. Inoltre, abbiamo creato un gruppo chiuso dedicato a tutti i giocatori e cantanti del The Social Karaoke, un luogo ideale per scambiare idee, suggerimenti e, naturalmente, divertirsi insieme!
The Social Karaoke è uno dei format di intrattenimento più apprezzati, capace di coinvolgere e divertire persone di ogni età. Non perdere l’occasione di far parte di questa avventura musicale e sociale! Ti aspettiamo per una serata all’insegna del divertimento e della musica!

Radio Web Show
The Social Karaoke
Le serate in giro per il Trentino. Chiedi la canzone che vuoi dal telefono, la base la cerchiamo noi.
<article class="tsk-serata tsk-viva">
<div class="tsk-quando">
<span class="tsk-giorno">ven 12 set</span>
<span class="tsk-ora">21:30</span>
</div>
<div class="tsk-dove">
<h3>Bar alla Fontana</h3>
<p>Mezzolombardo</p>
</div>
<p class="tsk-stato">Stasera si canta</p>
</article>
<article class="tsk-serata">
<div class="tsk-quando">
<span class="tsk-giorno">ven 19 set</span>
<span class="tsk-ora">21:00</span>
</div>
<div class="tsk-dove">
<h3>Pizzeria Fratelli Singh</h3>
<p>Mezzolombardo</p>
</div>
<p class="tsk-stato">Prossima data</p>
</article>
<article class="tsk-serata">
<div class="tsk-quando">
<span class="tsk-giorno">sab 27 set</span>
<span class="tsk-ora">21:30</span>
</div>
<div class="tsk-dove">
<h3>Nome del locale</h3>
<p>Citta</p>
</div>
<p class="tsk-stato">Prossima data</p>
</article>
<!-- ============================================================
THE SOCIAL KARAOKE - Radio Web Show
Da incollare in un blocco "HTML personalizzato" di WordPress.
DUE COSE DA CAMBIARE:
1) il numero WhatsApp -> cerca NUMERO_WHATSAPP
2) le serate -> cerca ELENCO SERATE
============================================================ -->
<div id="tsk-app">
<!-- ====== 1. IL TUO NUMERO WHATSAPP ======
Prefisso internazionale, senza + e senza spazi.
Esempio Italia: 393401234567
-->
<script>
var NUMERO_WHATSAPP = "393401234567";
</script>
<header class="tsk-testa">
<p class="tsk-marchio">Radio Web Show</p>
<h1 class="tsk-titolo">The Social <span>Karaoke</span></h1>
<p class="tsk-sub">Le serate in giro per il Trentino. Chiedi la canzone che vuoi dal telefono, la base la cerchiamo noi.</p>
</header>
<!-- ====== 2. ELENCO SERATE ======
Per aggiungere una serata: copia un blocco <article> intero e cambia i testi.
Per toglierla: cancella il blocco.
Alla serata di stasera metti class="tsk-serata tsk-viva"
-> diventa gialla e sblocca il modulo qui sotto.
-->
<div id="tsk-serate">
<article class="tsk-serata tsk-viva">
<div class="tsk-quando">
<span class="tsk-giorno">ven 12 set</span>
<span class="tsk-ora">21:30</span>
</div>
<div class="tsk-dove">
<h3>Bar alla Fontana</h3>
<p>Mezzolombardo</p>
</div>
<p class="tsk-stato">Stasera si canta</p>
</article>
<article class="tsk-serata">
<div class="tsk-quando">
<span class="tsk-giorno">ven 19 set</span>
<span class="tsk-ora">21:00</span>
</div>
<div class="tsk-dove">
<h3>Pizzeria Fratelli Singh</h3>
<p>Mezzolombardo</p>
</div>
<p class="tsk-stato">Prossima data</p>
</article>
<article class="tsk-serata">
<div class="tsk-quando">
<span class="tsk-giorno">sab 27 set</span>
<span class="tsk-ora">21:30</span>
</div>
<div class="tsk-dove">
<h3>Nome del locale</h3>
<p>Citta</p>
</div>
<p class="tsk-stato">Prossima data</p>
</article>
</div>
<!-- ====== fine elenco serate ====== -->
<section id="tsk-modulo">
<h2 class="tsk-h2">Chiedi la tua canzone</h2>
<p class="tsk-intro">Scrivi quello che vuoi cantare: abbiamo piu di ottomila basi, e se non c'e la cerchiamo.</p>
<div class="tsk-campo">
<label for="tsk-canzone">Canzone</label>
<input id="tsk-canzone" type="text" placeholder="Vasco Rossi - Albachiara" autocomplete="off">
<p class="tsk-aiuto">Scrivi cantante e titolo, cosi la troviamo al volo.</p>
</div>
<div class="tsk-campo">
<label for="tsk-nome">Come ti annunciamo</label>
<input id="tsk-nome" type="text" placeholder="Il tuo nome" autocomplete="off">
</div>
<div class="tsk-campo">
<label for="tsk-dedica">Dedica <span class="tsk-facolt">facoltativa</span></label>
<input id="tsk-dedica" type="text" placeholder="Per Maria, che compie gli anni" autocomplete="off">
</div>
<button id="tsk-invia" type="button" disabled>Manda al DJ</button>
<p class="tsk-nota">Si apre WhatsApp con il messaggio gia scritto: ti basta premere invio.</p>
</section>
</div>
<style>
#tsk-app {
--tsk-notte: #170F2E;
--tsk-faro: #FFC043;
--tsk-panna: #F7F2E8;
--tsk-fumo: rgba(247,242,232,0.58);
max-width: 560px;
margin: 0 auto;
padding: 26px 18px 40px;
background: var(--tsk-notte);
color: var(--tsk-panna);
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, sans-serif;
border-radius: 16px;
line-height: 1.5;
}
#tsk-app * { box-sizing: border-box; }
#tsk-app h1, #tsk-app h2, #tsk-app h3, #tsk-app p { color: var(--tsk-panna); }
.tsk-testa { margin-bottom: 28px; }
.tsk-marchio {
font-size: 12px; letter-spacing: .14em; font-weight: 700;
color: var(--tsk-faro); margin: 0 0 6px; text-transform: uppercase;
}
.tsk-titolo {
font-size: 38px; line-height: 1.02; font-weight: 800;
margin: 0; letter-spacing: -.01em;
}
.tsk-titolo span {
display: block; color: var(--tsk-faro);
text-transform: uppercase; letter-spacing: .01em;
}
.tsk-sub { margin: 12px 0 0; color: var(--tsk-fumo); font-size: 15px; }
.tsk-h2 { font-size: 21px; font-weight: 800; text-transform: uppercase; margin: 0 0 8px; }
#tsk-serate { margin-bottom: 34px; }
.tsk-serata {
display: flex; flex-wrap: wrap; gap: 14px; align-items: baseline;
border: 1px solid rgba(247,242,232,0.15);
border-radius: 14px; padding: 15px 16px; margin-bottom: 10px;
background: rgba(255,255,255,0.03);
}
.tsk-serata.tsk-viva { border-color: var(--tsk-faro); background: rgba(255,192,67,0.09); }
.tsk-quando { min-width: 84px; }
.tsk-giorno {
display: block; font-weight: 800; font-size: 15px;
color: var(--tsk-faro); text-transform: uppercase; letter-spacing: .02em;
}
.tsk-ora { display: block; font-size: 14px; color: var(--tsk-fumo); }
.tsk-dove { flex: 1; min-width: 150px; }
.tsk-dove h3 { margin: 0; font-size: 17px; font-weight: 700; }
.tsk-dove p { margin: 2px 0 0; font-size: 14px; color: var(--tsk-fumo); }
.tsk-stato { flex-basis: 100%; margin: 4px 0 0; font-size: 13px; color: var(--tsk-fumo); }
.tsk-viva .tsk-stato { color: var(--tsk-faro); font-weight: 700; }
.tsk-intro { color: var(--tsk-fumo); font-size: 15px; margin: 0 0 20px; }
.tsk-campo { margin-bottom: 15px; }
.tsk-campo label { display: block; font-size: 14px; margin-bottom: 6px; color: var(--tsk-fumo); }
.tsk-facolt { opacity: .65; font-style: italic; }
#tsk-app input[type="text"] {
width: 100%; padding: 13px; border-radius: 10px;
border: 1px solid rgba(247,242,232,0.24);
background: rgba(0,0,0,0.28); color: var(--tsk-panna);
font-family: inherit; font-size: 16px;
}
#tsk-app input[type="text"]::placeholder { color: rgba(247,242,232,0.32); }
#tsk-app input[type="text"]:focus {
outline: 2px solid var(--tsk-faro); outline-offset: 1px; border-color: transparent;
}
.tsk-aiuto { font-size: 13px; color: var(--tsk-fumo); margin: 6px 0 0; }
#tsk-invia {
display: block; width: 100%; margin-top: 20px; padding: 15px;
border: none; border-radius: 10px;
background: var(--tsk-faro); color: #21160A;
font-family: inherit; font-weight: 800; font-size: 16px; cursor: pointer;
}
#tsk-invia:disabled { background: rgba(247,242,232,0.12); color: var(--tsk-fumo); cursor: not-allowed; }
#tsk-invia:focus-visible { outline: 2px solid var(--tsk-panna); outline-offset: 2px; }
.tsk-nota { font-size: 13px; color: var(--tsk-fumo); margin: 14px 0 0; }
@media (max-width: 400px) {
#tsk-app { padding: 20px 14px 32px; border-radius: 0; }
.tsk-titolo { font-size: 32px; }
}
</style>
<script>
(function () {
var canzone = document.getElementById('tsk-canzone');
var nome = document.getElementById('tsk-nome');
var dedica = document.getElementById('tsk-dedica');
var invia = document.getElementById('tsk-invia');
if (!canzone || !nome || !invia) { return; }
function localeDiStasera() {
var viva = document.querySelector('.tsk-serata.tsk-viva .tsk-dove h3');
return viva ? viva.textContent.trim() : '';
}
function controlla() {
invia.disabled = !(canzone.value.trim().length > 2 && nome.value.trim().length > 0);
}
canzone.addEventListener('input', controlla);
nome.addEventListener('input', controlla);
invia.addEventListener('click', function () {
var testo = 'THE SOCIAL KARAOKE'
+ '\n' + 'Canzone: ' + canzone.value.trim()
+ '\n' + 'Nome: ' + nome.value.trim();
if (dedica && dedica.value.trim()) {
testo += '\n' + 'Dedica: ' + dedica.value.trim();
}
var locale = localeDiStasera();
if (locale) { testo += '\n' + 'Serata: ' + locale; }
window.open('https://wa.me/' + NUMERO_WHATSAPP + '?text=' + encodeURIComponent(testo), '_blank');
canzone.value = '';
if (dedica) { dedica.value = ''; }
controlla();
canzone.focus();
});
controlla();
})();
</script>
Chiedi la tua canzone
Scrivi quello che vuoi cantare: abbiamo piu di ottomila basi, e se non c’e la cerchiamo.
<div class="tsk-campo">
<label for="tsk-canzone">Canzone</label>
<input id="tsk-canzone" type="text" placeholder="Vasco Rossi - Albachiara" autocomplete="off">
<p class="tsk-aiuto">Scrivi cantante e titolo, cosi la troviamo al volo.</p>
</div>
<div class="tsk-campo">
<label for="tsk-nome">Come ti annunciamo</label>
<input id="tsk-nome" type="text" placeholder="Il tuo nome" autocomplete="off">
</div>
<div class="tsk-campo">
<label for="tsk-dedica">Dedica <span class="tsk-facolt">facoltativa</span></label>
<input id="tsk-dedica" type="text" placeholder="Per Maria, che compie gli anni" autocomplete="off">
</div>
<button id="tsk-invia" type="button" disabled>Manda al DJ</button>
<p class="tsk-nota">Si apre WhatsApp con il messaggio gia scritto: ti basta premere invio.</p>

