0 Fackeln 0 Fackeln ×

Was ist WavePlayer?

WavePlayer ist ein vollständig anpassbar, reaktionsschnelle HTML5-audio-Erweiterung für WordPress. Die Schnittstelle basiert auf der Wellenform der audio-Datei, die Wiedergabe ist.

Hier ist eine Liste der wichtigsten Funktionen:

  • gesteuerte Schnittstelle, mit einem modernen aussehende Stil
  • HTML5-Unterstützung
  • vier verschiedene Größen, die automatisch an Ihre Seite anpassen
  • volle Integration mit dem WordPress-Media-Manager
  • Visual Editor im WordPress-Post-Editor
  • Archivierung von Peak-Dateien für einen sofortigen Zugriff auf die Wellenformen

Wie installiere ich es?

Wie installiere ich WavePlayer

eine visuelle Anleitung KLICKEN SIE HIER

Schritt 1 – In WordPress Plugins Abschnitt, Klicken Sie auf die Fügen neuer hinzu Schaltfläche ", direkt neben der Plugins Seitentitel.

Schritt 2 – Klicken Sie auf die Plugin hochladen Schaltfläche ", direkt neben der Hinzufügen von Plugins Seitentitel.

Schritt 3 – Klicken Sie auf die Wählen Sie Datei Schaltfläche um wählen den Speicherort der Ihre waveplayer.zip Datei.

Schritt 4a – Wechseln Sie zu dem Speicherort, wo Sie heruntergeladen, die waveplayer.zip Datei.

Schritt 4 b – Klicken Sie auf die Offene Schaltfläche ".

Schritt 5 – Das Plugin ist jetzt aktiv. Klicken Sie auf die Einstellungen Link rechts unterhalb des Namens oder gehen Sie zu Einstellungen-> WavePlayer Konfigurieren Sie die Optionen.

Schritt 6 – Wenn WordPress Plugin-Dateien hochladen abgeschlossen ist, Klicken Sie auf die Plugin aktivieren Link.

Schritt 7 – Das Plugin ist jetzt aktiv. Klicken Sie auf die Einstellungen Link rechts unterhalb des Namens oder gehen Sie zu Einstellungen-> WavePlayer Konfigurieren Sie die Optionen.

Wie man es benutzt?

WordPress-Media Manager

Preis ab Version 3.9, WordPress macht es möglich, direkt aus dem WordPress-Media-Manager audio-Playlisten erstellen. WavePlayer nutzt diese Fähigkeit die Einführung einer waveplayer Kurzwahlnummer, die standardmäßig erweitert playlist Kurzwahlnummer. Diese neue Kurzwahlnummer bietet den Nutzern eine modernere Oberfläche für ihre audio-tracks, unter Beibehaltung der gleichen Bedienkomfort bei der Erstellung ihrer Lieblings-playlists. Darüber hinaus, WavePlayer überschreibt auch die integrierten audio Kurzwahlnummer, so dass Sie automatisch eine eingleisige Instanz WavePlayer finden wo auch immer Sie haben bereits eine audio Shortcode in Ihren Seiten. Auch im backend!

wvpl-wpmediamanager

Gewusst wie: Erstellen einer neuen Instanz von WavePlayer

eine visuelle Anleitung KLICKEN SIE HIER

Schritt 1 – Um eine neue Instanz der WavePlayer erstellen, einfach erstellen oder Bearbeiten der Post oder Seite wo möchten Sie die WavePlayer hinzufügen, und klicken auf die Hinzufügen von Medien Schaltfläche ", rechts über den Visual Editor-Symbolleisten.

Schritt 2 – In der linken Seitenleiste, zusammen mit den anderen Elementen können Sie erstellen WordPress, finden Sie ein Menü zum Erstellen einer neuen Instanz von WavePlayer. Klicken Sie auf Erstellen von Waveplayer.

