adjust zem_contact layout

jameslomax · 2006-04-06 14:27:34

How do I modify the way the e mail form displays? As you know, the default is

NAME
E MAIL
MESSAGE

and what I’d like to have is

NAME MESSAGE
E MAIL

….in other words, just adjust the layout of the text areas.
Thanks.

tranquillo · 2006-04-06 17:34:16

Use the tags of zem_contact:

See the help text of the plugin for further explanations.

jameslomax · 2006-04-06 19:28:34

OK I’ve been looking into this for over an hour, and still can’t work out the solution. For someone who doesn’t know php, it is impossibly confusing suddenly being presented with all the code for a plug in. Tried a few hit and miss alterations in what seemed to be the right place, using this advice from the help file:

break – Break tag between the label and field. Default is . Use break=’‘ to put the label and input field on the same line.

– didn’t seem to do anything. And theres no mention there of changing the default vertical layout

to what I want which is more horizontal…………

KurtRaschke · 2006-04-06 19:32:52

I will reiterate the suggestion made previously by tranquillo—for what you are trying to accomplish you do not need to edit the plugin code, but rather the form where you are using the zem_contact tags. Could you please post the current contents of that form?

-Kurt

jameslomax · 2006-04-06 20:29:49

OK thanks, if you have some ideas about this (and I was confused – I thought this required edting the plug in code). I think this is the form you are referring to:

Last edited by jameslomax (2006-04-06 20:30:44)

KurtRaschke · 2006-04-06 21:21:37

Okay, so presently each one of the fields is in its own , so it ends up on its own line. All you have to do is adjust the HTML as you would in any other form to produce the desired results. Something like the following may produce what you’re looking for:

 <txp:zem_contact mailto="nospam@yahoo.com">
<p><txp:zem_contact_text label="Name" required=1 /><txp:zem_contact_textarea required="1" /></p>
<p><txp:zem_contact_email required="1" /></p>
<txp:zem_contact_submit />
</txp:zem_contact>

-Kurt

Last edited by KurtRaschke (2006-04-06 21:22:06)

jameslomax · 2006-04-07 09:25:26

Yes that looks more balanced, thanks.
Is it possible though, to arrange the layout like this:
 
NAME FIELD         MESSAGE FIELD
E MAIL FIELD
 
- I can’t work out how to do that, even by adjusting the <code>p</code>

KurtRaschke · 2006-04-07 15:39:46

So the goal is a larger gap between the name field and the message textarea? Probably best to do that in CSS, with either a margin-right on the name field or a margin-left on the message textarea.

-Kurt

jameslomax · 2006-04-07 16:55:57

KurtRaschke wrote:

So the goal is a larger gap between the name field and the message textarea? Probably best to do that in CSS, with either a margin-right on the name field or a margin-left on the message textarea.

Yes a gap, but more importantly the three areas are arranged horizontally and not vertically: name and e mail on the left, and message on the right.

How do I do that in css?

KurtRaschke · 2006-04-07 18:03:35

You can do it with CSS floats. There are plenty of CSS tutorials out there.

-Kurt

Textpattern CMS

Textpattern CMS support forum

#1 2006-04-06 14:27:34

adjust zem_contact layout

#2 2006-04-06 17:34:16

Re: adjust zem_contact layout

#3 2006-04-06 19:28:34

Re: adjust zem_contact layout

#4 2006-04-06 19:32:52

Re: adjust zem_contact layout

#5 2006-04-06 20:29:49

Re: adjust zem_contact layout

#6 2006-04-06 21:21:37

Re: adjust zem_contact layout

#7 2006-04-07 09:25:26

Re: adjust zem_contact layout

#8 2006-04-07 15:39:46

Re: adjust zem_contact layout

#9 2006-04-07 16:55:57

Re: adjust zem_contact layout

#10 2006-04-07 18:03:35

Re: adjust zem_contact layout

Board footer