Inhalte werden auf Seiten mit Passwortschutz nicht angezeigt

22 days ago

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

    • 22 days ago

      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

    • 20 days ago

      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

      Answer

      from

      20 days ago

      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

      Answer

      from

      16 days ago

      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.

      Unlogged in user

      Answer

      from

      Unlogged in user

      Ask

      from