Schritt 3 – Wenn Sie bereits einige audio Dateien hochgeladen haben, Du kannst es hier wählen. Ansonsten, Klicken Sie auf die Dateien hochladen Registerkarte ", um neue audio-Dateien hochladen.
(WordPress können Sie eine empfohlene Bild auf Audiospuren sowie jeder anderen Art von Beitrag anfügen. Wenn Sie das Feature Bild einer Audiospur festlegen, WavePlayer wird es als Miniaturansicht dieses Tracks im Player verwenden).

Schritt 4 – Laden Sie Ihre audio-Tracks auf WordPress Dropbereich ziehen oder Dateien auswählen aus Ihren lokalen Laufwerken.

Schritt 5 – Die Dateien hochgeladen werden, während Sie gerade Erstellen einer neuen Instanz von Waveplayer bekommen für die Instanz Playlist automatisch ausgewählt..

Schritt 6a – Während dem Hochladen noch verarbeitet wird, Sie können bereits in Ihrer Medienbibliothek weitere Titel auswählen

Schritt 6 b – Wenn der Upload abgeschlossen ist und Sie zufrieden sind mit Auswahl, Sie können schließlich erstellen Sie eine neue Instanz der WavePlayer anklicken die Erstellen Sie eine neue WavePlayer Schaltfläche ".

Schritt 7a – Jetzt, Sie können Ihre Instanz von WavePlayer bearbeiten., beginnend mit der Reihenfolge der tracks. Um die Reihenfolge zu ändern, per drag & drop ihre Miniaturen rund um.

Schritt 7 b – In der WavePlayer Einstellungen Panel, Sie können die Standardeinstellungen des Spielers ändern, Das wird den Aspekt dieser Instanz auf der Seite verändern.

Schritt 7c – Wann sind Sie zufrieden mit Ihrer Konfiguration, Klicken Sie auf die WavePlayer einfügen Schaltfläche zum Einfügen von der Instanz, die Sie gerade, in Ihre Seite oder per Post erstellt haben.

Schritt 8 – Sie können sofort die Instanz eine Vorschau, die Sie gerade in der Post-Editor eingefügt haben. Sie können sogar Wiedergabe der audio-tracks!

WavePlayer können Sie mit einer visuell komplett und vollständig interaktive Wiedergabe der Spieler mitten im Post-Editor arbeiten, So sparen Sie die Zeit hin und her zwischen dem Post-Editor und die aktuelle Seite im Frontend gehen.

Möchten Sie die ausgewählte Instanz ändern, Klicken Sie einfach auf die Schaltfläche.

Schritt 9 – Wenn Sie weitere Titel zu einer Wiedergabeliste hinzufügen möchten, Klicken Sie auf die Fügen Sie hinzu Waveplayer Menüpunkt.

Schritt 10a – Wenn eine Instanz von WavePlayer ändern, die Sie zuvor in Ihrem Beitrag eingefügt haben, Sie können noch weitere audio-Tracks hinzufügen., Wählen sie aus der Medienbibliothek oder sogar Hochladen neuer Dateien, genau die gleiche Weise hast du beim ursprünglich den Spieler erstellen.

Schritt 10 b – Wenn Sie mit Ihrer Auswahl zufrieden sind, Klicken Sie auf die Fügen Sie hinzu WavePlayer Button, um Ihre neuen Tracks hinzugefügt, um die vorherige Playlist des Players zu sehen.

Schritt 11 – Natürlich, Sie können die Reihenfolge der Tracks noch ändern. (Ziehen der Dateien) oder der Aspekt des Spielers (Ändern der Einstellungen WavePlayer).

Wenn Sie fertig sind, mit Ihnen bearbeiten, Klicken Sie auf die Update-WavePlayer Taste, um Ihre Änderungen wirksam zu machen.

Schritt 12 – Klicken Sie auf die Veröffentlichen (für neu erstellte Beiträge oder Seiten) oder die Update Schaltfläche " (für veröffentlichte bereits Beiträge oder Seiten) Ihre Änderungen abschließen.

Jetzt ist es Zeit für Sie, die Seite mit Ihrem Endergebnis zu besuchen!

Kurzwahlnummer

