{"id":177,"date":"2026-01-24T00:22:04","date_gmt":"2026-01-24T00:22:04","guid":{"rendered":"https:\/\/michaelwinchester.com\/mesh-plug\/?page_id=177"},"modified":"2026-03-09T20:41:21","modified_gmt":"2026-03-09T20:41:21","slug":"mesh-plug-shortcodes","status":"publish","type":"page","link":"https:\/\/michaelwinchester.com\/mesh-plug\/mesh-plug-shortcodes\/","title":{"rendered":"Mesh-Plug Shortcodes"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\">Mesh-Plug Shortcodes (Updated March 09 2026)<\/h3>\n\n\n\n<p>Mesh-Plug supports two primary operating modes:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Observer mode<\/strong>: read-only dashboard from server snapshots (best for public pages)<\/li>\n\n\n\n<li><strong>Live mode<\/strong>: direct browser-to-MQTT connection over WebSocket (admin\/operator use only)<\/li>\n<\/ul>\n\n\n\n<p>With the latest updates, the map is now fully interactive (drag\/pan + zoom), and supports modern free basemaps.<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">1) Main Dashboard (Recommended)<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Observer \/ Public Dashboard (Read-Only, Shareable)<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug mode=\"observer\" height=\"520px\"]<\/code><\/pre>\n\n\n\n<p>Use this for:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Public pages<\/li>\n\n\n\n<li>Shared community dashboards<\/li>\n\n\n\n<li>HOA \/ neighborhood watch \/ info pages<\/li>\n<\/ul>\n\n\n\n<p>Behavior:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>No direct MQTT connection from the visitor browser<\/li>\n\n\n\n<li>Data is served from server snapshot API<\/li>\n\n\n\n<li>No MQTT credentials exposed to viewers<\/li>\n<\/ul>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Live Dashboard (Admin \/ Operator)<\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug mode=\"live\" height=\"520px\"]<\/code><\/pre>\n\n\n\n<p>Use this for:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Real-time operations<\/li>\n\n\n\n<li>Packet\/chat monitoring<\/li>\n\n\n\n<li>Troubleshooting and testing<\/li>\n<\/ul>\n\n\n\n<p>Behavior:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Connects directly to your MQTT broker over WebSocket<\/li>\n\n\n\n<li>Requires valid broker credentials in plugin settings<\/li>\n\n\n\n<li>Shows live packet log and updates immediately<\/li>\n<\/ul>\n\n\n\n<p>Use only on restricted pages.<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">2) Auto Mode (Backward Compatibility)<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug]<\/code><\/pre>\n\n\n\n<p>Behavior:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Resolves automatically by user capability and cache settings<\/li>\n\n\n\n<li>Typically admin-capable users can run live; public users are observer<\/li>\n<\/ul>\n\n\n\n<p>Best practice: explicitly set <code>mode<\/code> in new shortcodes.<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">3) Map Controls and Map Style (New)<\/h2>\n\n\n\n<p>Map options are now built into the main shortcode:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug mode=\"observer\" height=\"520px\" map_tiles=\"voyager\" fit=\"1\" fit_max_zoom=\"13\"]<\/code><\/pre>\n\n\n\n<p>Supported map attributes:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>map_tiles=\"voyager|osm|light|dark\"<\/code><br>Default: <code>voyager<\/code><\/li>\n\n\n\n<li><code>map_zoom=\"13\"<\/code><br>Initial zoom preference<\/li>\n\n\n\n<li><code>map_min_zoom=\"2\"<\/code> \/ <code>map_max_zoom=\"18\"<\/code><br>Zoom limits<\/li>\n\n\n\n<li><code>fit=\"1|0|once\"<\/code><br>Auto-fit behavior:<\/li>\n\n\n\n<li><code>1<\/code>: keep fitting until user interacts<\/li>\n\n\n\n<li><code>0<\/code>: fixed center\/zoom behavior<\/li>\n\n\n\n<li><code>once<\/code>: fit first time, then stop auto-fitting<\/li>\n\n\n\n<li><code>fit_max_zoom=\"13\"<\/code><br>Max zoom when auto-fit runs<\/li>\n\n\n\n<li><code>center=\"lat,lon\"<\/code><br>Example: <code>center=\"47.6062,-122.3321\"<\/code><\/li>\n<\/ul>\n\n\n\n<p>In-map controls now include <strong>Zoom In<\/strong>, <strong>Zoom Out<\/strong>, and <strong>Fit<\/strong> reset.<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">4) Common Attributes (Current)<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>mode=\"observer|live|auto\"<\/code><\/li>\n\n\n\n<li><code>height=\"520px\"<\/code><\/li>\n\n\n\n<li><code>poll_ms=\"5000\"<\/code> (observer snapshot refresh interval)<\/li>\n\n\n\n<li><code>map_tiles<\/code>, <code>map_zoom<\/code>, <code>map_min_zoom<\/code>, <code>map_max_zoom<\/code>, <code>fit<\/code>, <code>fit_max_zoom<\/code>, <code>center<\/code><\/li>\n<\/ul>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">5) Recommended Shortcodes<\/h2>\n\n\n\n<p>Public share page:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug mode=\"observer\" height=\"600px\" map_tiles=\"voyager\" fit=\"1\"]<\/code><\/pre>\n\n\n\n<p>Admin operations page:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug mode=\"live\" height=\"700px\" map_tiles=\"dark\" fit=\"once\"]<\/code><\/pre>\n\n\n\n<p>Public map-focused presentation (single panel, map tab included):<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&#91;mesh_plug mode=\"observer\" height=\"500px\" map_tiles=\"light\" fit=\"1\" fit_max_zoom=\"12\"]<\/code><\/pre>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">6) Permissions Guidance<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Public\/Member pages<\/strong>: use <code>mode=\"observer\"<\/code><\/li>\n\n\n\n<li><strong>Admin\/operator pages<\/strong>: use <code>mode=\"live\"<\/code> only where access is restricted<\/li>\n\n\n\n<li>Keep live mode off public URLs to avoid exposing broker connection behavior<\/li>\n<\/ul>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Mesh-Plug Shortcodes (Updated March 09 2026) Mesh-Plug supports two primary operating modes: With the latest updates, the map is now fully interactive (drag\/pan + zoom), and supports modern free basemaps. 1) Main Dashboard (Recommended) Observer \/ Public Dashboard (Read-Only, Shareable) Use this for: Behavior: Live Dashboard (Admin \/ Operator) Use this for: Behavior: Use only [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-177","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/pages\/177","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/comments?post=177"}],"version-history":[{"count":3,"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/pages\/177\/revisions"}],"predecessor-version":[{"id":225,"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/pages\/177\/revisions\/225"}],"wp:attachment":[{"href":"https:\/\/michaelwinchester.com\/mesh-plug\/wp-json\/wp\/v2\/media?parent=177"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}