Kommentar-Felder anpassen

  • Hallo liebe Community.

    Bisher wurde mir immer geholfen, ich hoffe, auch diesesmal... :)

    Folgendes habe ich im Sinn:

    Ich möchte die Felder, mit denen man Kommentare abgeben kann, anpassen. Aktuell sehen sie so aus: Guten Appetit! : Kaba’s Blog

    Neben den Feldern soll, wenn man ein Feld ausfüllt, ein Info-Text erscheinen, in dem weitere Hinweiße stehen (zum Beispiel "Benötigt", "Wird nicht herausgegeben" etc). Ein Beispiel, wie diese Texte erscheinen sollen, kann man sich bei Lycos Mail anschauen, wenn man sich dort einen neuen Mail-Account anlegen möchte.

    Meine Frage nun: Wie kann ich so etwas ermöglichen? Mir geht es hauptsächlich um den Code, den ich einbauen muss. Den Rest (an welcher Stelle, was hineinkommt etc.), kann ich alles selbst erledigen... Hoffe ich zumindest.

    Ich hoffe, mir kann geholfen werden... :)

    Vielen Dank schon mal im Voraus!

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Also ich denke, das wäre mit JavaScript eine Sache weniger Minuten. Genauer gesagt mit der jQuery-Bibliothek. So könnte ich mir das vorstellen:

    Du fügst nach den Feldern die Hinweise an die gewünschte Stelle ein und versiehst die div-Tags mit der Klasse "commentInfo".

    Du definierst im JavaScript-File Deines Themes (wenn Du keines hast, lege es an und binde es in den Header des Themes ein, ggf. auch nur für Einzelansichten) eine jQuery-Methode, die beim Start der Seite ausgeführt wird:

    Code
    /**
     * The following is jQuery functionality that will be executed as soon as the
     * DOM is ready (roughly equal to onload).
     */
    jQuery(function($) {
      // hide comment info on page load
      $(".commentInfo").hide();
      // add event handler on comment form fields
      toggleCommentInfo();
    });



    Das versteckt schon mal beim Laden der Seite die Hinweise. Wer kein JavaScript aktiviert hat, sieht sie gleich.

    Dann fehlen noch die Event Handler an den Formularfeldern. Hier gehe ich davon aus, dass das commentInfo-div mit im p-Tag steht. Ansonsten wäre das hier noch anzupassen.

    Code
    function toggleCommentInfo() {
      $("#comment_form .text_input").click(function() { 
        $(this).parent("p").find(".commentInfo").show("slow");
      });
    }



    Das ist noch nicht sehr ausgefeilt, aber mit der jQuery-Doku kriegst Du das sicher auch selber beendet:
    Main Page - jQuery JavaScript Library

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!