Inhalte werden auf Seiten mit Passwortschutz nicht angezeigt
vor 24 Tagen
Hallo zusammen,
ich habe mir selbst ein kleines Tool für die Erstellung und Anzeige eines Zeitstrahls programmiert und dies über ein das Inhaltselement Emdeb eingebunden.
Soweit so gut. Jetzt das Problem. Zur Erstellung des Zeitstrahls möchte ich die Seite gern Passwortgeschütz nutzen, das nicht jeder wie er möchte dort was eintragen kann.
Sobald ich den Passwortschutz drin habe und mich anmelde bleibt der Inhalt im Inhaltselement leer. Nehme ich den Passwortschutz raus werden auch alle im Inhaltselement enthaltene Inhalte wieder korrekt angezeigt.
Grüße Enrico
39
4
Das könnte Ihnen auch weiterhelfen
vor 2 Jahren
427
0
2
vor 4 Jahren
243
0
3
Gelöst
vor 6 Jahren
905
0
1
Gelöst
754
0
4
169
0
3
vor 24 Tagen
Ohne deine Website, den Code deines Tools und Details deines Hostings zu kennen, kann man dein Problem nicht ohne Weiteres lösen.
Viele Grüße
Thomas
0
vor 22 Tagen
OK hier der Code. Wie gesagt finde es komisch das der Code ohne Passwortschutz perfekt angezeigt wird. Nur noch mal zum besseren Verständnis ich nutze den Passwortschutz direkt vom Designer der Webseitenstruktur.
Link zur Webseite: https://lodenau.de/Extras/Geschichte
Passwortschutz ist aktuell aus.
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Geschichte von Lodenau</title>
<style>
body {
font-family: 'Times New Roman', serif;
background-color: #f4f4f4;
padding: 20px;
text-align: center;
}
.timeline {
position: relative;
max-width: 800px;
margin: auto;
}
.timeline::after {
content: '';
position: absolute;
width: 6px;
background: #7b3f00;
top: 0;
bottom: 0;
left: 50%;
margin-left: -3px;
}
.event {
position: relative;
width: 45%;
padding: 20px;
background: white;
box-shadow: 2px 2px 10px rgba(0,0,0,0.1);
border-radius: 8px;
margin: 20px 0;
display: flex;
flex-direction: column;
align-items: center;
}
.left {
left: 0;
text-align: center;
}
.right {
left: 50%;
}
.event h3 {
margin: 0;
color: #7b3f00;
font-size: 24px;
}
.event h4 {
margin: 5px 0;
color: #333;
font-size: 20px;
}
.event p {
margin: 5px 0 0;
cursor: pointer;
white-space: pre-line; /* Add this line */
}
.event img {
width: 30%;
max-width: 100px;
border: 5px solid #7b3f00;
border-radius: 8px;
margin-top: 10px;
cursor: pointer;
transition: transform 0.3s ease;
}
.event img:hover {
transform: scale(1.8);
}
.event::before {
content: '';
position: absolute;
top: 50%;
width: 20px;
height: 20px;
background: #7b3f00;
border-radius: 50%;
transform: translateY(-50%);
}
.left::before {
right: -10px;
}
.right::before {
left: -10px;
}
.read-more {
color: #1e90ff;
font-weight: bold;
}
@media (max-width: 768px) {
.timeline::after {
left: 20px;
}
.event {
width: calc(100% - 40px);
margin-left: 40px;
margin-right: 0;
}
.left, .right {
left: 0;
text-align: left;
}
.left::before, .right::before {
left: 10px;
}
}
</style>
</head>
<body>
<h2>Geschichte von Lodenau</h2>
<div class="timeline" id="timeline"></div>
<script>
async function loadEvents() {
let response = await fetch('events.json');
let events = await response.json();
events.sort((a, b) => new Date(a.date.split('-').reverse().join('-')) - new Date(b.date.split('-').reverse().join('-'))); // Sortiere chronologisch
let timeline = document.getElementById('timeline');
timeline.innerHTML = '';
events.forEach((event, index) => {
let div = document.createElement('div');
div.className = 'event ' + (index % 2 === 0 ? 'left' : 'right');
let formattedDate = event.date.split('-').join('-');
let shortText = event.text.length > 300 ? event.text.substring(0, 300) + '... <span class="read-more">weiter lesen</span>' : event.text;
div.innerHTML = `
<h3>${formattedDate}</h3>
<h4>${event.title}</h4>
<p onclick="toggleText(this)">${shortText}</p>
${event.image ? `<img src="uploads/${event.image}" alt="Bild" onclick="openImage(this)">` : ''}
`;
div.dataset.fullText = event.text;
timeline.appendChild(div);
});
}
function toggleText(element) {
let fullText = element.parentElement.dataset.fullText;
if (element.innerText.includes('weiter lesen')) {
element.innerHTML = fullText + ' <span class="read-more">weniger anzeigen</span>';
} else {
element.innerHTML = fullText.substring(0, 300) + '... <span class="read-more">weiter lesen</span>';
}
}
function openImage(img) {
let newTab = window.open();
newTab.document.write('<img src="' + img.src + '" style="width:100%">');
}
function showSuccessMessage() {
document.getElementById("success-message").style.display = "block";
setTimeout(() => {
document.getElementById("success-message").style.display = "none";
}, 3000);
}
if (window.location.search.includes("success=true")) {
showSuccessMessage();
}
loadEvents();
</script>
</body>
</html>
2
Antwort
von
vor 22 Tagen
Hallo @enrico-draeger,
vielen Dank für den Code. Ich werde mir das mal genau ansehen und dir dann ein Feedback geben. Hab ein kleines bisschen Geduld.
Viele Grüße
Christine Kn
Antwort
von
vor 18 Tagen
Hallo @enrico-draeger,
ich habe eine Rückmeldung von den Kollegen im Backend erhalten.
Das Ganze liegt an der Art, wie das Embed-Widget funktioniert. Was du mit dem Widget machen möchtest, geht leider nicht. Sobald der Passwortschutz aktiviert ist, kann das Embed-Widget den Inhalt nicht anzeigen.
Freundliche Grüße
Kerstin Kl.
Uneingeloggter Nutzer
Antwort
von
Uneingeloggter Nutzer
Frage
von