Tips, Tricks, and Techniques

The Basics: Embedding a Calculator

Instructional picture
1. Click the orange "Customize" button to access customization options.
Instructional picture
2. Customize your calculator and either checkout or go back to the "Basic" button.
Instructional picture
3. Copy and paste the HTML code into your website and you're done!
a calculator for every site's theme
Instructional picture

Answer Overrides: Modifying the Calculator's Answer

Instructional gif
1. Open the "Advanced" section and select the Answer Text.

2. Modify the text to change the calculator answer. Some things to remember:
  • {0}, {1} etc. are placeholders for answer values.
  • You can remove any placeholder you don't want in your answer.
  • You can include a placeholder more than once.
  • You can insert HTML into the answer (very powerful)!
Answer text override gif

Flexibility: Repurposing a Calculator to Fit Your Needs

Let's say you sell some product that will save your customers money in the long run. You want a basic calculator to show your customers how quickly they can expect to recover the initial cost.
Repurpose calc
1. Pick a calculator that does something similar to what you need.
Instructional gif
2. Change the fields to morph the calculator into what you need.

After a little persistance and a few more tweaks, you have a new calc!
Finish repurpose

Languages: Translating Your Calculator

Automatic translation using Google Translate is pretty simple--just pick your language.
If the ambiguity of automatic translation is not for you--full manual translation is available using the "Customize Text" option.

Branding: Including a Logo

Logo Start Pic
1. Pick a calculator--with a little knowledge of HTML and CSS you can easily add a logo.
Logo select Pic
2. Pick the title or input to add an HTML IMG tag to.
<img src="http://IMAGE_URL" width="50" height="50" style="position: absolute !important; bottom: 11px !important; left: 15px !important;"></img>
3. Add an IMG tag with the source of your image and whatever CSS you'd like to format it.

Some things to remember
  • Appending to the title will be visible for both the "front" and "back" of the calc.
  • Appending to the inputs will only be visible for the "front" of the calc.
  • Use !important for any CSS attributes--it will work better once embedded.
  • There are lots of possibilites! Embed all shapes and sizes of graphics in any part of the calculator.

Logo gif
4. Use your calculator!

Questions & Answers

Q: How do I include a calculator on my site?
A: Click the orange "Get Started" button to bring up customization options. Paste the code into your site, and voilá, you have a calculator!
Q: Can I put a calculator on my site for free?
A: Yes! But only the basic, uncustomized version. We offer lots of cool features to users willing to help support our site!
Q: What do your customization options offer?
A: We set out to give users the ability to use our calculators in as many ways, shapes, and forms as possible. This means you can change calculator width, colors, font sizes, text shadows and even the text itself. You can use our text override system to translate your calculator yourself or just have Google Translate do it all for you automatically! Our input-modification system is powerful and even lets you add HTML elements to your calc. Check out our Tips, Tricks, and Techniques to see some of the cool stuff you can do.
Q: How many times can I include a calculator on a site?
A: You can customize and include your calculator as many times as you would like on a single domain.
Q: I don't see a calculator that I want to use.
A: If you need a very specific calculator for you site, we can make it for you under our "Custom Calculator" category. Take a look at the process and send us a request! If you feel we've left out a basic calculator that everyone should have--send us a note and we'll do our best to add it.
Q: Security is a priority for my website--do you support HTTPS?
A: Yes! Our Enterprise Package will enable both loading and calculation in SSL.
Q: How does your calculator work?
A: This is a good questions for webmasters to ask before they include something on their sites. The calculator code you paste into your site contains a bit of HTML with a script tag. Our javascript file will load each time your web page is loaded, and it will inject the rest of the calculator HTML into your page. The script also loads two CSS files to make sure the calc looks good on your site. Whenever a user clicks "Calculate" a request is fired off to our server where our server will compute the answer send it back to the calculator--all in just a fraction of a second!
Q: I would like to purchase your calculators in bulk.
A: Yes, you can do this! Contact us for additional pricing.
Q: How do I use lead generation?
A: First click on My Account at the top right of the page and scroll down to the calculator you wish to use for lead generation. Then click on the "Settings" option next to the calculator name. From there you can add the email address that you want your leads sent to and select the information fields you want use!