Obwohl die waveplayer Shortcode für alle Parameter wird automatisch erstellt, beim Einfügen von Waveplayer durch die Hinzufügen von Medien Frame, Es empfiehlt sich, seine Struktur zu verstehen, die wie folgt ausgestattet ist:

[ Waveplayer Ids = "IDs der ausgewählten Stücke mit Kommas" 
             MP3 = "" 
            Größe = "LG" | "MD" | "SM" | "XS" 
           Stil = "Licht" | "dunkel" 
           Form = "Quadrat" | "Kreis" | "gerundet" 
        AutoPlay = "wahr" | "falsch" 
      Repeat_all = "wahr" | "falsch" 
         mische = "wahr" | "falsch" 
      Wave_color = "#ddd" 
    wave_color_2 = "#666" 
  Progress_color = "#59f" 
progress_color_2 = "#05ein" 
   Hover_opacity = "0.4" 
    Cursor_color = "#EE2" 
  cursor_color_2 = "#D93" 
    Cursor_width = "2" 
       Wave_mode = "4" 
       Gap_width = "1" 
Wave_compression = "2" 
  Wave_asymmetry = "2" ]
Parameter

ids – Dies ist der einzige Parameter und es ruft automatisch gefüllt mit den IDs der Tracks ausgewählt der Hinzufügen von Medien Frame. Zusammen mit dem folgenden Parameter leer mp3, Diese Instanz von der Waveplayer wird ausgeblendet.

mp3 – Wenn die ids Parameter ist leer gelassen., Sie können eine URL in eine mp3-Datei durch diesen Parameter bereitstellen.. Wenn die Datei lokal ist, Waveplayer versucht die IDS Tags Informationen zugreifen und zeigt sie in der Infoleiste des Spielers.

size – Definiert die Größe des Players. Zulässige Werte sind: lg, md, sm und xs. Bei Nichtangabe, der Spieler wird in der Standardeinstellung angezeigt size Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

style – Kann eingestellt werden light oder dark und definiert die Farbe des Bereichs, in dem die Informationen des aktuellen Titels angezeigt,. Des weiteren, Waveplayer ist vollständig anpassbar durch die Benutzerdefinierte CSS Möglichkeit Einstellungen –> Waveplayer. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. style Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

shape – Kann eingestellt werden square, circle oder rounded und definiert die Form der Miniaturansicht gibt den Speicherort der Steuerelemente für die Wiedergabe. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. shape Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

autoplay – Wenn legen Sie auf true, der Spieler wird die Spur Wiedergabe starten, sobald die Seite laden abgeschlossen ist. Wenn legen Sie auf false, der Benutzer muss die Wiedergabe manuell starten. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. autoplay Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

repeat_all – Wenn legen Sie auf true, der Spieler wird wieder die Gleise kontinuierlich weiter spielen, Neustart aus dem ersten Track, letzteres am Ende. Wenn legen Sie auf false, die Wiedergabe wird gestoppt, nachdem der letzte Track beendet wurde. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. repeat_all Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

shuffle – Wenn legen Sie auf true, der Spieler wird die Tracks mischen, jedes Mal, wenn der Besucher die Seite neu geladen. Wenn legen Sie auf false, die Reihenfolge der Tracks wird derjenige sein, der im Lieferumfang der ids der Parameter. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. shuffle Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

wave_color, wave_color_2 – Definiert die Start- und Farbe von der vertikalen Farbverlauf füllen die Wellenform. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. wave_color und wave_color_2 Einstellungen, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer. Für ein besseres Verständnis der Wellenform Färbung Regelung, entnehmen Sie bitte der Bereich der Wellenform-Optionen von der Einstellungen.

progress_color, progress_color_2 – Definiert die Anfangs- und Endfarbe des vertikalen Farbverlauf füllen den ausgeführten Teil der Wellenform. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. progress_color und progress_color_2 Einstellungen, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer. Für ein besseres Verständnis der Wellenform Färbung Regelung, entnehmen Sie bitte der Bereich der Wellenform-Optionen von der Einstellungen.

