Как да си направим калкулатор за уебсайт без програмист. Част 1: Конструктор на калкулатор

Съдържание:

Как да си направим калкулатор за уебсайт без програмист. Част 1: Конструктор на калкулатор
Как да си направим калкулатор за уебсайт без програмист. Част 1: Конструктор на калкулатор

Видео: Как да си направим калкулатор за уебсайт без програмист. Част 1: Конструктор на калкулатор

Видео: Как да си направим калкулатор за уебсайт без програмист. Част 1: Конструктор на калкулатор
Видео: Калькулятор для клининговой компании 2024, Ноември
Anonim

Обикновено създаването на приспособление за калкулатор за уебсайт изисква платен програмист и бюджет за техническа поддръжка. Наскоро обаче се появиха поне три опции за това как да спестите време и пари за създаване и поддържане на калкулатор: нека започнем с най-простия и най-достъпен - безплатен конструктор на калкулатори, който ще ви помогне да съберете визуално калкулатор - точно като попълването профил в социална мрежа.

Пример за калкулатор, създаден без познаване на технологиите и наемане на програмисти
Пример за калкулатор, създаден без познаване на технологиите и наемане на програмисти

Необходимо е

Лаптоп или компютър, всеки браузър, 10-30 минути време, пощенска кутия или акаунт в социална мрежа (Facebook, Vkontakte, Google+, UID), плюс разбиране какъв трябва да бъде вашият калкулатор

Инструкции

Етап 1

За да започнем сглобяването и в бъдеще да управляваме вашия калкулатор, ние се регистрираме в услугата uCalc.pro по пощата или в една от популярните социални мрежи.

След регистрацията по имейл ще получите имейл със съвет относно дизайна на калкулатора
След регистрацията по имейл ще получите имейл със съвет относно дизайна на калкулатора

Стъпка 2

След регистрацията ще бъдете отведени в личния си акаунт, където ще се съхраняват вашите калкулатори. Тук можете да изберете готов шаблон или да започнете да сглобявате калкулатора от нулата.

Като щракнете върху иконата
Като щракнете върху иконата

Стъпка 3

След като изберете в полза на шаблон или самостоятелно сглобяване, пред вас ще се отвори визуален редактор: чрез плъзгане на елементи - списък, плъзгач, отметка, отметка, полета за контакт или бутон - от колоната вляво можете сглоби калкулатор.

Елементите могат да бъдат поставени както един до друг (няколко в един ред), така и един под друг
Елементите могат да бъдат поставени както един до друг (няколко в един ред), така и един под друг

Стъпка 4

Задръжте курсора на мишката върху който и да е елемент и ще видите икони за настройки - в тях можете да зададете размери, да направите елемент задължителен, да зададете имената на полетата за списъка и да промените местата им. И като кликнете върху светлозелената рамка, която се появява около елемента, можете да го пренаредите над или под останалите части на калкулатора.

По желание можете да изтриете всеки елемент, като щракнете върху него и натиснете
По желание можете да изтриете всеки елемент, като щракнете върху него и натиснете

Стъпка 5

Можете да промените цвета и размера на етикетите, като просто подчертаете желаното парче текст. По-добре е да добавите обяснения към текстовете: ако говорим за ширина, добавете "метри" или "мм", за цени "рубли", "рубли на метър" и така нататък.

За да промените цвета на текста, щракнете върху сивия кръг и изберете цвят от палитрата
За да промените цвета на текста, щракнете върху сивия кръг и изберете цвят от палитрата

Стъпка 6

За да промените цвета на фона или цвета на плъзгача и отметката, използвайте иконите над калкулатора. Лявата икона отговаря за цвета на фона - по-добре е да го нарисувате в цветовете на страницата на вашия уебсайт. Средната икона е цветовете на елементите: можете да избирате от 10 готови схеми.

Можете също да промените стила на шрифта, като щракнете върху иконата вдясно - в момента са налични 4 опции
Можете също да промените стила на шрифта, като щракнете върху иконата вдясно - в момента са налични 4 опции

