Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Form preview area

Featured Replies

Hi,

 

I cannot find anything on the net to explain how I would go about making a form with a preview area, so if I changed a font or the text colour it would preview what I have typed in a preview box.

for example something along the lines of this:

Example

I don't know if it is my terminology i wrong when searching in google, would it be called a form preview??

 

Any ideas on how to go about designing one of these forms or know what they would be worded as, will be most appreciated thanks.

You'd need javascript and php (to handle the fonts/images). Css3 could be capable of handling the font preview bit.

 

Their code is here (don't steal, examine). - http://www.vipergraf.../personalize.js

 

Notice that they're processing it the image via php, and just passing the variables (like font and colour etc) to the url through js

 

I don't know what the terminology is for it though, i'll have a look around for you :)

 

Edit: I have a jquery based ajax form submit tut posted somewhere on this forum, that could probably be modified to suit. But you'd still need to find or write the php to process the images. How comfortable are you with these languages?

  • Author

Thanks for your reply, I have only just got html and css down still need to study the others. Great help, time to get my head down I think, where would be best to start.

 

Thanks

  • 2 weeks later...
  • Author

I have done a bit a reseach on this and don't know where to strart. I found another example here, but don't need it anywhere near as detailed as this, I just need a text area, font choices, colour choices, and outline, then a button to send all details to my zen cart purchase.

here's the complex example My link

and here's another, this is more basic and close to what i'll need My link

 

any help will be greatly appreciated

  • Author

Would it be quicker to learn flash and make a flash 'design online tool' rather than learning Css3, java and php?

 

thanks

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.