How to make the calculator for the website without programmer. Part 1: designer of calculators

How to make the calculator for the website without programmer. Part 1: designer of calculators

As a rule, creation of a widget of the calculator for the website requires a remunerative work of the programmer and the budget on technical support. However at least three options appeared recently how to save time and money on creation and support of the calculator: let's begin with the simplest and available - the free designer of calculators who will help to assemble the calculator in the visual mode - as when filling a profile in social network.

It is required to you

  • The laptop or the computer, any browser, 10-30 minutes of time, mailbox or the account in social network (Facebook, VKontakte, Google+, UID), plus understanding what should be your calculator.


1. To begin assembly and further to manage the calculator, we are registered on service through mail or one of popular social networks.

2. After registration you get to a personal account where your calculators will be stored. Here you can select a ready template, or start assembly of the calculator from scratch.

3. After the choice for a template or independent assembly, before you the visual editor will open: dragging elements - the list, the slider, a tick, a checkbox, fields of contacts or the button - from a column at the left, you can assemble the calculator.

4. Guide a mouse at any element and you will see setup icons - in them it is possible to set the sizes, to make an element mandatory, to set names of fields for the list and to interchange the position of them. And having clicked a light green frame which will appear around an element, you can rearrange it above or below other details of the calculator.

5. You can change color and the size of inscriptions, having just selected the necessary text fragment. It is better to add an explanation to texts: if the speech about width, add ""meters"" or ""mm"", about the prices of ""rub"", ""rub for meter"" and so on.

6. To change background color or to change color of the toddler and a tick use icons over the calculator. The left icon is responsible for color of a substrate - better to paint over it in colors of the page of your website. The average icon is colors of elements: you can select from 10 ready schemes.

7. For descriptive reasons you can add to the picture calculator: the image can be added both to a cap, and to any of calculator elements. For this purpose select the Picture icon from the left panel, drag it to the right place, and then, having clicked on an element, load the picture from the computer.

8. To specify the range of prices for services and any other numerical parameters, switch in the Formula tab. You will see the scheme of the calculator in which it is possible to enter values necessary to you.

9. The letter is assigned to each element of the calculator on the scheme. Substituting letters in a formula window at the left and adding mathematical characters, you will be able to create one or several formulas: for example, if it is necessary to give discount price or without, make two formulas, having added to the second multiplication by number less than 1 (for example, will mean 0.8 a discount in 20% and so on).

10. If you want to receive applications of clients for mail or by SMS, return to the Design tab, press the button of your calculator. It is possible to specify in settings. In the same place you will find payment setup - if you want to accept prepayment via ""Yandex.Cash"".

11. To send to the client result of calculation or other information (the promo code, the link, the message ""The order is taken""), click ""Notify the client"" in settings of the button and fill a letter template. To collect contacts of clients, add the field element to the calculator and specify ""email"", ""phone"" in settings and so on.

12. So, the calculator is ready. To put it on the website, click ""Save"" in the right corner - and you will see a window with the ready code of a widget. Copy the code and insert on the new or existing page of the website.

13. If are not sure of the forces - use ready instructions for adding of the calculator. On the website uCalc there are illustrated councils for installation of the calculator on CMS Wordpress, Joomla, Drupal, NetCat, designers of the websites uKit, uCoz, Tilda and Wix and other known platforms. If you did not find the platform in the list - open any description and act by analogy.

14. If you decide to change something after installation for the website (design, the prices, quantity of elements, etc.) created by you the calculator it is possible to edit in the designer - and to peresokhranit it. The made changes automatically will be displayed on the website.

Author: «MirrorInfo» Dream Team