New for 2020: Added support for over 90 additional currencies including Japanese Yen (¥12,345,679), Indian Rupee/Lakh/Crore (₹1,23,45,678.99) & Swiss Franc (CHF12’345’678.99). Click on "More" above.

Updated February 2020 v1.4.0

  Original Size  
Use these shortcodes in the page's content editor for above result:
[fcsavingsplugin sc_size="medium" sc_custom_style="No" sc_add_link="Yes" sc_brand_name="Optionally Include Your Blog's Name" sc_hide_resize="No" sc_save_amt="1200.0" sc_n_months="240" sc_rate="5.5"]

This plugin is also available for download at

This plugin answers the question, "What will be the final value of my savings assuming I make regular deposits for X months?". It creates a savings schedule and annual and cumulative charts. Your site visitors can select their own currency and date convention which is ideal if the host site attracts visitors from around the globe. The website or blog owner can select from four predefined sizes or modify a CSS file to customize both size and colors. The calculator is based on and uses the code from the very popular Savings Calculator.

While not an obvious use for this calculator, but nonetheless a good one, for those who blog about parenting you can put this calculator on your site and suggest that parents use the calculator to teach their children about saving which also has a side benefit of being a nice, short, indoor, parent and child activity for some cold or rainy Sunday afternoon.

Rebranding with your site's brand name is supported and encouraged.

The plugin may be

  1. used in a post or page's content area via a shortcode; or
  2. used in a sidebar widget area; or
  3. called from any template file.


  1. Either
    1. upload the fc-savings-calculator folder with all its files to the /wp-content/plugins/; or
    2. unzip the plugin's zip file in the /wp-content/plugins/  folder.
  2. Activate the plugin through the Plugins Installed Plugins menu in WordPress


There are 3 mutually exclusive ways you can deploy the calculator to an individual page (though you can use all three methods on different pages within a site):

  1. Add the shortcode [fcsavingsplugin] in the content area of your page or post and configure shortcode parameters.
  2. Add the following code to your template where you want the calculator to appear.
    • <?php show_fcsavings_plugin(); ?>
  3. If you are using widgets, just add the plugin to the sidebar through the Appearance Widgets menu in WordPress. Be sure to click Save.

Shortcode parameters

  • sc_size= "tiny" | "small" | "medium" | "large"
  • sc_custom_style= "No" | "Yes"
  • sc_add_link= "Yes" | "No"
  • sc_brand_name=
  • sc_hide_resize= "No" | "Yes"
  • sc_save_amt=
  • sc_n_months=
  • sc_rate=
  • sc_currency=
  • sc_date_mask=

Shortcode Examples:


Copy and paste to page's or post's content area.

First example includes all options.

Optional array parameter passed to

This can be copied and pasted to a template part.

Valid values for options are the same as the shortcode above.

  1. If you want to add your brand to the calculator, the add link option must be set to "Yes".
  2. When branding, your brand name will be added before "Savings Calculator".
  3. If custom style is set to "Yes", the plugin will load fin-calc-widgets-custom.css located in the plugin's CSS folder. If you set the option to "Yes" without making any changes, the calculator will change to a horrendous red which indicates the custom css is being used.
  4. The plugin is built and tested on HTML5/CSS3 pages.
  5. max-width: large: 440px, medium: 340px, small: 290px, tiny: 150px
  6. New: Website developers can set a default currency sign and preferred date format by setting _currency and _date_mask respectively. Set one or both to an integer value. For the list of integers to support 90 plus currency symbols and 6 date format options, see the file currency_and_date_conventions.txt in the plugin's root folder. (example: India, Indian Rupee: ₹1,23,45,678.99 = 83)


savings calculator plugin
Two of the predefined screen sizes showing relative difference between "large" and "tiny".
printable savings schedule
Example schedule with detailed header.
savings results in charts
Creates three charts for visualization.

28 Comments on “Savings Calculator Plugin”

