Comment Faire Une Calculatrice Pour Un Site Web Sans Programmeur. Partie 1 : Générateur De Calculatrice

Table des matières:

Comment Faire Une Calculatrice Pour Un Site Web Sans Programmeur. Partie 1 : Générateur De Calculatrice
Comment Faire Une Calculatrice Pour Un Site Web Sans Programmeur. Partie 1 : Générateur De Calculatrice

Vidéo: Comment Faire Une Calculatrice Pour Un Site Web Sans Programmeur. Partie 1 : Générateur De Calculatrice

Vidéo: Comment Faire Une Calculatrice Pour Un Site Web Sans Programmeur. Partie 1 : Générateur De Calculatrice
Vidéo: Build A Calculator With JavaScript Tutorial 2024, Avril
Anonim

En règle générale, la création d'un widget de calculatrice pour un site Web nécessite un programmeur rémunéré et un budget de support technique. Récemment, cependant, au moins trois options sont apparues sur la façon d'économiser du temps et de l'argent sur la création et la maintenance d'une calculatrice: commençons par la plus simple et la plus abordable - un constructeur de calculatrice gratuit qui vous aidera à assembler visuellement une calculatrice - tout comme remplir un profil sur un réseau social.

Un exemple de calculatrice créée sans connaissance de la technologie et sans embauche de programmeurs
Un exemple de calculatrice créée sans connaissance de la technologie et sans embauche de programmeurs

Il est nécessaire

Ordinateur portable ou ordinateur, n'importe quel navigateur, 10 à 30 minutes de temps, boîte aux lettres ou compte de réseau social (Facebook, Vkontakte, Google+, UID), ainsi qu'une compréhension de ce à quoi devrait ressembler votre calculatrice

Instructions

Étape 1

Pour commencer à assembler et à l'avenir pour gérer votre calculatrice, nous nous inscrivons sur le service uCalc.pro par courrier ou sur l'un des réseaux sociaux populaires.

Après l'inscription, vous recevrez un e-mail avec des conseils sur la conception de la calculatrice par courrier
Après l'inscription, vous recevrez un e-mail avec des conseils sur la conception de la calculatrice par courrier

Étape 2

Après l'enregistrement, vous serez redirigé vers votre compte personnel, où vos calculatrices seront stockées. Ici, vous pouvez choisir un modèle prêt à l'emploi ou commencer à assembler la calculatrice à partir de zéro.

En cliquant sur l'icône
En cliquant sur l'icône

Étape 3

Après avoir choisi un modèle ou un auto-assemblage, un éditeur visuel s'ouvrira devant vous: en faisant glisser des éléments - une liste, un curseur, une coche, une case à cocher, des champs de contact ou un bouton - depuis la colonne de gauche, vous pouvez assembler une calculatrice.

Les éléments peuvent être placés soit côte à côte (plusieurs à la suite) soit les uns sous les autres
Les éléments peuvent être placés soit côte à côte (plusieurs à la suite) soit les uns sous les autres

Étape 4

Survolez n'importe quel élément avec la souris et vous verrez des icônes de paramètres - vous pouvez y définir des tailles, rendre un élément obligatoire, définir les noms des champs de la liste et modifier leur emplacement. Et en cliquant sur le cadre vert clair qui apparaît autour de l'élément, vous pouvez le réorganiser au-dessus ou en dessous du reste des pièces de la calculatrice.

En option, vous pouvez supprimer n'importe quel élément en cliquant dessus et en appuyant sur
En option, vous pouvez supprimer n'importe quel élément en cliquant dessus et en appuyant sur

Étape 5

Vous pouvez modifier la couleur et la taille des étiquettes en mettant simplement en surbrillance le morceau de texte souhaité. Il est préférable d'ajouter des explications aux textes: si nous parlons de largeur, ajoutez des "mètres" ou "mm", des prix "roubles", "roubles par mètre" et ainsi de suite.

Pour changer la couleur du texte, cliquez sur le cercle gris et sélectionnez une couleur dans la palette
Pour changer la couleur du texte, cliquez sur le cercle gris et sélectionnez une couleur dans la palette

Étape 6

Pour changer la couleur d'arrière-plan ou changer la couleur du curseur et de la coche, utilisez les icônes au-dessus de la calculatrice. L'icône de gauche est responsable de la couleur d'arrière-plan - il est préférable de la peindre aux couleurs de la page de votre site Web. L'icône du milieu représente les couleurs des éléments: vous pouvez choisir parmi 10 schémas prêts à l'emploi.

