• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 307
  • Last Modified:

Need assistance adding form fields to web page without altering formatting

I am attempting to help a friend add the proper form function to a snippet of code he likes from a similar web site he is working with.

The following is exactly how he wants the final look to be. We just need to replace the form submission and field information (below this snippet):


<div id="optin_area" class="full_width">
		<div class="page">
			<h3>Sign up now to start living the life you’ve dreamed about!</h3>

			<div class="moonray_forms moonray_smart_form">
<form action="https://forms.moon-ray.com/v2.4/form_processor.php?" id="moonray_forms_574" method="post" data-captcha="false">


<fieldset class="moonray_form_format_labels_inside">
<!-- EDITABLE PARTS BELOW -->
<div class="moonray_form_field_wrapper"><input name="firstname" value="First Name" label="First Name" class="moonray_input required text" size="30" onblur="if (this.value == '') {this.value = 'First Name';}" onfocus="if (this.value == 'First Name') {this.value = '';}" type="text"></div><div class="moonray_form_field_wrapper"><input name="email" value="E-Mail" label="E-Mail" class="moonray_input required text" size="30" onfocus="if (this.value == 'E-mail') {this.value = '';}" type="text"></div>

</fieldset>
<input class="optin_submit" value="Get It!" type="submit">
<!-- EDITABLE ENDS (DO NOT EDIT CONTENTS BELOW)-->
</form>
 <link rel="stylesheet" href="http://ginalamorte.raymondnorton.com/wp-content/themes/tempest/mf.css" type="text/css" media="all" />
    

 <link rel="stylesheet" href="http://ginalamorte.raymondnorton.com/wp-content/themes/tempest/forms.moon-ray.com.css" type="text/css" media="all" />

</div>

Open in new window

---------------------------------------------------------------
Form info to insert:

<form accept-charset="UTF-8" action="https://ex168.infusionsoft.com/app/form/process/6d64954beaead7c599b222d9e8391408" class="infusion-form" method="POST">
    <input name="inf_form_xid" type="hidden" value="6d64954beaead7c599b222d9e8391408" />
    <input name="inf_form_name" type="hidden" value="webform" />
    <input name="infusionsoft_version" type="hidden" value="1.29.10.21" />
    <div class="infusion-field">
        <label for="inf_field_FirstName">First Name *</label>
        <input class="infusion-field-input-container" id="inf_field_FirstName" name="inf_field_FirstName" type="text" class="infusion-field">
        <label for="inf_field_Email">Email *</label>
        <input class="infusion-field-input-container" id="inf_field_Email" name="inf_field_Email" type="text" class="infusion-submit">
        <input type="submit" value="Submit" />
    </div>
</form>

Open in new window

0
tamray_tech
Asked:
tamray_tech
  • 3
  • 2
1 Solution
 
Jason C. LevineNo oneCommented:
If the form is hosted on the other site, you need to copy the styles too.  Otherwise the formatting won't work.  

Please note that, at best, this is plagiarism.  At worst you could be in violation of a copyright and subject to legal action.
0
 
tamray_techAuthor Commented:
No problem using code from scratch. Just want to achieve that look with the form data supplied.
0
 
Jason C. LevineNo oneCommented:
Without any CSS we can't "see" the styles.  If you know how to use CSS and can reference the other form as you need to, this isn't tough to do.  

If you don't know CSS, you have some issues.
0
 
tamray_techAuthor Commented:
I do have the css to reference, but Just got a message from my friend that he has an html instructor wiling to help him. Will delete question for now.
0
 
tamray_techAuthor Commented:
No longer need a solution to this question
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: C++ 11 Fundamentals

This course will introduce you to C++ 11 and teach you about syntax fundamentals.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now