Contact Form 7

Rubenz Theme is compatible with popular plugin Contact Form 7 for sending messages through your website. Let’s set it up.

If you have correctly imported demo data then you should see a shortcode in here. Copy this shortcode. Now edit a page with Elementor where you want to place your contact form.

In case you don’t see the imported shortcode, you can create a new one by yourself. Here is the full HTML code to be inserted in “Form” section in Contact Forms:

<div class="row form__header">
  <div class="col form__col">
    <h2>Write Us Some Words</h2>
  </div>
</div>
<div class="row form__row">
  <div class="col form__col">
    <label class="input-float js-input-float">
      [text* your-name class:input-float__input]
      <span class="input-float__label">Your Name</span>
    </label>
  </div>
</div>
<div class="row form__row">
  <div class="col form__col">
    <label class="input-float js-input-float">
      [email* your-email class:input-float__input]
      <span class="input-float__label">Your Email</span>
    </label>
  </div>
</div>
<div class="row form__row">
  <div class="col form__col">
    <label class="input-float js-input-float">
      [textarea your-message class:input-float__input class:input-float__input_textarea rows:3]
      <span class="input-float__label">Your Message</span>
    </label>
  </div>
</div>
<div class="row form__row">
  <div class="col form__col form__col_submit">
    <button class="button button_fullwidth button_black button_solid wpcf7-form-control wpcf7-submit" type="submit"><span>Send Message</span></button>
  </div>
</div>

For more information on how setup your e-mail settings and templates, please check official Contact Form 7 Documentation.