Side-nav-02
blockHeaderEditIcon
App einbauen

Spezialanleitung: App zum Download auf der Website - nur für Smartphone-Aufrufe

Diese Anleitung ist nur für Fortgeschrittene und für Websites die mit dem Worldsoft-CMS erstellt sind.

In dieser Anleitung erstellen Sie einen Block, der nur eingeblendet wird, wenn ein Besucher die Website mit einem Smartphone aufruft. In diesem Block ist das App-Symbol, ein Text und der Link zu Ihrer eigenen App enthalten.
 

a) Hier sehen Sie ein Beispiel.

 
Push-Benachrichtigungen erstellen

Klicken Sie auf beide Links um den benötigten Code herunterzuladen:

HTML Code herunterladen
CSS Code herunterladen
 

Speichern Sie die Dateien auf dem Desktop ab.

 
Push-Benachrichtigungen erstellen

b) Gehen Sie auf Ihre Website und loggen sich als Inhaber oder Webmaster ein. Nachdem Sie eingeloggt sind klicken Sie im Visual Editor auf das Profil Symbol.

 
Push-Benachrichtigungen erstellen

c) In der Administration klicken Sie auf den Navigationspunkt "Bilder".

d) In der Bilderverwaltung klicken Sie auf den grünen Button.

 
Push-Benachrichtigungen erstellen

e) Nun können Sie ein Bild von Ihrem Computer hochladen. Wählen Sie Ihr App Symbol aus und laden es mit dem Button "Öffnen" in die Bilderverwaltung.

 
Push-Benachrichtigungen erstellen

f) Nachdem Hochladen klicken Sie auf den Link des Bildes.

 
Push-Benachrichtigungen erstellen

g) Nun öffnet sich eine Vorschau. Markieren Sie den kompletten Link des Bildes und kopieren diesen.

 
Push-Benachrichtigungen erstellen

h) Öffnen Sie nun die erste heruntergeladene Datei "html-popup-wbs-app.txt". Ersetzen Sie den Link zwischen den beiden Anführungszeichen mit Ihrem Bild-Link.

 
Push-Benachrichtigungen erstellen

a) Markieren Sie den Beispiel-Titel "App Titel" und ersetzten Sie diesen mit Ihrem Titel.

 
Push-Benachrichtigungen erstellen

b) Den Beispiel-Text können Sie ebenfalls abändern.

 
Push-Benachrichtigungen erstellen

a) Gehen Sie zurück in Ihre erstellte App. Kopieren Sie den Link Ihrer App.

 
Push-Benachrichtigungen erstellen

b) In dem HTML Code tauschen Sie den Link mit Ihrem Link aus.

 
Push-Benachrichtigungen erstellen

c) Die Beschriftung des Links können Sie hier anpassen.
 

Danach markieren Sie den kompletten Code im Text-Editor und kopieren diesen.

 
Push-Benachrichtigungen erstellen

Gehen Sie auf die Website zurück. Nun erstellen wir einen Block und fügen dort den HTML Code ein.

a) Klicken Sie im Visual Editor auf das "B" und dann auf das Plus Symbol.

b) In dem geöffneten Fenster klicken Sie auf "Neuer Block". Klicken Sie auf den Bereich mit dem grünen Rand. Mit Drag & Drop fügen Sie den Block an einer beliebigen Stelle auf der Website ein.

 
Push-Benachrichtigungen erstellen

c) Vergeben Sie einen passenden Namen für den Block.

 
Push-Benachrichtigungen erstellen

d) Klicken Sie in den Block. Nun öffnet sich ein Editor. Klicken Sie auf "Quellcode".

e) Fügen Sie in dem geöffneten Fenster Ihren HTML Code ein. Bestätigen Sie die Eingabe mit dem Button "Ok".

 
Push-Benachrichtigungen erstellen

f) Speichern Sie den Block mit dem Disketten- Symbol ab.

 
Push-Benachrichtigungen erstellen

a) Öffnen Sie den CSS Code und markieren und kopieren Sie den kompletten Code.

 
Push-Benachrichtigungen erstellen

b) Gehen Sie in die Administration der Website und klicken auf den Navigationspunkt "Design".

c) Klicken Sie auf das Pinsel Symbol.

 
Push-Benachrichtigungen erstellen

d) Fügen Sie an erster Stelle im Style.css den CSS Code ein und speichern es mit dem unteren Button "ABSCHICKEN".

 
Push-Benachrichtigungen erstellen

Das Endresultat sollte wie folgt aussehen.

 
Push-Benachrichtigungen erstellen

Benutzername:
User-Login
Ihr E-Mail
*