Visualizer - Settings Reference
Visualizer is a WordPress charts and tables plugin. Its screens live under the Visualizer menu in the WordPress admin sidebar: Chart Library, Add New Chart, Settings, and Support (plus a Setup Wizard entry on fresh free installs). Most configuration happens per chart inside the chart editor, which has a Source tab (data), a Settings tab (appearance and behavior), and a Help tab.
Feature gating: Pro marks controls that need the Pro add-on with a valid license. Some Pro features are further tier-gated: Pro (Plus plan) covers sync schedules, chart permissions, import from another chart, the chart data filter, frontend actions, and database import; Pro (Business) covers the WordPress import's sync schedules. In the free plugin, gated groups render locked with an "Upgrade to PRO to activate this feature!" overlay.
In this article
Chart Library screen
Visualizer > Chart Library lists all charts. Header buttons: Add New Chart, plus a split-button dropdown with AI Chart Builder and Classic Builder. With Pro active, a License Settings link points to the license field under Settings > General (options-general.php#visualizer_pro_license).
Filters
- Type (select) — "All types" plus the enabled chart types; unavailable types appear disabled under a "Not available" group.
- Library (select) — All libraries / ChartJS / DataTable / GoogleCharts.
- Date (select) — All dates / Yesterday / Last Week / Last Month / Last Year.
- Source (select) — All sources / JSON / Local CSV / Remote CSV; Database appears with Pro, WordPress with Pro (Business); otherwise they show disabled under "Not available".
- Title search (text, placeholder "Enter title").
- Order By (select) — Order By (none) / Date / Title, and Order (select) — Descending (default) / Ascending.
- Apply Filters and Clear Filters buttons.
View and pagination
- Grid View / List View icon toggle. Grid is the default; the choice is remembered per user.
- Screen Options > Number of charts per page (number) — default 10 is not used here; the default is 6.
- Pagination links appear below the grid.
Per-chart actions
Grid cards show, in order: Edit, Copy Shortcode (copies [visualizer id="N" class=""]), Download PNG (hidden for Gauge and Table charts), Export CSV, Duplicate, and Delete. The card footer shows the chart ID, the last-updated date, and a status icon (green check, or a red error icon you can click to view the error). List view shows columns ID / Title / Type / Shortcode / Actions, without Download PNG. With Pro, charts that have a data filter configured show their interactive filter controls above the preview.
Settings screen
Visualizer > Settings (administrators only) holds the plugin's global style settings. All three are free.
Primary Color
Color picker. The primary color applied to the first data series in new charts. Empty by default; when unset, Visualizer falls back to its built-in color palette. Together with the secondary color, it generates a full palette (including 25/50/75% tints) used for new charts' series defaults.
Secondary Color
Color picker. The color applied to the second data series in new charts. Empty by default.
Apply To Existing Charts
Checkbox: "Apply global colors to existing charts at render time (this will override chart colors on display)." Off by default. When enabled, the global palette overrides series colors on display everywhere a chart renders (front end, library, editor, Elementor, Gutenberg). Geo charts and charts with explicitly set colors are skipped.
The page has Save Settings and Clear Settings buttons; Clear removes all three values.
Support screen
Visualizer > Support has three tabs: Support (docs links and video), More Features (upsell, free only), and Help us improve! (survey link). One real setting lives on the Support tab:
Feature Usage
Checkbox: "Help us improve Visualizer by sending us anonymous usage data…" with a Save button. Off by default. Enables anonymous telemetry through the Themeisle SDK.
Setup Wizard
Shown as Visualizer > Setup Wizard only on fresh installs of the free plugin, and offered automatically after activation. Its choices are one-time onboarding, not persistent settings:
- Select a chart — radio cards for Pie/Donut chart (preselected), Bar chart, Line chart, Table; premium types show locked "PREMIUM" cards with an Upgrade to Pro button. Save And Continue creates a sample chart.
- Insert a chart into the draft page — Create a draft page checkbox (on by default) creates a draft "Visualizer Demo Page" with the chart; a shortcode box with click-to-copy.
- You're all set! — optional plugin-install checkboxes (Boost your website speed — Optimole, Build better pages — Otter Blocks, Cache your pages — Super Page Cache, all checked by default), a Stay in the loop newsletter checkbox with an email field, and Finish Setup.
Creating a chart: type and library
Visualizer > Add New Chart (or Add New Chart in the library) opens the type picker. The Select Library for charts dropdown chooses the rendering library; the type boxes then filter to types that library supports. Locked types show a "PREMIUM" ribbon with View Demo and Upgrade Now.
| Chart type | Libraries | Availability |
|---|---|---|
| Table | DataTable (free), Google Charts (Pro) | Free |
| Pie/Donut | Google Charts, ChartJS | Free |
| Line | Google Charts, ChartJS | Free |
| Bar | Google Charts (free), ChartJS (Pro) | Free |
| Column | Google Charts, ChartJS | Pro |
| Area, Geo, Bubble, Scatter | Google Charts | Pro |
| Gauge, Candlestick | Google Charts | Pro (existing free charts of these types keep working) |
| Timeline, Combo | Google Charts | Pro only |
| Polar Area, Radar/Spider | ChartJS | Pro only |
After picking a type, Next opens the chart editor.
Chart editor: toolbar and info panel
- Shortcode — read-only field with the chart's shortcode and a Copy button.
- Backend chart title for internal usage (text) — defaults to
#<ID>; used as the chart's name in the library list, the Elementor widget, and the AI builder. Saved with the chart settings. - Tabs: Source, Settings, Help (documentation and demo links only).
- Toolbar: Back (returns to the type picker), Save Chart (or Create Chart for a new chart, Insert Chart in the media-modal flow), and Cancel.
Chart editor: Source tab
Data sources for the chart. Manual Data is free; every import source is Pro-gated as noted.
Manual Data
- Use the … editor to manually edit the chart data (select) — Text or Simple; Pro adds Excel (a spreadsheet-like live editor) and makes it the default.
- Edit Data (button, toggles to Show Chart) — opens the chosen editor over the preview. The Text editor is a plain CSV textarea. The Simple editor is a table with editable headers, a per-column Data Type row (Exclude, or: string, number, boolean, date, datetime, timeofday), and editable values.
- Undo Changes (button) — reverts unsaved editor changes.
- Note shown in UI: "Please make sure you click 'Show Chart' before you save the chart."
Import data from file — Pro
Upload a CSV or XLSX file (Import button). The first row must contain column headings, the second row the series types (string, number, boolean, date, datetime, timeofday).
Import data from URL — Pro
Import from CSV / XLSX: a URL field ("Please enter the URL of a CSV or XLSX file"), a schedule select (free shows only One-time; Pro adds 10 minutes / Each hour / Each 12 hours / Each day / Each 3 days — sync schedules are Plus-plan), and Import & Save schedule.
Import from JSON: a schedule select ("How often do you want to check the URL", same frequencies), Create Parameters / Modify Parameters opening a four-step wizard:
- Specify the JSON endpoint/URL — URL field, Fetch Endpoint button, and a collapsible Headers form: Request Type (GET/POST), Credentials (Username/Access Key + Password/Secret Key) or Authorization header, and Additional headers.
- Choose the JSON root — root select plus Parse Endpoint.
- Specify miscellaneous parameters — pagination select ("Get results from the first page only", or from the first pages via a chosen key). This step is Pro-gated separately.
- Select the data to display in the chart — parsed table with per-column Exclude/type selects.
Save Schedule stores the JSON check frequency.
Import from other chart — Pro (Plus plan)
A chart select (lists existing charts by name or ID) and an Import Chart button.
Import from WordPress — Pro
1. Choose Data Source opens the filter wizard: Select post type, Select properties (multi-select), then a Field / Alias / Type mapping table. 2. Set Sync Schedule offers the refresh frequencies (Pro (Business)) and Save Schedule.
Import from WooCommerce Reports — Pro
Only visible when WooCommerce is active. Select report endpoint (Sales, Top Sellers, Coupons Totals, Customers Totals, Orders Totals, Products Totals, Reviews Totals), a check-frequency select, Create Parameters (opens the JSON wizard against the report endpoint), and Save Schedule.
Import from database — Pro (Plus plan)
1. Choose Data Source opens the SQL editor modal: a query textarea (CodeMirror, with your database prefix shown and Shift+Space autocomplete), Show Results to preview, and — Pro — a Select another/external database form (database type, Server Name/IP, Database Name, Username, Password, Test Connection). 2. Set Sync Schedule offers refresh frequencies and Save Schedule.
Chart editor: Settings tab — Google Charts
The sidebar renders collapsible groups. For a typical axis chart the order is: General Settings → Horizontal Axis Settings → Vertical Axis Settings → (type-specific group) → Series Settings → Chart Size & Placement → Chart Data Filter Configuration → Frontend Actions → Manual Configuration → Permissions. Non-axis types (Pie, Geo, Gauge, Table, Timeline) omit the axis and series groups as noted under their type.
General Settings
- Title: Chart Title (text, "Text to display above the chart"), Chart Title Position (Inside the chart / Outside the chart / None; axis charts only), Chart Title Color (default
#000), Axes Titles Position (axis charts only), Chart Description (textarea; used in the structured-data schema). - Font Styles: Font Family And Size — font family (Arial, Sans Serif, Serif, Wide, Narrow, Comic Sans MS, Courier New, Garamond, Georgia, Tahoma, Verdana) and size (7–20) for all chart text.
- Legend: Position (Default / Left of the chart / Right of the chart / Above the chart / Below the chart / Omit the legend; "Inside the chart" available except on Pie; "Left of the chart" unavailable on Bubble), Alignment (start / center / end of the allocated area), Font Color (default
#000). - Tooltip: Trigger (Default / on hover / on selection / not displayed), Show Color Code (Yes/No). Pie adds Text (value and percentage / value / percentage).
- Animation (not on Pie, Gauge, Geo, Table, Timeline): Animate on startup (checkbox), Duration (ms, default 0), Easing (Constant speed / Start slow and speed up / Start fast and slow down / Start slow, speed up, then slow down).
- License & Creator: License and Creator (text) — feed the schema.org structured data. The schema (including License) is only emitted when Creator is filled in.
- Save chart as an image inside Media Library: Save inside media library? (checkbox; on by default when AMP is active).
- Lazy rendering of chart: Enable lazy rendering of chart? (checkbox; on by default for new charts).
- Zoom/Pan — Pro. Injected for Google axis charts (not Candlestick, Gauge, Geo, Pie, Table, Timeline): Enable zoom/pan plus Drag to Zoom, Drag to Pan, Right click to reset checkboxes.
Horizontal Axis Settings and Vertical Axis Settings
Axis charts only. Each axis group contains:
- General Settings: Axis Title, Slanted Text (False/True), Slanted Text Angle (default 45), Text Position (Inside the chart / Outside the chart / None), Direction (Default / Reverse), Base Line Color (default
#000) and Axis Text Color (default#000), Number Format (ICU pattern; shown on the horizontal group for most types, on the vertical group for Column charts).
⚠️ Known quirk: the Base Line Color control under Horizontal Axis Settings actually changes the vertical axis baseline, and the one under Vertical Axis Settings changes the horizontal axis baseline. The keys are swapped in the plugin. When documenting, describe where the control is, not which axis its label claims.
- Grid Lines: Count (default 5; -1 auto-computes) and Color (default
#ccc). Bar charts hide the vertical-axis grid controls; Column charts hide the horizontal ones. - Minor Grid Lines: Count (0 disables) and Color.
- View Window: Maximum Value and Minimum Value.
Series Settings
Axis charts and Table. One collapsed section per data column, each with: Visible In Legend (Yes/No), Number Format or Date Format (ICU pattern), Color, and Special Role (Default (Data) / Annotation / Annotation Text / Certainty / Emphasis / Scope / Style / Tooltip / Interval). Line, Scatter, and Candlestick add per-series Line Width And Point Size and Curve Type; Area adds per-series Area Opacity. A note reminds you to save the chart after changing data so new columns appear here.
Chart Size & Placement
- Chart Size/Layout: Width And Height Of Chart (front-end only; placeholders 100% / 400), Stroke Width (default 0), Stroke Color (default
#666), Background Color (default#fff), Transparent background (checkbox). - Placement: Left And Top Margins and Width And Height Of Chart Area (placeholders 20% / 60%).
Gauge and Geo replace this with a simpler Chart Size group.
Chart Data Filter Configuration — Pro (Plus plan)
Google Charts library only. Adds an interactive filter control to the rendered chart.
- Options: Filter Type (String Filter / Number Range Filter / Category Filter / Chart Range Filter / Date Range Filter), Filter By Column Index, Filter By Column Label, Use Formatted Value (False/True), Min Value / Max Value, Match Type (Prefix / Exact / Any), Case Sensitive (False/True).
- UI Options: Label, Label Separator, Caption, Label Stacking (Horizontal/Vertical), Orientation (Horizontal/Vertical), Show Range Values, Allow Multiple, Allow Typing (True/False each).
Frontend Actions — Pro (Plus plan)
Checkboxes adding action buttons under the rendered chart: Print, CSV, Excel (needs the PHP ZIP and XML extensions), Copy, and Download Image (unsupported for table-type charts). Free for Table charts on the DataTables library.
Manual Configuration
Configuration (textarea) — a raw JSON object of Google Visualization API options, merged over the chart's settings at render time. Free. Not available for Table charts on the DataTables library.
Permissions — Pro (Plus plan)
Appended for every chart type:
- Who can see this chart? — All Users (default) / Select Users / Select Roles, with a multi-select for the specific users or roles.
- Who can edit this chart? — same controls; default is the administrator role.
Google chart types: specific groups
- Pie/Donut — Pie Settings: Number Format, Is 3D (Yes/No), Reverse Categories (Yes/No, draws slices counterclockwise), Slice Text (percentage / value / name of the slice / value and percentage / no text), Pie Hole (0–1; makes a donut, default 0), Start Angle, Slice Border Color (default
#fff). Other Slice Settings: Visibility Threshold, Other Slice Label (default "Other"), Other Slice Color (default#ccc). Slices Settings: per-slice Slice Offset (0–1) and Slice Color. - Line — Lines Settings: Line Width And Point Size (defaults 2 / 0), Curve Type (straight / smoothed), Focus Target (datum/category), Selection Mode (single/multiple), Group Tooltips By (category/series/auto/none), Point Opacity (default 1.0), Fill in Missing Values (Yes/No).
- Area — like Line without Curve Type, plus Area Opacity (default 0.3) and Is Stacked (Yes/No).
- Scatter — like Line without Focus Target and Fill in Missing Values.
- Bar / Column — Bars Settings: Focus Target, Is Stacked (Yes/No), Bars Opacity (default 1.0).
- Bubble — Bubble Settings: Opacity (0–1, default 0.8), Stroke Color, Sort Bubbles by Size (checkbox), Size (max) / Size (min). No Series Settings group.
- Candlestick — Candles Settings: Focus Target, Selection Mode, Group Tooltips By, then Failing Candles and Rising Candles subsections, each with Stroke Width (default 2), Stroke Color, and Fill Color.
- Geo — Map Settings: API Key (stored site-wide; a Google Maps API key), Region (default world), Resolution (Countries / Provinces / Metros), Display Mode (Auto / Regions / Markers), Tooltip Trigger. Color Axis: Minimum And Maximum Values, gradient colors for Minimum Value / Intermediate Value / Maximum Value, Region with No Data color. Size Axis: min/max values, Minimum And Maximum Marker Radius (defaults 3 / 12), Marker Opacity (default 1.0). Magnifying Glass: Enabled (Yes/No), Zoom Factor (default 5.0). Chart Size with Keep Aspect Ratio (Yes/No).
- Gauge — Gauge Settings: Tick Settings (Min And Max Values, defaults 0 / 100; Minor Ticks, default 2; Number Format), then Green Color / Yellow Color / Red Color subsections, each with a Value Range (Min / Max) pair and a color picker. Chart Size (width/height only).
- Table (Google Charts library — Pro) — Table Settings: Enable Pagination, Number of rows per page (default 10, shown when pagination is on), Disable Sort, Freeze Columns, Allow HTML, Right to Left table. Row/Cell Settings: subsections Header Row / Table Row / Odd Table Row / Selected Table Row / Hover Table Row / Header Cell / Table Cell, each with Background Color, Color, and Text Orientation (degrees).
- Timeline — Pro. Timeline Settings: Show Row Label, Group by Row Label, Color by Row Label (checkboxes), Single Color.
- Combo — Pro. Like Column, plus Combo Settings: Chart Type (Area / Bar / Candlesticks / Line / Stepped Area) as the default series type, and a per-series Chart Type select in Series Settings.
Chart editor: Settings tab — Chart.js library
Available for Pie/Donut, Line, Bar (Pro), Column, Polar Area (Pro), and Radar/Spider (Pro). The sidebar is simpler than Google's: there is no Chart Data Filter group, no background/placement options, and no gridline or view-window axis options.
- General Settings — Title (Chart Title, Chart Description), Font Styles (Font Family And Size), Legend (Position: Left / Right / Above / Below / Omit, default above; Show datasets in reverse order checkbox), Animation (Duration, default 1000; Easing), License & Creator, Save inside media library?, Enable lazy rendering of chart?.
- Horizontal / Vertical Axis Settings (Line, Bar, Column) — Axis Title with Font Color and Font Family And Size; Tick Settings: Minimum Tick, Maximum Tick, Maximum number of ticks to show (default 11); Formatting: Data Format (ICU pattern).
- Bar Settings (Bar/Column) — Stacked (checkbox). (See the non-functional list below for Bar Percentage and Bar Thickness.)
- Series Settings — per series: Number/Date Format; Line adds Point stroke color, Point fill color, Point stroke width (default 1), Point style (Circle / Cross / Dash / Line / Rectangle / Star / Triangle); Bar/Column add Bar border color, Bar background color, Bar background color when hovered, Bar border width (default 1).
- Pie Settings (Pie) — Donut (checkbox, renders as a donut), Number Format, and Slices Settings with per-slice Arc border color, Arc background color, Arc border width (default 1), Arc border color when hovered, Arc background color when hovered.
- Chart Size — Width And Height Of Chart (front-end only).
- Frontend Actions — Pro (Plus plan), same actions as Google.
- Manual Configuration — Configuration textarea of raw Chart.js options, merged at render time. Free.
- Permissions — Pro (Plus plan), as on Google.
Chart editor: Settings tab — Table charts (DataTables library)
The free Table chart. No axis, font, legend, tooltip, or animation sections.
- General Settings — Chart Title ("Text to display in the back-end admin area" — the title is not rendered on the table itself), Chart Description, Save inside media library?, Enable lazy rendering of chart?.
- Table Settings — Enable Pagination, Number of rows per page (default 10), Pagination type (Page number buttons only / 'Previous' and 'Next' buttons only / 'Previous' and 'Next' buttons, plus page numbers / 'First', 'Previous', 'Next' and 'Last' buttons / 'First', 'Previous', 'Next' and 'Last' buttons, plus page numbers / 'First' and 'Last' buttons, plus page numbers), Table Height (pixels, adds a scrollbar), Enable Horizontal Scrolling, Disable Sort, Freeze Header/Footer, Responsive table?. Pro adds: Enable paging display length, Enable Search, Enable selection (Single item / Multiple items / Operating System dependent), Enable selection of (Row(s) / Column(s) / Cell(s)), Enable information of selection.
- Row/Cell Settings — subsections Header Row, Odd Table Row, Even Table Row, Table Cell (Pro adds Selected Table Item), each with Background Color, Color, and Text Orientation (degrees). These apply on save and reload, not in the live preview.
- Column Settings — per column: number columns get Thousands Separator (default
,), Decimal Separator (default.), Precision, Prefix, Suffix; date columns get Display Date Format and Source Date Format (moment.js patterns). - Frontend Actions — free for Table charts (Print, CSV, Excel, Copy; Download Image is not supported for tables).
- There is no Manual Configuration group for DataTables tables.
Controls visible in the UI that currently do nothing
Do not document these as working settings. They render in the editor, and their values save, but the value never reaches the rendering library:
- Chart.js Chart Title Color (General Settings > Title) — the color is never applied to the rendered title.
- Chart.js axis Step size (Tick Settings) — discarded before rendering.
- Chart.js Legend > Font Family And Size and Legend > Font Color — saved under legacy Chart.js v2 keys the current renderer ignores.
- Chart.js Tooltip > Trigger — overwritten by the plugin's own tooltip callback before rendering.
- Chart.js Bar/Column Bar Percentage and Bar Thickness — passed where the current Chart.js version does not read them; no reliable visual effect.
