ShahCalc – Visual Calculator Builder Wordpress Plugin - Rating, Reviews, Demo & Download
Plugin Description
ShahCalc lets you build interactive calculators (loan and mortgage payments, ROI, pricing quotes, fitness and health figures and more) without writing code. Define the inputs, assemble a formula visually, style the result, and embed it with a shortcode, a Gutenberg block or an Elementor widget.
How it works
- Visual builder. Add number fields, sliders, dropdowns and checkboxes. Build the formula by clicking fields and operators, or type it. The builder validates the formula as you go and shows a live preview at desktop, tablet and mobile widths.
- Safe formula engine. Formulas are parsed into an abstract syntax tree and evaluated by walking that tree. Formula text is never executed as code: there is no
eval()and nonew Function(), on the server or in the browser. Supported:+ - * / ^, parentheses, numbers and field IDs. - Vanilla JavaScript. No jQuery and no charting library. Results update as visitors type, with an animated count-up and a small SVG chart.
- Style isolation. Each calculator renders inside a Shadow DOM, so theme CSS does not restyle it and its CSS does not leak into your theme. Colors, borders, radius, typography and spacing are configured through a fixed set of CSS custom properties.
- Gutenberg block. Search for “ShahCalc” in the block inserter.
- Elementor widget. Pick a calculator and style it from the Elementor Style tab. Elementor is optional.
- Shareable results. Visitors’ inputs are reflected in the page URL (query string) so a specific result can be bookmarked or shared.
- Loads only where needed. The front-end scripts are enqueued only on pages that actually display a calculator.
Who can manage calculators? Administrators only (the manage_options capability). Published calculators are visible to all visitors; drafts are visible only to people who can edit them.
Usage
- Go to ShahCalc in the admin menu and click Create New (you can start from a template).
- Add fields, build the formula, style the calculator and click Save Calculator.
- Embed it with
[shahcalc id="123"], the ShahCalc block, or the ShahCalc Elementor widget.
Shortcode attributes: id (required), show_title (true or false, overrides the calculator’s own setting).
Privacy
ShahCalc does not set cookies, does not store visitor data, and does not contact any external service. The shareable-URL feature writes the values a visitor types into their own browser’s address bar. If your analytics or server logs record full page URLs, those values will be recorded too.
Source code
The complete, human-readable source, including the unminified React (JSX) sources for the compiled files in the build/ directory, is public on GitHub: https://github.com/Junaidshah1234/shahcalc
To rebuild the compiled files: clone the repository, run npm ci, then npm run build. The build uses @wordpress/scripts; the entry points are src/builder.jsx, src/dashboard.jsx and src/block.jsx. The scripts in public/js/ are not compiled and are shipped as written.
Screenshots
The full-screen visual builder: fields, formula builder, live responsive preview.
The ShahCalc dashboard with each calculator’s shortcode.
A calculator on the front end.
The Elementor widget with the Style tab controls.
