On Mar 21, 2014, at 7:10 AM, Jill Hudson wrote:
Hi, does anybody know how to alter the input field values when using the HTML Item ? I would like to make my name and email fields deeper in height and I cant seem to do this within the inspector palette.
You can use CSS styles to make the form element look like anything you need. The simplest possible thing is to change the font-size property of that element. To test this out without a lot of hassle, click once on the text field, then choose Item / Extended from the main menu. Click on the tab, then press New. In the resulting sub-sub-dialog, enter the following name/value pair (top line goes in name, bottom line in value):
style
font-size: 18px
Okay out of the stack of dialogs and preview in a browser (you won’t see any change in Freeway’s design view). Experiment with this – you can do lots of different things, but some changes either won’t apply, or may apply unevenly without a “reset” stylesheet to strip out the native browser appearance. In Safari, font-size seems to move in “jumps”, where a little change will appear to be ignored, until you reach some threshold and then all of a sudden it applies. Experiment, and test in many browsers. Fiddling with the native appearance of form elements has well-documented usability problems, and you would be best to use a very light hand when fiddling like this.
You can take this further by creating a new style in Freeway’s Styles palette. As long as you stick to the Character section of the styles editor, or use the Extended interface area there, you won’t have any trouble applying that style to a text field. If you add any “paragraph” properties to the style, you will find that it’s impossible to apply it to the text field itself. The benefit to making this style and applying it is that you can then apply the same styles to more than one element on the page without typing everything long-hand into the Item / Extended interface.
I would also like to know how to make a custom ‘send’ button so also square and deeper in height…would I have to do this in photoshop first and bring the image in?
You can use the same types of CSS tricks to turn a “normal” submit button into anything you like. You can see both of these effects in use on my sign-up sheet for the Inlay CMS: http://inlay.io
View source on that page. It’s all just HTML, no images needed.
If you want to use an image button, just place an image on your page, and in the Inspector, check the Submit checkbox. The image will be used as an element.
Note that this has some fallout for your form handler: if you are using the name of the submit button as a means of detecting whether it was pressed, you will not receive the exact name of your button, as you may be expecting, in the POST array. You will need to test for your_button_name_x or your_button_name_y instead, and these will be positive numerical values, corresponding to the x / y coordinates on your button image where the visitor actually clicked. (The element can be used to make a click-map, since these coordinates are transmitted along with the rest of the form. If you had a map of the world, this could be used to detect which country a person wanted to see, for example.)
Walter
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