Стъпка 7

За по-голяма яснота можете да добавите снимки към калкулатора: изображение може да се добави както към заглавката, така и към всеки от елементите на калкулатора. За да направите това, изберете иконата "Картина" от левия панел, плъзнете я до желаното място и след това, като щракнете върху елемента, качете картината от вашия компютър.

За да направите калкулатора по-бърз на вашия сайт, използвайте снимки с минимални
За да направите калкулатора по-бърз на вашия сайт, използвайте снимки с минимални

Стъпка 8

За да посочите диапазон от цени за услуги и други цифрови параметри, превключете към раздела „Формула“. Ще видите диаграма на калкулатора, в която можете да въведете необходимите стойности.

Всяко число може да представлява както количеството, така и теглото или, например, разстоянието
Всяко число може да представлява както количеството, така и теглото или, например, разстоянието

Стъпка 9

На всеки елемент от калкулатора на диаграмата се присвоява буква. Като замествате букви в полето за формули вляво и добавяте математически знаци, можете да създадете една или повече формули: например, ако трябва да дадете цена със или без отстъпка, направете две формули, като добавите умножение с число, по-малко от 1 във втория (например 0.8 ще означава отстъпка от 20% и т.н.).

Втората или третата формула могат да бъдат зададени, ако искате да покажете отделно цената за материала и за работата и т.н
Втората или третата формула могат да бъдат зададени, ако искате да покажете отделно цената за материала и за работата и т.н

Стъпка 10

Ако искате да получавате заявки на клиенти по пощата или SMS, върнете се в раздела "Дизайн", кликнете върху бутона на вашия калкулатор. Можете да посочите в настройките. Там ще намерите и настройките за плащане - ако искате да приемете предплащане чрез Yandex. Chackout.

Тук можете също да зададете външния вид на бутона (овал, квадрат и т.н.) и допълнителния цвят на бутона, когато задържите мишката върху него
Тук можете също да зададете външния вид на бутона (овал, квадрат и т.н.) и допълнителния цвят на бутона, когато задържите мишката върху него

Стъпка 11

За да изпратите на клиента резултата от изчислението или друга информация (промоционален код, връзка, съобщение „Поръчката е приета“), щракнете върху „Уведоми клиента“в настройките на бутона и попълнете шаблона за писмо. За да съберете контакти с клиенти, добавете елемента „поле“към калкулатора и посочете „имейл“, „телефонен номер“и така нататък в настройките.

Всички лични данни на клиенти се предават чрез SLL - с други думи, никой не може да ги прихване
Всички лични данни на клиенти се предават чрез SLL - с други думи, никой не може да ги прихване

Стъпка 12

И така, калкулаторът е готов. За да го поставите на сайта, щракнете върху бутона „Запазване“в десния ъгъл - и пред вас ще се появи прозорец с готов код на джаджа. Копирайте кода и го поставете в нова или съществуваща страница на сайта.

Кодът на вашия калкулатор не може да бъде копиран от вашия сайт и поставен на чужд
Кодът на вашия калкулатор не може да бъде копиран от вашия сайт и поставен на чужд

Стъпка 13

Ако не сте уверени в способностите си, използвайте готовите инструкции за добавяне на калкулатор. Уебсайтът на uCalc е илюстрирал съвети за инсталиране на калкулатор на CMS Wordpress, Joomla, Drupal, NetCat, строителите на сайтове uKit, uCoz, Tilda и Wix и други добре познати платформи. Ако не сте намерили вашата платформа в списъка, отворете всяко описание и следвайте аналогията.

Инструкциите са в раздела с често задавани въпроси
Инструкциите са в раздела с често задавани въпроси

Стъпка 14

Ако решите да промените нещо, след като го инсталирате на сайта (дизайн, цени, брой елементи и т.н.), калкулаторът, който сте създали, може да бъде редактиран в конструктора и запазен. Направените промени ще бъдат автоматично показани на сайта.

Препоръчано: