Documentation
Plugin Documentation
Give users clear setup instructions, feature references, and FAQ in one place.
= NodeLogic Graph Builder =
Contributors: nodelogicwp Tags: calculator, logic, no-code, graph, blocks Requires at least: 6.0 Tested up to: 7.0 Requires PHP: 7.4 Stable tag: 1.4.1 License: GPL-2.0-or-later License URI: https://www.gnu.org/licenses/gpl-2.0.html
Visual no-code graph editor for building dynamic page logic with Gutenberg blocks.
Description
NodeLogic Graph Builder lets you build dynamic logic for WordPress pages without writing code.
You create your setup directly in Gutenberg:
- Add input/output blocks from this plugin to your page.
- Add the NodeLogic Graph Builder Logic block.
- Open the graph editor and connect nodes to control values, conditions, styles, and behavior.
- Save and publish.
Key Features:
- Visual drag-and-drop node graph editor
- Gutenberg blocks for inputs/outputs and page logic
- Supports number, string, boolean, color, and basic CSS logic flows in the free version
- Logic Block for page-level runtime behavior
- Starter preset layouts for common calculator-style setups
- Additional advanced node packs (events, memory, advanced string/math helpers, templates, and custom nodes) are available in a separate Pro extension
- Works locally inside WordPress (no license endpoint required)
Node Types Included:
- Element blocks: Seekbar, Number Input, Text Input, Radio Group, Select, Checkbox, Label, Button Group
- Graph nodes (free): Calculation, Condition, Switch/If, Boolean Logic, Math helpers, core String Logic, Colors, CSS, Outputs
Source: https://github.com/nodelogicwp/nodelogic-graph-builder
Installation
- Upload the plugin files to `/wp-content/plugins/nodelogic-graph-builder/`
- Activate the plugin through the Plugins screen in WordPress
- Open any page/post in Gutenberg
- Add input/output blocks from NodeLogic Graph Builder
- Add the NodeLogic Graph Builder Logic block and open the graph editor
- Connect nodes, save, and publish
Frequently Asked Questions
Where do I start in the free version?
Open Gutenberg, add the plugin input/output blocks to your page, then add the NodeLogic Graph Builder Logic block. Build your graph there and publish.
Does this plugin make external HTTP requests?
No. This plugin works locally in WordPress and does not require a license activation endpoint.
Are there starter presets?
Yes. The free version includes starter preset layouts built from the plugin's own blocks so you can begin with a ready-made calculator layout and then adjust it to fit your page.
Where can I find optional Pro plans?
Optional Pro plan details are available at https://nodelogicwp.com.
Where is the JavaScript source code?
The source is included in the `src/` directory. Build artifacts are in `build/`.
What browsers are supported?
All modern browsers (Chrome, Firefox, Safari, Edge). The graph editor is optimized for desktop editing.
Changelog
1.4.1 * Improved calculation flow visualization with clearer numbered markers and curved input mapping arrows * Added dynamic input-gap validation with node error highlighting and save blocking for invalid graphs * Fixed sidebar icon/text rendering issues and general graph editor UI polish
1.4.0 * Renamed plugin to NodeLogic Graph Builder * Updated slug/text domain and main plugin file naming * Updated WordPress.org free build content and naming consistency * Added/kept readable source files in `src/` and documented source location
Upgrade Notice
1.4.1 This release improves graph editor flow clarity and adds stronger validation for dynamic input chains.
Getting Started
Install the plugin, open Gutenberg, and insert NodeLogic blocks. Then add the Logic block to connect your workflow.
Installation
Upload plugin files to /wp-content/plugins/, activate plugin, add blocks on a page, and publish.
Need Help?
If you need support, contact support@nodelogicwp.com.
Nodes Reference
Math
Add
Adds multiple numeric inputs and returns numeric output.
How to Create First Graph
Start with Element Nodes or constants, process logic in hidden nodes, and push result to output node.
Problems and Solutions
Result is empty
Example: Output is not connected
Solution: Connect final node result to Output Node.