onclick Funktion zum abspielen von Audios

  • Werte WP-Gemenide,

    ich übertrage gerade eine alte Homepage auf Wordpress.
    In der ehemaligen Webseite gab es eine Funktion, die das abspielen von Audios im selben Fenster mit onclick ermöglicht hat.
    Der Code sah dazu folgendermaßen aus:

    HTML
    <a class="soundlink" href="/audios/L01_G1/L01_001.mp3" onclick="execSoundLink(this, '/audios/L01_G1/L01_001.mp3', false); return false" id="soundLink-0"><img style="width: 25px; height: 25px; border: none;" src="http://forum.wpde.org/images/alwpikto-3.png" alt=""></a>

    Das ganze wurde dann mit folgender Funktion abgewickelt:

    Die obenstehende Funktion habe ich als audio.js Datei gespeichert und lade diese im head.
    Leider lädt bei click auf das Image immer noch ein neues Fenster mit dem html5 player.

    2. Problem, wenn ich im Editor auf visuellen Modus schalte, entfernt er die gesamte onclick Anweisung.
    Hierfür habe ich folgenden code in meiner functions.php des Child-Themes eingefügt:

    Leider auch hier ohne den gewünschten Effekt.

    Wer kann mir helfen, das Ganze richtig zu stellen.

    Vielen Dank im Voraus

    MfG

    Robert

    • 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

  • Hallo Freunde,

    das erste Problem konnte ich bereits lösen. Ich habe auf der alten Seite noch die Fuktion gefunden, die execSoundLink ausführt:

    Code
    function execSoundLink (element, filepath, soundControls) {    if(soundControls) {
            soundController.selectFile(filepath);
            soundController.play();
        } else {        // just play sound:
            soundController.playFileOnce(filepath);
        }
    }

    Ich habe entsprechend die .js Datei erweitert.
    Damit funktioniert das Abspielen.

    Jetzt muss ich WP nur noch beibringen, mir den Html-Code nicht zu bereinigen, wenn ich zwischen Visuell- und Texteditor hin und her wechsel.

    Wer hat eine Idee?

    Danke

  • Hallo,

    Danke für die Rückmeldung. Darüber habe ich auch schon nachgedacht.
    Allerdings habe ich einige 1000 solcher Audiolinks, daher muss ich einen Weg finden, ohne jeden Link einzeln anzufassen.

    Der Shortcode müsste ja in etwa so aussehen:

    Code
    [sc-audio url="[COLOR=#0000FF]/audios/L01_G1/L01_001.mp3[/COLOR]" [COLOR=#008000]onclick=[/COLOR][COLOR=#0000FF]"execSoundLink(this, '/audios/L01_G1/L01_001.mp3', false); return false"[/COLOR][COLOR=#0000FF]][/COLOR]

    Da nur die Url variable ist, müsste ich dann wahrscheinlich im Dreamweaver per Suchen & Ersetzen mit einem regulären Ausdruck arbeiten, der mich den variablen Teil bei Ersetzen wiederverwenden lässt.

    Hat jemand noch eine bessere Idee. Mir scheint es ginge auch leichter. Ich denke vielleicht zu kompliziert.

  • Hallo,

    Danke für die Rückmeldung. Darüber habe ich auch schon nachgedacht.
    Allerdings habe ich einige 1000 solcher Audiolinks, daher muss ich einen Weg finden, ohne jeden Link einzeln anzufassen.

    Der Shortcode müsste ja in etwa so aussehen:

    Code
    [sc-audio url="[COLOR=#0000FF]/audios/L01_G1/L01_001.mp3[/COLOR]" [COLOR=#008000]onclick=[/COLOR][COLOR=#0000FF]"execSoundLink(this, '/audios/L01_G1/L01_001.mp3', false); return false"[/COLOR][COLOR=#0000FF]][/COLOR]

    Da nur die Url variable ist, müsste ich dann wahrscheinlich im Dreamweaver per Suchen & Ersetzen mit einem regulären Ausdruck arbeiten, der mich den variablen Teil bei Ersetzen wiederverwenden lässt.

    Hat jemand noch eine bessere Idee. Mir scheint es ginge auch leichter. Ich denke vielleicht zu kompliziert.

    Genau genommen würde folgendes reichen:
    [sc-audio url="[COLOR=#0000FF]/audios/L01_G1/L01_001.mp3[/COLOR]"]

    Den Rest kannst du ja in PHP machen (ist ja nur statisch bzw wieder die URL).

    Wenn du davon aber sehr viele ersetzen musst, ist das tatsächlich gebastel.

  • Ja aber, das (das „Gebastel“) müsste doch eigentlich über Suchen & Ersetzen in der Datenbank dann machbar sein. Oder sehe ich was falsch / übersehe ich was?

    Gruß
    helix

  • Ist das momentan in der Form

    Code
    [COLOR=#008000]<a class=[COLOR=#0000FF]"soundlink"[/COLOR] href=[COLOR=#0000FF]"/audios/L01_G1/L01_001.mp3"[/COLOR] onclick=[COLOR=#0000FF]"execSoundLink(this, '/audios/L01_G1/L01_001.mp3', false); return false"[/COLOR] id=[COLOR=#0000FF]"soundLink-0"[/COLOR]>[/COLOR][COLOR=#800080]<img style=[COLOR=#0000FF]"width: 25px; height: 25px; border: none;"[/COLOR] src=[COLOR=#0000FF]"http://forum.wpde.org/images/alwpikto-3.png"[/COLOR] alt=[COLOR=#0000FF]""[/COLOR]>[/COLOR][COLOR=#008000]</a>
    [/COLOR]

    [COLOR=#008000]
    [/COLOR]
    in jedem Post (also im Textmodus im TinyMCE) eingebunden?

    EDIT: Ach, die alte Website war gar kein WP ... aber hast du die 1000e Einträge dann schon rüberimportiert oder wie ist der aktuelle Stand?

    "Gewinnspiele, Gutscheinaktionen, Werbung, insbesondere kommerzielle, ist sowohl in Signaturen als auch Beiträgen ohne vorherige Genehmigung des Betreibers verboten. Bei Zuwiderhandlung behalten wir uns vor die Beiträge zu löschen und den entsprechenden User zu sperren." Auszug aus den WPDE.org Nutzungsbedingungen

  • Ja aber, das (das „Gebastel“) müsste doch eigentlich über Suchen & Ersetzen in der Datenbank dann machbar sein. Oder sehe ich was falsch / übersehe ich was?

    Ne klar. Wie er schon sagt, müsste man das Suche&Ersetzen mit einem regulären Ausdruck hinbekommen. Und dann idealerweise aber schon nochmal alles prüfen. Das meinte ich mit "Gebastel".

Jetzt mitmachen!

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