financial online calculator Join the conversation. Tell me what you think.
  • Diana Hoskins says:


    I really like your calculators. Easy to install and they look nice without any customizing. I am having one issue. When I try to view the ‘Schedule’ or ‘Charts’ I get a blank pop-up. At one point it did finally show, but it takes quite a while. Can you take a look at my page?

    (the site is just a test site so it’s not fully functional at all)


    • Thanks Diana. This is entirely my fault. The problem is, it is not currently possible to have 2 of my calculators on the same page. They clash. I’m going to add this limitation to the notes over the weekend. I also plan to reengineer them so more than one can be used on the same page. I don’t do that with my site, so when I first designed the calculators a few years ago I never considered that someday I would be distributing them.

      Sorry for the frustration? Can you have them on different pages for now? (Probably would be better for SEO.)

  • Hi,

    Thank you for this awesome calculator! I really love it.

    I would like to change names of the buttons, because I wan’t to translate them in to a different language. I tried it by changing the names in the files, but the buttons stopped working (names were changed, but nothing happened, when pressed buttons).

    Could you give me some further advice on how could I change the names properly or is there any short code I can use?



    • Glad you like it. There is more to translating the calculator than just the buttons. Have you found all the text? In the plugin’s folder, there is a subfolder ‘en’, you’ll find this file:


      In this file, you’ll find text similar to this, in 4 locations depending on the calculator’s size:

      <!–buttons small–>
      <div class=”btn-group”>
      <div class=”btn-row”>
      <div class=”btn-wrapper-4″><button type=”button” id=”btnCalc-rs” class=”btn btn-primary btn-calculator”>CalcClearPrintHelp

      Change only what is in bold/italics above and you should have no problems and the buttons should not break.

      What language are you translating to?

    • I just noticed the button ids look strange to me:


      If the buttons still do not work, try removing the “-rs”. So above maybe should be just id=”btnHelp”.

  • Max Gooding says:

    Hello Karl,

    This calculator is awesome. I just have 2 requests:

    [1] can a base amount be added to which the monthly amounts are added?

    [2] can a small fee be applied to the based amount as well as all of the deposits?



    • Hi Max, I like to try to accommodate requests. A lot of the functionality on this site is due to the requests I’ve had from users over the pass 30+ years since I wrote my first calculator.

      However, I think the features you are asking for may already be available, but not in one calculator. For example, the Ultimate Investment Calculator lets a user add a fee that is deducted from the investment return.

      And the Ultimate Financial Calculator allows the user to create as many cash flow series with amount steps in any amount.

      Perhaps these will help?

  • Hello there, would love to use your calculators on my new website, however being based in the UK I would rather the the currency and date formats would be defaulted to £ and DD/MM/YYYY rather than US style, how do I go about this?

    I’m ok with fiddling with code, not a true developer but I get by, just would like some pointers…I see that I likely need to fiddle with the interface.SAVINGS-WIDGET.min.js file,

    Also another thing my clients like to know is drawdown, do you have any wordpress widgets that show draw downs, like on the Hargreaves Landowne website?

    • You are correct. You’ll need to edit interface.SAVINGS-WIDGET.min.js in the plugin’s js folder.

      With a plain text editor, such as note pad open it up and search for this text:


      Should be around row 7. Change the “$” to pound sign. Save, and refresh the webpage


      This will change the plugin’s default for you

      The downside with this hack is, no one visiting the page will be able to set the currency to “$”. Or at least I don’t think they will be able to. I didn’t actually test that.

      Hope this works for you.

      I have to figure out the hack for changing the date. I’ll try to do that this weekend.

    • About the date format, I did answer the same question about the auto loan plugin. Here’s the answer copied from that plugin’s page. Perhaps this is close enough to what this plugin needs that these instructions will work for you. Please try them and let me know how you make out.

      About the date, it took me a while to figure out, but I think I have it. Are you ready for some surgery?

      Open the file interface.AUTOLOAN-WIDGET.min.js with a plain text editor. I guess you’ve found that one, it’s in the “js” folder. Find this text:


      It should be in row 12 if your text editor wraps the lines correctly. You will have to copy/paste this code to the above:


      Make sure you get everything from the beginning “b” to the ending semicolon.

      Enter it like this:

      a.LocalDateConventions=function(b){ b=a.DATE_FORMATS.MDY; b&&null!==b

      Save and then do a hard refresh of your web page. If you are using Windows, that’s done with a Ctrl-F5.

      • Thanks Karl,

        Seemingly just changing the MDY to DMY in that line 12 appears to do the trick. The currency hack also worked, though with the currency and date being hacked it does stop them being able to select dollars and US date format, but I don’t mind this.

        Thanks for your help and your great calculators…

        Just also now thinking about the possibility of a “Drawdown Calculator” Do you know what I mean by that?

        Say for example you have an investment fund of X, and you wanted to withdraw a certain amount each month from that fund to live on as your pension, how long would that fund last before its depleted including the benefit of a average interest rate applied to the fund…

        Do you have anything similar that I missed?

        • I think you do though its not a WordPress plug-in just a calculator on your site – the Savings Withdrawal Calculator –

          Would love this as a plug-in I could use on my site too!

          • Sorry, I had meant to come back and answer that question, but I was sidetracked.

            You’re right, not having a withdrawal calculator is a big gap in what I offer. I will consider adding one, but currently, I have 5 calculators in various phases of development and I need to finish those.

  • Understood, would happily pay for the development of such, whether by yourself or with the help of someone else, but would love it to fit in with your current suite of calculators as they look great. Is there any incentive we could offer you or would you be prepared to release your code of this form in its current state to me so I can have it developed elsewhere and resupplied back to you as a completed plugin? We would of course, supply you with the completed version back in its entirety and also have it developed in exactly the same way as your others, even with you being listed as creator and retaining the links back to your site etc etc….

  • Anubhav Kandpal says:

    It’s a very amazing creation……..
    i need to do certain changes
    1) I want to re name “calc” title to “calculate”
    2) i want to remove clear, help and print buttons

    • Thank you! Nice of you to say.

      The changes you want made are certainly doable. When the plugin is installed, all the programming code is in the plugin’s folder. Do you know how to program in HTML? The changes can be made in the php file. You’ll need to find the section that matches the size of calculator you are displaying.

  • Hi there, is it possible in any of the investment calculators to simply have the following fields? I though I d try and remove some but unsure if that would screw the calculations up?

    FIELD 1 – Growth Interest Rate (%)
    FIELD 2 – Investment Duration (Years)
    FIELD 3 – Regularly Monthly Investment (£)
    FIELD 4 – Initial Lump Sum Investment (£)
    FIELD 5 – Target Fund Value (if required) (£)

    Pretty much think these fields are in there somewhere except ‘FIELD5’ which is the total calculation – that amount?

    Thank you

    • You are right. Removing a field will break the plugin.

      All plugins come with full source code. If you know how to program (JavaScript), you can use this plugin as a starting point.

      There is one other option if you just want to remove a field, and you know CSS, you can use CSS to hide it. That will not break the calculator.

      • Thanks Karl, appreciated. Is there a mobile/ responsive version anywhere, tried the investment example on my android phone, all columns are too small to read and entry fields don’t allow input. Date fields and selects are fine though?

        • hi Gary, I’mm surprised to hear that. Can you check this savings calculator o your Android? If you don’t, then there might be something in your style sheet or layout that causing a problem. Please give a a link if you can to the page and I’ll take a look.

          • Hi Karl, it was your demo site I was looking at as not installed on my WP just yet, I’m not an expert on javascript calculations so didnt install until sure I could manage it!

            That said I checked the link you said and that loaded and allowed me after about 20 seconds to type values into text boxes. However the investments calculator (the one I need), isnt readable at all and wont allow text input, using Galaxy 8 or Iphone 7.

            I have screenshots but cant upload via this channel..

  • This is what I was hoping to achieve but not sure how to calculate the monthly investment as its doesnt appear on the demo one –

    • I’m just not seeing the same issues you are seeing. I just tried the calculator that I provided a link to on an iPhone X and it worked fine (it also loaded in about 3 seconds). I gather you are not in the US? The problem you see with the page loading probably has to do with the distance you are from the server.

      As to the features that you want, you would have to hire a programmer to make the changes if that’s not something you are comfortable doing.

  • No problem Karl, yes the link you sent me loads fine on Android, just takes a while to allow input. However the calc I was referring to that doesnt display correctly or allowe any input is –

    No problem just thought Id feedback.

Comments, suggestions & questions welcomed...

Leave a Reply to Karl Cancel reply

to plugin
to questions/comments