{"id":2715,"date":"2026-06-15T23:57:59","date_gmt":"2026-06-15T23:57:59","guid":{"rendered":"https:\/\/localwp.com\/?p=2715&#038;post_type=help&#038;preview_id=2715"},"modified":"2026-06-15T23:58:01","modified_gmt":"2026-06-15T23:58:01","slug":"filters","status":"publish","type":"help","link":"https:\/\/localwp.com\/help-docs\/building-your-add-on\/filters\/","title":{"rendered":"Filters"},"content":{"rendered":"\n<div class=\"wp-block-group help-doc-toc\"><div class=\"wp-block-group__inner-container is-layout-constrained wp-block-group-is-layout-constrained\">\n<p class=\"wp-block-paragraph\">Table of Contents:<\/p>\n\n\n<nav aria-label=\"Table of Contents\" class=\"wp-block-table-of-contents\"><ol><li><a class=\"wp-block-table-of-contents__entry\" href=\"#available-filters\">Available Filters<\/a><ol><li><a class=\"wp-block-table-of-contents__entry\" href=\"#appmenu\">appMenu<\/a><\/li><li><a class=\"wp-block-table-of-contents__entry\" href=\"#siteinfomoremenu\">siteInfoMoreMenu<\/a><\/li><li><a class=\"wp-block-table-of-contents__entry\" href=\"#preferencesmenuitems\">preferencesMenuItems<\/a><\/li><\/ol><\/li><li><a class=\"wp-block-table-of-contents__entry\" href=\"#environment-filters\">Environment Filters<\/a><\/li><\/ol><\/nav><\/div><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Filters enable easily modifying data that is passed around in Local. Much like WordPress&#8217; filters, all filters in Local must return a value.<\/p>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 id=\"available-filters\" class=\"wp-block-heading has-text-color has-link-color wp-elements-25239dbc10bcd3ed1be8633520a51907\" style=\"color:#000000\"><strong>Available Filters<\/strong><\/h2>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-c57d26b1d9acd157cffc1c38822a2e4e wp-block-paragraph\" style=\"color:#000000\"><strong><em>Filter Name<\/em><\/strong><\/p>\n\n\n\n<h3 id=\"appmenu\" class=\"wp-block-heading has-text-color has-link-color wp-elements-9564dcebe006bb8c108aa33838c3e369\" style=\"color:#000000\"><code><strong>appMenu<\/strong><\/code><\/h3>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-cf40d551350d801111e17356660920a4 wp-block-paragraph\" style=\"color:#000000\"><strong><em>Description<\/em><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Allows you to add or modify items in the main app menu (top bar menu)<\/p>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-0e72c0091c800e28c2b2328518c48a99 wp-block-paragraph\" style=\"color:#000000\"><strong><em>Callback Function Parameters<\/em><\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>macOS Menu Template<\/li>\n\n\n\n<li>Current Platform provided by <code>process.platform<\/code><\/li>\n<\/ul>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>function(menu: MenuTemplate[], platform: string): MenuTemplate[];<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><em>_____________________________________________________________<\/em><\/strong><\/p>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-c57d26b1d9acd157cffc1c38822a2e4e wp-block-paragraph\" style=\"color:#000000\"><strong><em>Filter Name<\/em><\/strong><\/p>\n\n\n\n<h3 id=\"siteinfomoremenu\" class=\"wp-block-heading has-text-color has-link-color wp-elements-5303f743e604be9f1c6bac326e8b9a91\" style=\"color:#000000\"><code><strong>siteInfoMoreMenu<\/strong><\/code><\/h3>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-cf40d551350d801111e17356660920a4 wp-block-paragraph\" style=\"color:#000000\"><strong><em>Description<\/em><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Allows you to add menu items to the Site Info More menu inside of a single site view.<\/p>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-0e72c0091c800e28c2b2328518c48a99 wp-block-paragraph\" style=\"color:#000000\"><strong><em>Callback Function Parameters<\/em><\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>menuItems<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/localwp.com\/help-docs\/building-your-add-on\/common-parameters\/#sites\" data-type=\"link\" data-id=\"https:\/\/localwp.com\/help-docs\/building-your-add-on\/common-parameters\/#sites\">currentSite<\/a><\/strong><\/li>\n<\/ul>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>function(menuItems: SiteInfoMoreMenuItem[], site: Site): SiteInfoMoreMenuItem[];<\/code><\/pre><\/div>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-382a6379004ea77b7d04f2a4185cabd3 wp-block-paragraph\" style=\"color:#000000\"><strong><em>Example<\/em><\/strong><\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>hooks.addFilter(&#39;siteInfoMoreMenu&#39;, function (menu, site) {\n\n    menu.push({\n        label: &#39;Volumes&#39;,\n        enabled: !this.context.router.isActive(`\/site-info\/${site.id}\/volumes`),\n        click: () =&gt; {\n            context.events.send(&#39;goToRoute&#39;, `\/site-info\/${site.id}\/volumes`);\n        },\n    });\n\n    return menu;\n\n});<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><em>_____________________________________________________________<\/em><\/strong><\/p>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-c57d26b1d9acd157cffc1c38822a2e4e wp-block-paragraph\" style=\"color:#000000\"><strong><em>Filter Name<\/em><\/strong><\/p>\n\n\n\n<h3 id=\"preferencesmenuitems\" class=\"wp-block-heading has-text-color has-link-color wp-elements-5cac559a4d8979ef927b6af249cde18d\" style=\"color:#000000\"><code><strong>preferencesMenuItems<\/strong><\/code><\/h3>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-b399d8bbb26db5adee4a05bf0489d0b5 wp-block-paragraph\" style=\"color:#000000\"><em><strong>Description<\/strong><\/em><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Add-ons have the ability to add items to Local&#8217;s preferences section by using the <code>preferencesMenuItems<\/code> filter hook. This filter will add a new item to the left hand column of all Preferences views and allow add-ons to add their own content section.<\/p>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1131\" height=\"694\" src=\"https:\/\/localwp.com\/wp-content\/uploads\/2026\/06\/filters.jpeg\" alt=\"\" class=\"wp-image-2717\" srcset=\"https:\/\/localwp.com\/wp-content\/uploads\/2026\/06\/filters.jpeg 1131w, https:\/\/localwp.com\/wp-content\/uploads\/2026\/06\/filters-300x184.jpeg 300w, https:\/\/localwp.com\/wp-content\/uploads\/2026\/06\/filters-1024x628.jpeg 1024w, https:\/\/localwp.com\/wp-content\/uploads\/2026\/06\/filters-768x471.jpeg 768w\" sizes=\"(max-width: 1131px) 100vw, 1131px\" \/><\/figure>\n\n\n\n<div style=\"height:40px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">An <a href=\"https:\/\/github.com\/getflywheel\/local-addon-api\/blob\/99b03ca5298699ab79a804b43f4cc22cac5981ce\/renderer.d.ts#L54-L65\"><code><strong>AddonSettingsItem<\/strong><\/code><\/a> object is given to Local via the <code>preferencesMenuItems<\/code> hook (see usage examples below). This can then render an array of <strong><a href=\"https:\/\/github.com\/getflywheel\/local-addon-api\/blob\/99b03ca5298699ab79a804b43f4cc22cac5981ce\/renderer.d.ts#L43-L48\"><code>PreferencesSection<\/code><\/a>&#8216;s<\/strong> <strong>or<\/strong> any React component. The latter is provided mainly as an escape hatch in the case that an add-on needs more flexibility. Each <code>PreferencesSection<\/code> then provides an optional header and a single or array of <a href=\"https:\/\/github.com\/getflywheel\/local-addon-api\/blob\/99b03ca5298699ab79a804b43f4cc22cac5981ce\/renderer.d.ts#L36-L41\"><code><strong>MenuContentRowItem<\/strong><\/code><\/a>(s).<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"wp-block-paragraph\"><\/p>\n<\/blockquote>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>\/\/ Props passed to &lt;Row \/&gt; or &lt;Override \/&gt; components\n{\n    \/\/ React Router props (types are not accurately documented here and developers should reference the React Router documentation for more details)\n    history: any;\n    location: any;\n    match: any;\n    params: any;\n\n    \/\/ controls whether or not the &quot;apply&quot; button (rendered by Local) is enabled (clickable) or disabled (not clickable)\n    setApplyButtonDisabled: (isDisabled: boolean) =&gt; void;\n\n    \/\/ various other props may be passed via Local but are not an offically supported component of this API as of the time of writing\n}<\/code><\/pre><\/div>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-0e72c0091c800e28c2b2328518c48a99 wp-block-paragraph\" style=\"color:#000000\"><strong><em>Callback Function Parameters<\/em><\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>preferencesMenu<\/li>\n<\/ul>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>function(preferencesItem: PreferencesItem[]): PreferencesItem[];<\/code><\/pre><\/div>\n\n\n\n<div style=\"height:15px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p class=\"has-text-color has-link-color wp-elements-2eb1b38935dd8bc8a1e2a10394d3e61f wp-block-paragraph\" style=\"color:#000000\"><strong><em>Examples<\/em><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&#8220;Standard&#8221; example passing in sections and sub-headers<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>const preferenceItem: AddonSettingsItem = {\n    path: &#39;image-optimizer&#39;,\n    displayName: &#39;Image Optimizer&#39;,\n    sections: [\n        {\n            \/\/ subHeader is optional and if omitted, no subHeader will be rendered\n            subHeader: &#39;header 1&#39;,\n            rows: [\n                {\n                    \/\/ this defines what string will be rendered in the left hand &quot;column&quot; of a row\n                    name: &#39;line 1&#39;,\n                    \/\/ this defines what will be rendered in the right hand &quot;column&quot; of a row. It can be any React component.\n                    component: Preferences,\n                },\n                \/\/ ...add some more rows if you want\n            ],\n        },\n        \/\/ ...add some more sections if you want\n    ],\n    onApply: () =&gt; {\n        console.log(&#39;changes applied!&#39;)\n    },\n    componentProps: {\n        \/\/ This optional object can be any arbitrary props to get passed to your row components (or Override component)\n    },\n};\n\nhooks.addFilter(\n    &#39;preferencesMenuItems&#39;,\n    (menu) =&gt; {\n        menu.push(preferenceItem);\n\n        \/\/ remember to return the menu array here! If you don&#39;t Local won&#39;t be able to render your Preference item\n        return menu;\n    }\n);<\/code><\/pre><\/div>\n\n\n\n<p class=\"wp-block-paragraph\">Overriding Sections with a single React Component (allows you to render arbitrary things in the &#8220;content area&#8221;)<\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism undefined-numbers lang-js\" data-lang=\"JavaScript\"><code>const preferenceItem = {\n    path: &#39;image-optimizer&#39;,\n    displayName: &#39;Image Optimizer&#39;,\n    \/\/ this can also just be any old React component. It will be rendered in the Preferences content area\n    sections: (props) =&gt; &lt;div&gt;{props.title}&lt;div\/&gt;,\n    onApply: () =&gt; {\n        console.log(&#39;changes applied!&#39;)\n    },\n    componentProps: {\n        \/* Arbitrary props that will get passed to your row components or section override component. *\/\n        \/* here we are passing it &quot;title&quot; which will get passed to the &quot;sections&quot; component *\/\n        title: &#39;Preferences Title&#39;,\n    },\n}\n\nhooks.addFilter(\n    &#39;preferencesMenuItems&#39;,\n    (menu) =&gt; {\n        menu.push(preferenceItem);\n\n        return menu;\n    };\n);<\/code><\/pre><\/div>\n\n\n\n<div style=\"height:25px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 id=\"environment-filters\" class=\"wp-block-heading has-text-color has-link-color wp-elements-3ce6e17b6518f54b35bbe8d598650042\" style=\"color:#000000\"><strong>Environment Filters<\/strong><\/h2>\n\n\n<div id=\"help-step-block_ad8b8caa6f2389b3332422bd9ebf7d92\" class=\"help-note-container help-type-warning\">\n\t<div class=\"help-icon\">\n\t\t<svg viewBox=\"0 0 512 512\" fill=\"currentColor\"><path fill=\"currentColor\" d=\"M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-464a208 208 0 1 0 0 416 208 208 0 1 0 0-416zm0 336a32 32 0 1 1 0-64 32 32 0 1 1 0 64zm0-256c18.2 0 32.7 15.5 31.4 33.7l-7.4 104c-.9 12.6-11.4 22.3-23.9 22.3-12.6 0-23-9.7-23.9-22.3l-7.4-104C223.3 143.5 237.8 128 256 128z\"><\/path><\/svg>\t<\/div>\n    <div class=\"help-text\">\n\t\t<p><code>ENV_ID<\/code> and <code>ENV_VERSION<\/code> are for illustrative purposes only and should be replaced with a static value or variable.<\/p>\n\t<\/div>\n<\/div>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th class=\"has-text-align-left\" data-align=\"left\"><strong>Filter Name<\/strong><\/th><th class=\"has-text-align-left\" data-align=\"left\"><strong>Parameters<\/strong><\/th><\/tr><\/thead><tbody><tr><td class=\"has-text-align-left\" data-align=\"left\"><code>importBlueprintSiteSettings:ENV_ID:ENV_VERSION<\/code><\/td><td class=\"has-text-align-left\" data-align=\"left\"><strong><a href=\"https:\/\/localwp.com\/help-docs\/building-your-add-on\/common-parameters\/#site\" data-type=\"link\" data-id=\"https:\/\/localwp.com\/help-docs\/building-your-add-on\/common-parameters\/#site\">site<\/a><\/strong><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<div style=\"height:90px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Table of Contents: Filters enable easily modifying data that is passed around in Local. Much like WordPress&#8217; filters, all filters in Local must return a value. Available Filters Filter Name appMenu Description Allows you to add or modify items in the main app menu (top bar menu) Callback Function Parameters _____________________________________________________________ Filter Name siteInfoMoreMenu Description&#8230;<\/p>\n","protected":false},"author":78,"parent":2696,"menu_order":5,"template":"","tags":[],"helpcategories":[69],"class_list":["post-2715","help","type-help","status-publish","hentry","helpcategories-building-your-add-on"],"acf":{"help_keywords":""},"_links":{"self":[{"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/help-doc\/2715","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/help-doc"}],"about":[{"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/types\/help"}],"author":[{"embeddable":true,"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/users\/78"}],"version-history":[{"count":0,"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/help-doc\/2715\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/help-doc\/2696"}],"wp:attachment":[{"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/media?parent=2715"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/tags?post=2715"},{"taxonomy":"helpcategories","embeddable":true,"href":"https:\/\/localwp.com\/wp-json\/wp\/v2\/helpcategories?post=2715"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}