hover_opacity – Die Deckkraft des Welle-Overlays definiert, wenn der Benutzer den Mauszeiger über die Welle bewegt. Legen Sie diesen Parameter auf 0 haben Sie eine regelmäßige kontinuierliche Wellenform. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. hover_opacity Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

cursor_color, cursor_color_2 – Definiert die Start- und Farben von einem vertikalen Farbverlauf für den Cursor Scrollen über die Wellenform. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. cursor_color und cursor_color_2 Einstellungen, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer. Für ein besseres Verständnis der Wellenform Färbung Regelung, entnehmen Sie bitte der Bereich der Wellenform-Optionen von der Einstellungen.

cursor_width – Definiert die Breite der Balken Darstellung der Wellenform. Legen Sie diesen Parameter auf 0 haben Sie eine regelmäßige kontinuierliche Wellenform. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. cursor_width Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

wave_mode – Definiert den Visualisierungs-Modus der Welle. Wenn legen Sie auf 0 ("Kontinuierliche’ Seite "Einstellungen"), die Wellenform wird als eine regelmäßige kontinuierliche Wellenform angezeigt werden. Jeder anderen Einstellung aus 1 An 10 stellt die Breite einer der Bars, die Anzeige der Wellenform in einem Histogramm-Mode verwendet. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. wave_mode Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

gap_width – If wave_mode wird auf einen beliebigen Wert außer festgelegt 0 ("Continuous"), dieser Parameter definiert die Breite der Lücke zwischen den Balken repräsentieren die Wellenform. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. gap_width Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

wave_compression – Definiert die Kompression der Welle. Diese Option hat keine Auswirkungen auf die Audio-Datei, aber nur die Art und Weise seiner Wellenform angezeigt bekommt. Geringere Komprimierung zeigt einen offensichtlicher Unterschied zwischen geringer Intensität und hoher Intensität in der Wellenform. Im Gegensatz dazu, eine höhere Komprimierung fasst diese Unterschiede, zeigt eine einheitlichere Welle. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. wave_compression Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

wave_asymmetry – Definiert das Verhältnis zwischen der Höhe der oberen Hälfte der Welle und die Höhe des unteren Teils der Wellen. Bei Nichtangabe, der Spieler wird die Standardeinstellung verwenden. wave_asymmetry Einstellung, entsprechend der entsprechenden Option von Einstellungen –> Waveplayer.

Einstellungen

WavePlayer Einstellungen – gelegen an der Einstellungen –> WavePlayer Seite von der WordPress-Admin-Bereich – definieren Sie wie eine Kurzwahlnummer ohne Parameter angezeigt, sofern als die IDs der Audiospuren in einer bestimmten Instanz des Spielers eingeschlossen werden sollen, wie die folgenden:

Bitte beachten Sie, dass Sie diese Einstellungen ändern die Art und Weise jede Instanz mit beeinflussen ALLE fehlender Parameter werden auf Ihrer Website angezeigt werden.

Standard-Player-Optionen

eine visuelle Anleitung KLICKEN SIE HIER

Im ersten Bereich der WavePlayer Einstellungen definieren Sie die Standardoptionen für den size, style, shape, autoplay, repeat_all und shuffle Parameter. Wenn Sie eine Instanz der Waveplayer ohne Angabe einer dieser Parameter einfügen, die Instanz wird nach diesen Einstellungen angezeigt.

Standard-Wellenform-Optionen und -Farbschema

eine visuelle Anleitung KLICKEN SIE HIER

Im zweiten Bereich der WavePlayer Einstellungen können Sie die Standardwerte festlegen, die definieren, wie die Wellenform wird gerendert werden. Wenn Sie eine Instanz der Waveplayer ohne Angabe einer dieser Parameter in den Shortcode einfügen, die Instanz wird nach diesen Einstellungen angezeigt.

Durch diese Optionen haben Sie die Wellenform, die perfekt aufeinander abgestimmte Ihre aktuellen WordPress-Theme und Dank der Echtzeit-Vorschau, Sie sehen das Ergebnis Ihrer Änderungen ohne sogar die Notwendigkeit, die Einstellungen zu speichern.

Des weiteren, Diese Einstellungen können als Parameter jedes Waveplayer Shortcode hinzugefügt werden, jede Instanz des Spielers anpassen, unabhängig von diesen Standardeinstellungen.

HTML & CSS-Anpassung

eine visuelle Anleitung KLICKEN SIE HIER

Die letzte Diskussionsrunde finden Sie zwei verschiedenen textareas.

Das erste man, Info-Bar-Schablonen, können Sie die Informationen in der Info-Leiste beginnt eine Spur Wiedergabe anpassen. Ziemlich alle ID3-Tags können Sie, die Sie kennen, in der Audiodatei gespeichert werden, die Sie hochgeladen. Schreiben Sie einfach HTML-Vorlage einschließlich jeden Tag umgeben von einer “%” Charakter. Zum Beispiel, Wenn der Titel des Liedes und dem Künstlernamen angezeigt werden sollen, Sie können den folgenden HTML-Code in Textarea schreiben.:

%title% by %artist%

Die zweite textarea, Benutzerdefinierte CSS, können Sie das Standard-Stylesheet eigene CSS-Regeln hinzu, die mit dem Plugin kommt. Entweder können die Standard-CSS-Regeln anpassen oder erstellen Sie Ihren eigenen Satz von Regeln in der Info-Bar-Vorlage hinzugefügt werden.

Wartung

eine visuelle Anleitung KLICKEN SIE HIER

Eine Spitze-Datei gespeichert ist, durch WavePlayer in der ‘Spitzen‘ Unterordner des Plugins, immer wenn ein audio-Track zum ersten Mal geladen wird. Dies ermöglicht WavePlayer die Wellenform der einzelnen Audiodateien schneller rendern folgenden Zeiten.

Wenn Sie eine Audiospur löschen, die zuvor in WavePlayer verwendet wurde, die Gipfel-Datei bleibt ungenutzt für immer im Unterordner "Höhepunkt" des Plugins. Obwohl die Peak-Dateien sehr klein sind. (in der Regel rund 30 kB), Es ist eine Verschwendung von Ihrer hosting-Raum, wenn Sie geschehen, hochladen und audio Anlagen regelmäßig löschen. Es wird empfohlen, die verwaisten Peak-Dateien klicken Sie auf Löschen der Verwaiste Peak-Dateien löschen Schaltfläche jedes Mal, wenn Sie eine enorme Menge an Audiogeräte anschließen von Ihrer Webseite löschen.

If, aus irgendeinem Grund, Sie möchten sicherstellen, dass WavePlayer regeneriert die Peak-Dateien, Sie müssen sie löschen mit der Alle Peak-Dateien löschen Schaltfläche ".

Impressum

WavePlayer nutzt die folgenden Projekte:

wavesurfer.js – Die Fähigkeit der Wellenform-Gestaltung finden Sie in WavePlayer basiert auf Waveform.js, von katspaugh, um ein effizienteres Management der Leinwand Funktionen optimiert und erweitert, um ein WordPress-Plugin integriert werden. Erfahren Sie mehr über dieses Projekt auf die Wavesurfer.js Offizielle Seite oder bei der Wavesurfer.js GitHub Ppage.

Wavesurfer.js ist lizensiert unter einer Creative Commons Attribution 3.0 Unported Lizenz.

Schriftart-ehrfürchtig – Tasten und Symbole featured in WavePlayer werden bereitgestellt Schriftart Awesome, ein CSS-Toolkit basierend auf einer ikonischen Schrift. Die Schriftart ist veröffentlicht unter einem SIL OFL 1.1 Lizenz.

Der CSS-Code ist veröffentlicht unter einem MIT-Lizenz.

Changelog

v1.0.18
* Erste Veröffentlichung

0 Fackeln Twitter 0 Facebook 0 Google 0 PIN es teilen 0 LinkedIn 0 E-Mail -- 0 Fackeln ×

Hinterlasse eine Antwort

Ihre e-Mail-Adresse wird nicht veröffentlicht. Pflichtfelder sind markiert *