Using Contact Form 7 in Lightbox with sending custom parameters

This feature could be used every time when you are going to develop a landing page with catalog or services. People could order some goods or services online using a simple form, which has opened in lightbox.

I’ve done it while creating the LP for the shoe company, you can check it here: cross-nike.ru (if it still available).

I’ve used 3 plugins for doing that:

  • Shortcodes Ultimate
  • Contact Form 7
  • Easy Fancybox (to open images in lightbox, in the most cases Shortcodes Ultimate would be enough).

First, you should install these plugins.
Second, create contact form using plugin Contact Form 7.

This form is used in my example:

Contact Form code
<p></p>
<p>[tel* your-tel placeholder "Your Phone"]</p>
<p>[email* your-email placeholder "Your Email"]</p>
<p>SKU: </p>
<p>[submit "Order Now!"]</p>

Third, using Shortcodes Ultimate you could easily create catalog grid:

Catalog code
shortcode

Result

SALE! Nike AIR MAX 1

Nike AIR MAX 1

Size: 40-44
Material: Textiles
SKU: NKMX001
Buy now 210 CA$

Leave a Comment