Page 1 of 1
*NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Sun 4. Dec 2011, 18:17
by santscho
Mit wenig Aufwand lassen sich in phpwcms recht schöne Formulare ausgeben, ohne den "CP Formular" mit CSS-Klassen auszustücken. Gerne teile ich meine Bastel-Arbeit mit euch. Zusätzlich habe ich noch ein zum Formular passendes Such-Widget bereit. Das ganze ist noch sehr Basic und sollte vielleicht noch verbessert werden. Jedenfalls könnt ihr es euch mal angucken und es ausprobieren.
What you get:
Und das Such-Widget:
Die Einstellungen im CP-Formular:
Das Suchwidget (CP html) kann einfach mittels {SHOW_CONTENT:CP,X} im Template untergebracht werden.Hier die möglichen Einstellungen:
Download:
https://github.com/santscho/phpwcms-Form-Enhancement
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Sun 4. Dec 2011, 19:57
by update
Santscho! Aber hallo
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 5. Dec 2011, 13:36
by santscho
Bin recht unzufrieden mit dieser Bauernlösung. Der phpwcms-Hack ist beinahe fertig. Der "Content Part 23"-Ersatz generiert standardmässig ein CSS-Formular statt eines Tabellen-Formulares. Jedes mögliche Formfeld (von Text bis Reset-Button) hat eine eigene Klasse. So bleiben im Formular-Design fast keine Wünsche offen. Muss noch ein paar Error-Klassen unterbringen, die Break-Text-Klasse noch einbauen und dann ist das Ding Einsatzbereit. Genaue Beschreibung folgt bald im Bereich "Hack" hier im Forum. Werde mich aber noch mit OG bezüglich einer Veröffentlichung absprechen.
Hier wie mein Formular zur Zeit gerendert wird (Die CSS-Datei ist auch schon fertig)
Code: Select all
<h3>Contact Form</h3><div class="form_font form_default_error">this is error text this is error text this is error text this is error text this is error text this is error text this is error text this is error text this is error text</div><form class="form_cp" name="phpwcmsForm44" id="phpwcmsForm44" action="index.php?magazines#jumpForm44" method="post">
<div class="form_font form_error_list"><ul><li>Name missing<li>Department missing<li>Security Code missing</ul>
</div>
<div class="form_field_required"><label for="name" class="label_formfield">Single Line</label>
<input type="text" class="form_font form_text" name="name" id="name" value="" class="error" /></div>
<div class="form_field"><label for="email" class="label_formfield"> </label>
This is a break text</div>
<div class="form_field"><label for="subcsriber" class="label_formfield">Radio Button</label>
<div class="form_radiobuttons"><input type="radio" class="form_radiobutton" name="subcsriber" id="subcsriber0" value="Radio 1" /><label for="subcsriber0">Radio 1</label><br /><input type="radio" class="form_radiobutton" name="subcsriber" id="subcsriber1" value="Radio 2" /><label for="subcsriber1">Radio 2</label><br /><input type="radio" class="form_radiobutton" name="subcsriber" id="subcsriber2" value="Radio 3" /><label for="subcsriber2">Radio 3</label></div></div>
<div class="form_font form_break">This is a Break field</div>
<div class="form_field_required"><label for="department" class="label_formfield">Email Select</label>
<select name="department" class="form_font form_select" id="department" class="error">
<option value="sQM4dCF8CX0=" selected="selected">Select...</option>
<option value="z6RsHsuPsIL+LLzoYwF/jeTpulEx9ccCTcDZag==">Asian Geographic</option>
<option value="qUG+dWEu3YP43dmahU/Rnzdu/Jb0pz52Q5b9zg==">Passport</option>
<option value="7kOscG2bv8kKA95rCgsvlvsErS7QkNWw8FiAlg==">Junior</option>
<option value="fN4V+CwRv7Z8a0Yh2ptLojL31mARsP70A4jJjA==">The Read</option>
<option value="X7Xt2uRIbsVtfwdTZrzU7wURmPxR+JXX52iSgw==">Subscription</option>
<option value="besDo0LA5MthOA3mfNtWhbVacOP90jiS3pQC8Q==">E-Magazine</option>
<option value="7SMfNjTbiMJfGGCeIu+4Sk04eTZjtBhqTpCSYQ==">Sales and Marketing</option>
<option value="EVf5StkaNd/7R5xk36JEM9yvFUW3P2oiGogVQA==">Distribution</option>
<option value="W6OsjkT2n2iDHf3TS4aVR8dpORmc5cdLfwY8hp0+">Webmaster</option>
</select></div>
<div class="form_field"><label for="enquiry" class="label_formfield">Multiline</label>
<textarea class="form_font form_textarea" name="enquiry" id="enquiry" cols="20" rows="5"></textarea></div>
<div class="form_field"><label for="checkbox" class="label_formfield">Checkbox</label>
<div class="form_checkboxes"><input type="checkbox" class="form_checkbox" name="checkbox[]" id="checkbox0" value="Check 1" /><label for="checkbox0">Check 1</label><br /><input type="checkbox" class="form_checkbox" name="checkbox[]" id="checkbox1" value="Check 2" /><label for="checkbox1">Check 2</label><br /><input type="checkbox" class="form_checkbox" name="checkbox[]" id="checkbox2" value="Check 3" /><label for="checkbox2">Check 3</label></div></div>
<div class="form_field_required"><label for="captcha" class="label_formfield">Security Code</label>
<input type="text" class="form_font form_captcha" name="captcha" id="captcha" value="" size="5" maxlength="5" class="error" /></div>
<div class="form_field"><label for="captchaimg" class="label_formfield"> </label>
<img src="img/captcha.php?regen=y&1323088093" alt="Captcha" border="0" /></div>
<div class="form_field"><label for="submitIt" class="label_formfield"> </label>
<input type="submit" class="form_font form_submit" name="submitIt" id="submitIt" value="Submit Enquiry" /><input type="reset" class="form_font form_reset" name="resetIt" id="resetIt" value="Reset Form" /></div>
<div><input type="hidden" name="cpID44" value="44" /><input type="hidden" name="af6b5f05d630e896ff967e101908a22a" value="1323088093" /></div>
</form>
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Tue 13. Dec 2011, 16:08
by santscho
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 01:12
by phalancs
Hey nice, wobei ich finde das so etwas immer direkt ins template gehört.
Dennoch, was ich viel spannender finde: wieso sieht das captcha iamge bei dir so viel schöner aus?
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 05:30
by Oliver Georgi
Das Captcha kannst Du anpassen.
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 11:34
by phalancs
Oha, und wie läuft das ab? Also ganz konkret, wie bekomme ich diese schönen schwarzen zahlen da hin?
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 11:50
by update
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 12:33
by Oliver Georgi
Das Captcha ist im System Claus, wozu anderes. Nicht nötig.
Ordner
template/inc_captcha. Einfach die Hintergrundgrafiken/Schriften ersetzen, fertig. Ansonsten
img/captcha.php analog Settings der Klasse anpassen:
include/inc_ext/SOLMETRA_FormValidator/SPAF_FormValidator.class.php
In der captcha.php Zeile 21/22:
Code: Select all
$spaf_obj->tag_ttl = 5;
// extend by own settings
$spaf_obj->backgrounds = array('myclean.png');
$spaf_obj->colors = array(array(0,0,0));
$spaf_obj->fonts = array('myfont1.ttf', 'myfont2.ttf');
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 13:41
by phalancs
Danke Oli, hatte mich auch schon gewundert, denn mit externen Lösungen ist logischerweise alles irgendwie möglich, aber mir dünkte dass es irgendwoe auch kit boardmitteln zu machen sein müsste.
Werd das mal probieren!
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Mon 10. Dec 2012, 22:34
by update
Oliver Georgi wrote:Das Captcha ist im System Claus, wozu anderes. Nicht nötig.
claus wrote:ganz unten..
Nein, so meinte ich das doch nicht
Da steht nur was von neu ladbaren Schriften, ganz unten im Link. Das Systemcaptcha greift ja auch auf ttf-Typen zu, da dachte ich, man könnte sich die wirrsten Fonts dazuladen (Anpassungen natürlich nötig).
Ich wollte doch keine fremden externen Captchacodes haben
Re: *NEU* Formular-Tuning (inkl. Such-Widget)
Posted: Tue 11. Dec 2012, 05:13
by Oliver Georgi