Einkaufs Formular

Nach unten

Einkaufs Formular Empty Einkaufs Formular

Beitrag von ADO-finder Sa 4 Nov 2017 - 12:22

Heute möchten wir euch zeigen, wie ihr mit DW Formmailer ein einfaches Einkaufsformular für eure Ado oder School erstellen könnt.


Schritt 0 - Vorbereitung
Zu erst solltet ihr euch darüber Gedanken machen, was für einen Shop ihr machen wollt, was dort verkauft wird und wie viel die Items kosten. Außerdem braucht ihr Bilder zu den Items. Im Sprite & Grafiken Bereich findet ihr eine große Auswahl an Items. Bitte gebt auf jeden Fall die Credits an, wenn ihr die Items benutzt. Ladet die Bilder auf euren Server oder Bild-Hoster um die URL zu bekommen (Bitte nicht direkt von uns verlinken!)


Schritt 1
Wenn ihr alles habt dann geht ihr auf dw-formmailer.de.
In diesem Beispiel erstellen wir einen Schulkiosk der 5 Items verkauft. 
Wir brauchen also schonmal 5 Felder.
Außerdem muss der Benutzer seine Daten angeben. Benutzername und E-mail. Das Kaufformular braucht noch einen Gesamtpreis am Ende und evt. Kann man noch ein Feld einfügen, für die Verteilung. 
insgesamt sind es also 9 Felder. Die gebt ihr dort an und dann geht es zu Schritt 2.

Schritt 2
Hier werden nun alle daten angegeben. Zu allererst "Feldtyp
Ein Einzelliges Textfeld für den Benutzernamen.
E-Mail Feld für die E-Mail Adresse
Artikel m. Bild/Anz für die 5 Artikel 
(Ihr könnt natürlich auch auf Bild oder Anzahl verzichten. Dazu nimmt ihr dann das jeweils Passende Feld)
Rechnungsbetrag für den Gesamtpreis
(Achtung! Dieses Feld gibt es zwei Mal. Achtet darauf dass ihr Brutto und nicht Netto nimmt, denn sonst wird automatisch eine Umsatzsteuer drauf gerechnet!)
Textfeld Klein für die Verteilung
(Dort können die Benutzer angeben, welche Pets, Pokemon, Feen usw welche Items bekommen sollen, dieses Feld könnt ihr natürlich auch weg lassen)

Als Nächstes gebt ihr Feldname und Beschreibung an. Beides kann durchaus gleich sein. Das eine sieht man nachher im Formular und das andere sieht nur der Admin in der E-Mail.

Bei req (Optionsfeld auf der linken Seite) könnt ihr angeben, ob es ein Pflichtfeld ist. Dies gilt auf jeden Fall für Benutzername und E-Mail. Die anderen sind natürlich keine Pflichtfelder.

Und zu letzt müsst ihr den Preis angeben. Diesen gebt ihr rechts in size3 an. 
Das EUR in size2 könnt ihr ruhig belassen, das ändern wir später.

Das Ganze sollte zum Schluss etwa so aussehen:
Einkaufs Formular Einkauf1

Dan geht es weiter zu Schritt 3

Schritt 3
In diesem Schritt werden normalerweise die Bilder eingetragen. Doch da diese Formulare dazu gedacht sind echte Waren zu verkaufen und somit normalerweise Fotos eingesetzt werden, kommt der nicht so mit den Sprites klar. Deshalb müssen wir die Bilder nachher Manuel eintragen.
Fügt einfach irgendeine Bild-URL bei allen Artikeln ein und geht weiter zu Schritt 4

Schritt 4
Hier müsst ihr nur eure Mailadresse und den Betreff eingeben
Einkaufs Formular Einkauf2

Schritt 5
Bei Schritt 5 sehr ihr nun euer Ergebnis. Es sieht noch nicht ganz so schön aus, aber lasst euch davon bitte nicht entmutigen. Ihr könnt auf der Rechten Seite nun noch die Farbcodes angeben, die zu eurer HP passen.
Einkaufs Formular Einkauf3
Danach kopiert ihr den Code (Müsst etwas nach unten Scrollen) und fügt ihn in einem Editor-Programm ein. Die meisten Baukästen haben eins. Wenn ihr keins habt könnt euch ggf. Kompozer dafür herunter laden. Selbstverständlich könnt ihr es auch im Quellencode selbst ändern, aber dies benötigt etwas Erfahrung in HTML 

Einkaufs Formular Einkauf4

Schritt 6

Nun verschönern wir das ganze.
Als erstes ersetzen wir diese großen Bilder mit unseren Sprites. 
Einkaufs Formular Einkauf5
Das sieht doch gleich viel besser aus.
Nun müssen wir noch etwas mit dem EUR machen.
Ihr könnt hier natürlich einfach Kürzel reinsetzen. Ihr könnt aber auch Icons reinpacken, die eure Währung darstellen.

Außerdem (Das ist aber Freiwillig) Nehme ich immer dieses "Bitte Artike auswählen!"
Einkaufs Formular Einkauf6

Nun muss es nur noch auf die HP gepackt werden (Wenn ihr es in Kompozer oder einem anderen externen Programm bearbeitet habt, dann kopiert nun einfach den Quellencode und fügt ihn auf eurer Seite ein.

Einkaufs Formular Einkauf7

Und fertig ist es :)
Wenn ihr Fragen dazu habt, könnt ihr gern hier rein schreiben oder eine PN schicken :)
ADO-finder
ADO-finder
Admin

Laune : Offen
Anzahl der Beiträge : 85
Anmeldedatum : 03.04.14

http://ado-finder.de

Nach oben Nach unten

Nach oben

- Ähnliche Themen

 
Befugnisse in diesem Forum
Sie können in diesem Forum nicht antworten