Benchmark
Benchmark

Reputation: 1

Creating a multiple field form in one row in Avada Theme

I’ve got to get the below form code onto a single row like: http://snag.gy/k5yrv.jpg

<form method="GET" action="YOUR_JOBS_PAGE_URL">
  <p>
    <label for="keywords">Keywords</label>
    <input type="text" id="search_keywords" name="search_keywords" />
  </p>
  <p>
    <label for="keywords">Location</label>
    <input type="text" id="search_location" name="search_location" />
  </p>
    <p>
    <input type="submit" value="Search" />
  </p>
</form>

I’m using Avada Theme Contact Form 7 and I need to create a form with multiple fields in one row will look like this. For example, this uses 3 column sections, one field per column:

div class="fusion-one-third one_third fusion-layout-column fusion-spacing-yes">Your Name (required) [text* your-name]</div>
<div class="fusion-one-third one_third fusion-layout-column fusion-spacing-yes">Your Message [textarea your-message]</div>
<div class="fusion-one-third one_third fusion-layout-column fusion-spacing-yes fusion-column-last">[submit "Send"]</div>

Any ideas?

Upvotes: 0

Views: 3038

Answers (2)

Benchmark
Benchmark

Reputation: 1

Thanks for your help bluewhitew, but I don't think that would work. The full code is below. I missed something out because I don't want a 'Category' field, but I think I left out an important function. As clicking submit should take you to a job list page, with your selection listed.

<form method="GET" action="YOUR_JOBS_PAGE_URL">
  <p>
    <label for="keywords">Keywords</label>
    <input type="text" id="search_keywords" name="search_keywords" />
  </p>
  <p>
    <label for="keywords">Location</label>
    <input type="text" id="search_location" name="search_location" />
  </p>
  <p>
    <label for="search_category">Category</label>
    <select id="search_category" name="search_category">
        <?php foreach ( get_job_listing_categories() as $cat ) : ?>
            <option value="<?php echo esc_attr( $cat->term_id ); ?>"><?php echo esc_html( $cat->name ); ?></option>
        <?php endforeach; ?>
    </select>
  </p>
  <p>
    <input type="submit" value="Search" />
  </p>
</form>

Upvotes: 0

bluemwhitew
bluemwhitew

Reputation: 390

Surely can you not just do:

<div class="fusion-one-third one_third fusion-layout-column fusion-spacing-yes">[text keywords placeholder "job title, keywords or company name"]</div>
<div class="fusion-one-third one_third fusion-layout-column fusion-spacing-yes">[text location placeholder "city, province or region"]</div>
<div class="fusion-one-third one_third fusion-layout-column fusion-spacing-yes fusion-column-last">[submit "Search"]</div>

Unless I'm misunderstanding your question completely?

Upvotes: 1

Related Questions