Anzeige mit Sendungstitel, Moderator und Thema der Sendung

Radio Music Pub · 18. Dezember 2024

Wir möchten auf unserer HP die nachfolgende Sendung angezeigt bekommen,

im Forum habe ich nichts passendes gefunden. Die HP ist mit Wordpress erstellt.

https://rmp-fm.de

Moderatorbild

Moderatorname

Name der Sendung

Thema der Sendung

Für Anregungen und Lösungen danke ich schonmal im Voraus.

Onkel_des_Todes · 18. Dezember 2024

Moin! Das wird doch schon bei euch angezeigt...

Radio Music Pub · 19. Dezember 2024

Leider nicht so, wie wir es uns wünschen.

Es wird eine Lösung, gerade ausprobiert.

Snupi · 21. Dezember 2024

Die gewünschte Information bekommt man über die Anzeige der aktuellen Sendung.

https://rmp-fm.de/sendeplan/in…?page=infos&mode=onairbox

**drcomputer** · 22. Dezember 2024

hier ist mal extra für deine seite mal ein beischpiel wie die onair boch und nächste sendung angezeigt werden kann

HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Radio Sendeplan</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
padding: 20px;
background-color: #121212;
color: #ffffff;
}
h1 {
text-align: center;
color: #ff6f61;
}
.card {
margin: 20px auto;
padding: 20px;
border: 1px solid #333;
border-radius: 8px;
background-color: #1e1e1e;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
width: 80%;
max-width: 600px;
}
.card h2 {
margin: 0 0 10px;
color: #ff6f61;
}
.card p {
margin: 5px 0;
color: #dddddd;
}
.avatar {
width: 50px;
height: 50px;
border-radius: 50%;
object-fit: cover;
margin-top: 10px;
}
.description {
margin-top: 10px;
color: #bbbbbb;
}
</style>
</head>
<body>
<h1>Radio Sendeplan Infos</h1>
<div id="onAir" class="card">
<h2>On Air</h2>
<p>Loading...</p>
</div>
<div id="nextOnAir" class="card">
<h2>Next On Air</h2>
<p>Loading...</p>
</div>
<script>
async function fetchOnAir() {
const url = "https://sendeplan.rmp-fm.de/index.php?page=infos&mode=json&opt=onair";
try {
const response = await fetch(url);
const data = await response.json();
const container = document.getElementById("onAir");
container.innerHTML = `
<h2>${data.showname || "No Show Name"}</h2>
<p><strong>Moderator:</strong> ${data.anzeigename || "N/A"}</p>
<p><strong>Zeit:</strong> ${data.von || "N/A"} - ${data.bis || "N/A"}</p>
<img src="${data.profil_bild || 'layout/noavatar.png'}" alt="Avatar" class="avatar">
`;
} catch (error) {
console.error("Error fetching On Air data:", error);
document.getElementById("onAir").innerHTML = `<p>Failed to load On Air data.</p>`;
}
}
async function fetchNextOnAir() {
const url = "https://sendeplan.rmp-fm.de/index.php?page=infos&mode=json&opt=next_onair";
try {
const response = await fetch(url);
const data = await response.json();
const container = document.getElementById("nextOnAir");
const next = data.next || {};
container.innerHTML = `
<h2>${next.showname || "No Show Name"}</h2>
<p><strong>Moderator:</strong> ${next.anzeigename || "N/A"}</p>
<p><strong>Zeit:</strong> ${next.vons || "N/A"} - ${next.bis || "N/A"}</p>
<p class="description">${next.beschreibung ? decodeHTMLEntities(next.beschreibung) : "N/A"}</p>
<p><strong>Aktueller Song:</strong> ${data.currentsong || "N/A"}</p>
<img src="${next.profil_bild || './uploads/noavatar.png'}" alt="Avatar" class="avatar">
`;
} catch (error) {
console.error("Error fetching Next On Air data:", error);
document.getElementById("nextOnAir").innerHTML = `<p>Failed to load Next On Air data.</p>`;
}
}
function decodeHTMLEntities(text) {
const textarea = document.createElement("textarea");
textarea.innerHTML = text;
return textarea.value;
}
function updateInfos() {
fetchOnAir();
fetchNextOnAir();
}
// Initial load
updateInfos();
// Update every 10 seconds
setInterval(updateInfos, 10000);
</script>
</body>
</html>

Alles anzeigen

und das kann man mit leichen anpassungen auch in wordpress einfügen mittels den addon "Woody code snippets (PHP snippets | Insert PHP)"

Gefällt Dir der Thread? Möchtest du was dazu schreiben?

Dann logge Dich bitte mit deinem Benutzerkonto ein.
Du besitzt noch kein Benutzerkonto? Dann registriere Dich jetzt kostenlos! Nach der Registrierung kannst du das Forum uneingeschränkt nutzen.

Jetzt Spenden und das Projekt unterstützen