About this plugin
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 no new 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
com/Junaidshah1234/shahcalc
To rebuild the compiled files: clone the repository, run npm ci, then npm run build. jsx. The scripts in public/js/ are not compiled and are shipped as written.