Vous pouvez également changer le style de police en cliquant sur l'icône de droite - il y a actuellement 4 options disponibles
Vous pouvez également changer le style de police en cliquant sur l'icône de droite - il y a actuellement 4 options disponibles

Étape 7

Pour plus de clarté, vous pouvez ajouter des images à la calculatrice: une image peut être ajoutée à la fois à l'en-tête et à n'importe quel élément de la calculatrice. Pour ce faire, sélectionnez l'icône "Image" dans le panneau de gauche, faites-la glisser à l'emplacement souhaité, puis, en cliquant sur l'élément, téléchargez l'image depuis votre ordinateur.

Pour accélérer le chargement de la calculatrice sur votre site, utilisez des images avec un minimum de
Pour accélérer le chargement de la calculatrice sur votre site, utilisez des images avec un minimum de

Étape 8

Pour spécifier une fourchette de prix pour les services et tout autre paramètre numérique, passez à l'onglet "Formule". Vous verrez un diagramme de calculatrice dans lequel vous pouvez entrer les valeurs dont vous avez besoin.

N'importe quel nombre peut représenter à la fois la quantité et le poids ou, par exemple, la distance
N'importe quel nombre peut représenter à la fois la quantité et le poids ou, par exemple, la distance

Étape 9

Chaque élément de la calculatrice sur le schéma se voit attribuer une lettre. En substituant des lettres dans la case formule à gauche et en ajoutant des signes mathématiques, vous pouvez créer une ou plusieurs formules: par exemple, si vous devez donner un prix avec ou sans remise, faites deux formules en additionnant la multiplication par un nombre inférieur à 1 dans la seconde (par exemple, 0,8 signifiera une remise de 20 % et ainsi de suite).

La deuxième ou la troisième formule peut être définie si vous souhaitez afficher séparément le prix du matériel et du travail, et ainsi de suite
La deuxième ou la troisième formule peut être définie si vous souhaitez afficher séparément le prix du matériel et du travail, et ainsi de suite

Étape 10

Si vous souhaitez recevoir les demandes des clients par mail ou SMS, retournez dans l'onglet "Design", cliquez sur le bouton de votre calculateur. Vous pouvez spécifier dans les paramètres. Vous y trouverez également les paramètres de paiement - si vous souhaitez accepter le prépaiement via Yandex. Checkout.

Ici, vous pouvez également définir l'apparence du bouton (ovale, carré, etc.) et la couleur supplémentaire du bouton lorsque vous passez la souris dessus
Ici, vous pouvez également définir l'apparence du bouton (ovale, carré, etc.) et la couleur supplémentaire du bouton lorsque vous passez la souris dessus

Étape 11

Pour envoyer au client le résultat du calcul ou d'autres informations (code promo, lien, message « Commande acceptée »), cliquez sur « Notifier le client » dans les paramètres du bouton et remplissez le modèle de lettre. Pour collecter les contacts clients, ajoutez l'élément "champ" à la calculatrice et spécifiez "e-mail", "numéro de téléphone" et ainsi de suite dans les paramètres.

Toutes les données personnelles des clients sont transmises via SLL - en d'autres termes, personne ne peut les intercepter
Toutes les données personnelles des clients sont transmises via SLL - en d'autres termes, personne ne peut les intercepter

Étape 12

La calculatrice est donc prête. Pour le mettre sur le site, cliquez sur le bouton "Enregistrer" dans le coin droit - et une fenêtre avec un code de widget prêt à l'emploi apparaîtra devant vous. Copiez le code et collez-le dans une page nouvelle ou existante sur le site.

Le code de votre calculatrice ne peut pas être copié depuis votre site et collé sur celui de quelqu'un d'autre
Le code de votre calculatrice ne peut pas être copié depuis votre site et collé sur celui de quelqu'un d'autre

Étape 13

Si vous n'êtes pas sûr de vos capacités, utilisez les instructions toutes faites pour ajouter une calculatrice. Le site Web uCalc a illustré des conseils pour installer une calculatrice sur CMS Wordpress, Joomla, Drupal, NetCat, les constructeurs de sites uKit, uCoz, Tilda et Wix et d'autres plateformes bien connues. Si vous n'avez pas trouvé votre plate-forme dans la liste, ouvrez n'importe quelle description et suivez l'analogie.

Les instructions sont dans la section FAQ
Les instructions sont dans la section FAQ

Étape 14

Si vous décidez de changer quoi que ce soit après l'avoir installé sur le site (conception, prix, nombre d'éléments, etc.), la calculatrice que vous avez créée peut être éditée dans le constructeur et enregistrée. Les modifications apportées seront automatiquement affichées sur le site.

Conseillé: