NOF-Forum  |  Referenzen  |  Kontakt  |  Impressum  |  Sitemap

NetObjects Fusion - Tutorials
NOF Tutorials und Hilfe von Thomas Frei-Herrmann

Flash MP3 Player Beispiel

Hier mein Beispiel des gleichen Players als Video-Player. Dort könnt Ihr Euch den Player auch downloaden.
Und hier noch ein anderer Musik-Player als Alternative.

Musik von MusicFillingStation.de

 

Als klassischer Einzel-Player ...

 

... oder auch als einzelner Button

 

Ihr wählt lediglich im Hauptmenü “MP3 & Audio” und dann “Free Audio to Flash Converter

... nachdem Ihr Eure Original-Musik Dateien konvertiert habt, öffnet sich die HTML-Beispielseite des Programms, die dann so wie unten aussieht.

Hier eine Teilansicht und “height” hatte ich nach Erstellung vom Bild unten auf 105 gesetzt.

Einbau Beispiel (hier Multi-Player, die anderen Player funktionieren ganz genauso):

Diese Beschreibung bezieht sich auf Version 1.1.2.22, ist aber in Version 1.1.4.35 noch ganz genauso.

1) Jetzt könntet Ihr sämtliche Dateien, die das Programm konvertiert hat (natürlich nicht die Beispiel HTML und auch nicht Eure Original-Musik Dateien), in den Ordner kopieren wo sich die Seite befindet auf der Ihr den Code (oben) einbauen wollt. Das wäre entweder das Stammverzeichnis, wenn Ihr das auf Eurer
index.html (Startseite) einbaut oder der Ordner html, wenn Ihr das auf einer Unterseite einbaut. Wenn Ihr das macht, braucht Ihr an den Codes vom Programm nichts ändern.

oder ...

2) Ihr wollt ein wenig mehr Ordnung halten und alle die vom Programm generierten Dateien in einem separaten Ordner unterbringen (so wie ich es hier gemacht habe). Dann müsstet Ihr allerdings einige Änderungen im generierten Code vornehmen.


Beispiel:

Ich habe mir einen Ordner, den ich

mp3player

genannt habe, in meinem Stammverzeichnis meines Projektes angelegt.
Das ist auf dem PC der Ordner “Lokale Publizierung” also ungefähr hier:


C:\Programme\NetObjects\NetObjects Fusion 10.0\User Sites\Euer Projekt Ordner\Lokale Publizierung
oder ab NOF 11
C:\Dokumente und Einstellungen\Admin\Eigene Dateien\NetObjects Fusion 11.0\User Sites\Euer Projekt Ordner\Lokale Publizierung


... und auf dem Server ist das Stammverzeichnis dort, wo sich auch Eure index.html befindet.


In diesen neuen Ordner habe ich nun alle vom Programm generierten Dateien kopiert:


MP3 Dateien (alle meine MP3-Dateien, die das Programm generiert hat)
player_mp3_multi.swf (eines von vielen Designs des Players, hier “Multi-Player”)
playlist_TomTomBrazil_1.txt (die Liste aller MP3-Dateien die im Player stehen)
TomTomBrazil_1.txt
(die Konfigurations-Datei des Players)

Bemerkung: Die beiden .txt-Dateien erhalten vom Programm automatisch den Namen der zuerst generierten Musik-Datei (hier TomTomBrazil_1.txt) und heißen bei Euch dementsprechend anders.


Nun müsstet Ihr noch folgende Anpassung vornehmen, damit auch alle Dateien gefunden werden. Ich habe diese mal unten blau markiert.

Dabei müsst Ihr auf die relative Pfadangabe achten.

Hier in meinem Beispiel von einer Unterseite, die sich im Ordner html befindet ../
Auf der index.html, die sich im Stammverzeichnis befindet, müsste dann nur ein Punkt dort hin, also so ./

Im generierten Code ...

<object id="Object1" type="application/x-shockwave-flash" data="../mp3player/player_mp3_multi.swf" width="300" height="105">
<noscript><a href="http://www.dvdvideosoft.com/products/dvd/Free-YouTube-Download.htm">youtube video</a></noscript>
<param name="movie" value="../mp3player/player_mp3_multi.swf" />
<param name="wmode" value="opaque" />
<param name="autoplay" value="true" />
<param name="autoload" value="true" />
<param name="FlashVars" value="config=../mp3player/TomTomBrazil_1.txt" />
</object>

Dieser Code oben wird dann in die HTML eines Textfeldes kopiert:

> Textfeld aufziehen > demarkieren > durch einfachen Klick markieren > Buttom “HTML
> und den Code (oben) “Vor dem Tag” (NOF 11 “vorher”) einfügen.

... und in den .txt-Dateien ebenfalls die relative Pfadangabe zum Ordner mp3player nachtragen.
Hinten nach dem | stehen die Titel, die angezeigt werden und beliebig dort umgeschrieben werden können:

playlist_TomTomBrazil_1.txt

../mp3player/TomTomBrazil_1.mp3|Tom Tom Brazil
../mp3player/alsiestamar_1.mp3|Alsiestamar
../mp3player/
citylights_1.mp3|Citylights
../mp3player/
lovely_1.mp3|Lovely
../mp3player/salizaapicante_1.mp3|Salizaapicante

... und dann gibt es noch die Datei (auch hier den Pfad zum neuen Ordner mp3player nachtragen)

TomTomBrazil_1.txt

In dieser Datei könntet Ihr verschiedene Einstellungen vornehmen, wie Größe des Players, Farben oder z.B. auch ob die Musik automatisch startet (autoplay=1) oder nicht (autoplay=0). Einen Link zu den möglichen Einstellungen findet Ihr in der vom Programm generierten Beispiel-HTML-Seite.

playlist=../mp3player/playlist_TomTomBrazil_1.txt
width=300
height=105
volume=100
showlist=1
showvolume=1
showinfo=1
autoplay=0
loop=1
shuffle=0
loadingcolor=bbbbbb
bgcolor1=3a5b9e
bgcolor2=3d60a5
bgcolor=3a5b9e
buttoncolor=ffffff
buttonovercolor=748cbc
slidercolor1=ffffff
slidercolor2=bac2d2
sliderovercolor=748cbc
textcolor=c6d1e5
playlistcolor=ffffff
playlistalpha=40
currentmp3color=ffffff
scrollbarcolor=c6d1e5
scrollbarovercolor=c6d1e5
showslider=1
showloading=always
showplaylistnumbers=1

nach oben

zurück

 

Tutorials von Thomas Frei-Herrmann

diese Seite weiter empfehlen


Counter Statistik