{"id":825723,"date":"2018-01-11T16:00:34","date_gmt":"2018-01-11T16:00:34","guid":{"rendered":"https:\/\/www.lafactory.com\/blog\/how-to-add-a-cost-estimation-form-to-your-site-using-the-web-agency-layout\/"},"modified":"2022-12-10T13:49:30","modified_gmt":"2022-12-10T13:49:30","slug":"how-to-add-a-cost-estimation-form-to-your-site-using-the-web-agency-layout-2","status":"publish","type":"post","link":"https:\/\/www.lafactory.com\/blog\/en\/how-to-add-a-cost-estimation-form-to-your-site-using-the-web-agency-layout\/","title":{"rendered":"How to Add a Cost Estimation Form to Your Site Using the Web Agency Layout"},"content":{"rendered":"\n
\n

Every web agency has to make a critical decision about how they want to handle estimates. It is pretty much the first thing customers want to know when looking for a new website.<\/p>\n

With the release of the new Web Agency Layout Pack, I was inspired to show you how to integrate a cost estimation form. To do this, I settled on a popular plugin called WP Cost Estimation & Payment Form<\/a><\/em>. This plugin comes with a lot of great customization features. Not only can this plugin calculate cost based on certain selections made by the user, it can also process those payments. And since the plugin uses shortcodes to embed the form, you can basically embed the form anywhere on my page using the Divi Builder.<\/p>\n

For this tutorial, I\u2019m going to show you how easily you can design a professional cost estimation form and add it to your website using the Web Agency Layout Pack. I\u2019ll even show you how you can customize the form to match the design of your site.<\/p>\n

Let\u2019s get started.<\/p>\n

Sneak Peak<\/h2>\n

Check out a sneak peak of the form on the web agency layout.<\/p>\n

\"gif\"<\/p>\n

The Setup<\/h2>\n

For the sake of time, I\u2019m going to start this tutorial with the following steps already completed:<\/p>\n

    \n
  1. Install and activate the\u00a0Divi Theme<\/li>\n
  2. Install and activate the plugin WP Cost Estimation & Payment Form<\/a>.\n<\/li>\n
  3. Download the\u00a0Web Agency Layout Pack\u00a0and Import the Web-Agency_All.json file to your Divi Theme Library.<\/li>\n
  4. Create new pages for each layout.<\/li>\n
  5. Create your primary menu.<\/li>\n<\/ol>\n

    If you are confused by the setup listed above, you can find more detailed instructions on how to setup your layout properly by checking out these\u00a010 steps for using a layout pack for your new project.<\/p>\n

    Once you have completed the steps above, you are ready to start.<\/p>\n

    Note:<\/strong> If you are only interested in the integration of the cost estimation form functionality and not so much the layout pack, you can still follow along with the tutorial and learn how to use the plugin to add a form to any website.<\/p>\n

    How to Add a Cost Estimation Form to Your Site Using the Web Agency Layout<\/h2>\n