Plugins
Templates
Blocks
Template Setup Guides

Estimly - Flexible Estimator Template

Template page link: https://zeroqode.com/template/estimly---flexible-estimator-template-1565795534286x820239592273212000

Introduction

Estimly - is a template that allows to create estimation questionnaires or various kind of forms. While building questionnaire templates you can map a certain cost to each possible option in each question as well as build a custom design. Once you create the Estimation template you'll get a link that you can share with your users so they could estimate how much a certain service or product would cost them. This for example can be used for web . development agencies so that their users could estimate costs of building a website, or let's say a consulting company and for many other use cases:

Features

  • Fully responsive pages and user dashboard

  • Fully responsive Admin Dashboard for overall management

  • Flexible Estimate questionnaire and forms builder

  • Stripe subscription functionality

  • Design tab for all questionnaire builders

  • Standard Email Estimate Summaries

Data Structure

User

Users are the Estimate Questionnaire builders who use the platform to create Questionnaire templates. This also stores the Super Admins information. They store the usual profile info (Photo, Name, EmailAddress, Username), logintimestamp to store when last the user logged in, subscribed to store whether or not the user is a subscribed user, questionnaires object to show the list of questionnaires the user has or has built and the admin field to show whether or not the user is an admin.

Questionnaire

Questionnaire contains all the information about an Estimate Questionnaire Template. Title is the Estimate Template name, id is the 1st path to your questionnaire link. For example, hdiw3 might be the users id (1st path); the link to the questionnaire template will then be estimly.bubbleapps.io/form/hdiw3. Description is the description to the questionnaire template. Questions object is the list of questions in the questionnaire template. Responses object is the list of responses received from the questionnaire template. ProgressBar is a status to show whether or not progress should be shown when end users are answering questions to derive their estimates. RedirectLink and RedirectLinkStatus show whether or not a redirect link should be shown at the end of the estimate questionnaire. Theme object is the design information for the questionnaire template. CustomMessage1 and CustomMessage2 store the messages you wish for the user to see at the end of the template. Admin shows whether that particular template was created by an admin.

Subscribers

This stores the email of all customers who wish to subscribe to receive more information about Estimly.

Theme

This stores information about the design of each questionnaire. Name is what the design is called. Font is the font type of the text on the questionnaire. ButtonColor is the color of the buttons and links on the estimate page. QuestionColor and AnswerColor are the font colors of the questions and answers respectively. BackgroundBrightness determines the contrast of the BackgroundColor of BackgroundImage of the design. Status determines whether the design is a public design or private design.

Question

This stores all the questions that are later sorted into various questionnaires. The type specifies whether the question is a single option, multiple option or shorttext answer. The title is the question. The serial specifies the order in which the question will appear on the form page. Description is a brief description of the question. Questionnaire object states which questionnaire the question belongs to. AvailableOptions objects stores the list of options in associated with the question.

Option

This stores all options that are later sorted into various questionnaires. The title is the option name, description is a brief explanation of the option. Startprice and Endprice are the ranges for the estimate. When the end user selects the option, these fields will be added to the estimate fee.

Answers

This stores all the answers from the end user. The question and the selectedoption. If the question type was a shorttext, the shorttext field stores it.

Response

This stores the estimate summary of the end user. The answers which consist of the question and selectedoption and the totalcoststart and totalcostend.

Pages

Index

This is the main landing page of the template and contains basic information for new users to learn more about the Estimate platform. It has a header, hero, how it works section, free product templates available, pricing and the footer.

Login

This contains the login form and allows users (questionnaire builders and admins) to login with their email and password. There is also a demo login.

Sign Up

This contains the sign up form and allows users (questionnaire builders and admins) to sign up to Estimly.

Home

This is the user dashboard for questionnaire builders to manage their questionnaire templates, build new templates, design templates, share the questionnaire link and also view responses on the questionnaire. The interconnected groups are navigated by means of a router.

There are three main groups:

Workspace

This contains the overview of the questionnaires available to the user or created by the user.

ProfileSettings

This contains sub groups to help handle profile, billing and settings of the current user. It also has a state to help navigate to the sub groups.

QuestionnaireMain

This group contains 3 main groups.

Create

This contains the questionnaire builder, the design tab of the questionnaire and settings for that particular questionnaire.

Share

This contains the link to the Estimate questionnaire and share buttons as well.

Responses

This contains all responses received for the questionnaire if any.

Form

This is the page the end user sees and answers the questions provided in the dashboard to get an estimate. The page has 3 main groups in the Group Quote.

Backdrop

This is the view the user sees when the page loads

Questionnaire/options

This contains the questions and options contained in the questionnaire being viewed by the end user

ThankYou

This contains the estimate summary of the end user and is shown when the questionnaire questions have been finished.

Element

State

Note

Form

current_question_serial

This stores the current serial number of the question displayed to the user

next_question_for answer

This stores the serial number of the next question to be displayed to the user

questionnaire

This stores the current questionnaire the end user wishes to see

response

This stores the response of the user.

Admin

This is the page for the Admin of the Estimly Application to handle User Management, Templates Management.

Specific References

Navigation between tab on the dashboard and form page is powered by the custom state current on the element Dashboard menu and conditional statements on the sub page groups that make them visible when true.

Admin

The admin page is currently open to all logged in (Demo Login) visitors but with read-only access (they can't perform any actions). To have full access the user must have their current user's admin field set to yes. There is also a workflow that redirects users back to login or dashboard page if they don't have admin access but that workflow is disabled. Be sure to un-check the disable workflow on purchase of this template.

Stripe Subscriptions

This template uses Stripe for Subscription payments powered by Stripe.js plugin.

Stripe Setup:

Go to stripe.com, create an account. You will be allowed to access your dashboard once you have successfully verified your email address and activated your account.

Retrieve 3 keys from the Stripe dashboard. They can be found on the Developers page or the Account(Settings) page. Those 3 keys are:

  1. Publishable Key (Starts with a 'pk' and is found in the developers page).

  2. Secret Key (Starts with an 'sk' and is found in the developers page)

  3. Client ID (Starts with a 'ca' and is found in the developers page)

Replace the copied API keys with the already existing API keys in the Stripe and Stripe.js plugin.

Ensure to use a live API key when your template goes live.

Random.org API

Once this template is purchased, you will need to set up your API key for the random string generator plugin.

Go to https://www.random.org/, create an account. You will be allowed to access once you have successfully verified your email address and activated your account.

Click on Your Account and then click on Account OverviewYou will see API Services. You click Create a new API Key to create a random string generator for your app.

Copy the API key and post it in the fields located below in the Plugins view.

Demo to preview the template