I have recently started using Wufoo for my online contact forms on many of my websites. However, I have come to realize that there are a few problems. 1. SPAM (no captcha w/ Wufoo) 2. Lack of Control Over Some Elements 3. Too Many Limitations I am going to be designing my own forms with CSS, using PHP, and I want the also be able to style the email that comes as a result of a form submission. Can anyone point me to the best tutorial(s) on how to do this? I can find plenty of CSS tutorials, but never anything on how to style my email so that all of the data is laid out using CSS when I receive my email with a submission. Thanks in advance.
hey check out ajaxrain.com for cool form css files... You use wufoo along with the scripts you get from this site. To see an example you can visit blog I have used wufoo form (lokks great with colors) and I have used a Livevalidation.js from Ajaxrain.com So no neeed to worry about form validations. let me know if this helps. I am not able to post link as I am new memebr.. u can PM me if you need more help.. and how are you planning to send email using an component?
Styling the form controls is not easy. Browsers and browser styles have much more power than you in this regard--especially Safari for Mac. It really makes your forms look goofy with all those round squishy submits etc. For getting around browser defaults, you should google "Legends of Style" and "Tyssen" (no quotes needed around Tyssen). The "legends" refers to form legends. He has some neat tricks for getting around (for example) how the background colour, fieldset and legend sit. For button styling, here's a nice little Sliding Doors tutorial someone passed along to me: http://www.wakeim.com/view/dynamic-custom-form-buttons-with-css/ For styling the emails that come out of this... with php you take the info and you have it stuff the filled-in info into a template. The stuff that's always the same is sitting there already (like, if an <h1> is used for the subject on the email page) and usually the only stuff that changes is <p> (the text) or since they're filling in a form, you may want a definition list and the CSS will have to be pre-styled (meaning,you'll fill out your own form and work with the results yourself first). I can't explain further with the PHP as I don't use the stuff, but I designed a site where people fill in a form and get a result (to check that they filled in correctly) and then also a copy of what their email contents will be (the email itself however is not stlyed, as not everyone chooses to allow HTML in their emails!). I used a definition list for what they've filled in-- old labels are dt's and their answers are dd's with the dt's floated left so everything lines up. Since the site's online and working I won't post a link but there's also a neat trick I did with the submit buttons (different than the link above) making them a squishing tomato when people click on it. If you'd like to see the non-online no-ads version PM me and I'll send the link. You can see how the form was set up too (nothing fancy in the styling but I do have CSS hovers like tooltips without Javascript) and the definition list.
Hmm, I am really looking for more information about how to style the emails that come to me when someone fills out a form. I want the emails to be formatted using CSS. Does anyone have any tutorials on this?
Hmm, you may want to read this: http://css-discuss.incutio.com/?page=StyleInEmail and this: http://webdesign.about.com/od/intermediatetutorials/a/aa073107.htm So apparently you'll go back in time to when Nirvana had a living singer and do stuff like <FONT>. : ( My email client (lycos) allows RichText and all that BS. I've always turned it off because I only see it in forwards where it's some joke or "inspirational story." Make sure that at least anyone getting the emails with all the HTML stuff turned off still get a readable email. To know what CSS you can get away with (if you know all your clients use the same email for example)... here: http://www.campaignmonitor.com/blog/archives/2006/03/a_guide_to_css_support_in_emai.html