I want to use a `ms-windows-store://`link which will open the `Quick Assist` app in the `Microsoft Windows Store`on the local PC and not the website. This link will make it easier for allowing me to remotely access a client's PC when required rather that telling them on how to install software or press certain keys on the keyboard.
By using the local `Windows Store`, the product page for the app benefits from:
- Being able to recognise if the app is installed on the PC
- The blue action button changes accordingly, so instead of seeing always seeing a `Download` button (as you would on the Microsoft Windows Store website) you will see an `Open` button if the app is installed or a `Get` button if not.
- With either option you click the big blue action button and follow the steps.
- Some browsers will ask if you are allowed to open `ms-windows-store` links, but this is a very easy message for the user to click and thwe finish the procedure.
- The user is more likely logged in locally
- This might be advantages for many apps not discussed here.
`Quick Assist` Store links
- Local PC: ms-windows-store://pdp?&productid=9p7bp5vnwkx5
- Website: https://apps.microsoft.com/detail/9p7bp5vnwkx5
Issue
You can easily add links to the Microsoft Store website as these are normal URLs, however, when I use a `ms-windows-store` URLs in a custom link menu item, it is always removed.
Cause
- WordPress is filtering all URLs and if the protocol is not allowed it is wiping them so the new custom link will save with an empty URL field.
- WordPress has a list of allowed protocols it uses for filtering URLs and `ms-windows-store` is not in it.
Solution
Add `ms-windows-store` as an allowed protocol, steps of which are now outlined below.
I found how to add a protocol to the `Allowed Protocols` list with information in this article, Using WordPress ‘kses_allowed_protocols’ PHP filter | IT Support Guides and is in 2 parts, the code, and then where to put it.
You can also craft a custom menu item type using the plugin Menu Item Types – WordPress plugin | WordPress.org but this requires sometime to extract the code from WordPress and build a custom menu item type which can be used by this plugin. Most of the relevant code links are in the research section at the end.
The Code
I modified the code from the article to add/allow the `ms-windows-store` protocol.
// Add a Custom Protocol (ms-windows-store) add_filter('kses_allowed_protocols', 'add_myprotocol'); function add_myprotocol($protocols) { $protocols[] = 'ms-windows-store'; return $protocols; }
Where to put the code?
TL;DR - Use Code Snippets and have the code snippet run everywhere. The URL is filtered when submitted and then when displayed.
Now you have the relevant code, where do you put it? There are several ways to add these filters in to WordPress, pick which one is best for you. Your different options are below:
- Code Snippets plugin
- Code Snippets – WordPress plugin | WordPress.org - An easy, clean and simple way to enhance your site with code snippets.
- This plugin allows for code to be added from within the WordPress admin area.
- It is a very completed plugin with such features as apply the code only to the admin area.
- There is an option to allow code to stay present even if the plugin is removed.
- Custom plugin
- Create a blank plugin and add your code in the main file of the plugin
- You can use the WordPress file editor to add/remove code.
- If you update your plugin, the code might change, but this will be human error.
- you can use `is_admin()` to define the code to run just for the admin area.
- Theme functions.php
- this will get overridden on a theme update.
- Child Theme functions.php
- This file will not get overridden when the theme is updated
Research
These are some of the relevant code locations I found.
Functions (in order of how I found the solution)
- print_post_type_container()
- wp-includes/class-wp-customize-nav-menus.php : ~1221
- This has the HTML for the `Custom Links` blade in the `Add menu items` accordion on the left hand side of the `Menus` page.
- content_template()
- wp-includes/customize/class-wp-customize-nav-menu-item-control.php : 64
- This has the HTML for the `Custom Link` menu item in the current menu shown under `Menu Structure` on the right hand side of the `Menus` page.
- Javascript/Ajax is heavily used to fill in the variables.
- This might be for the frontend???
- wp_update_nav_menu_item()
- wp-includes/nav-menu.php : ~315
- Saves the properties of a menu item or create a new one.
- Includes the use of esc_html()
- esc_html()
- wp-includes/formatting.php : ~4654
- Escaping for HTML blocks.
- esc_url_raw()
- wp-includes/formatting.php : ~4574
- Sanitizes a URL for database or redirect usage.
- wp_allowed_protocols()
- wp-includes\functions.php : ~7158
- Retrieves a list of protocols to allow in HTML attributes.
- The default protocols are hardcoded in this function but can be overridden/appended/deleted with kses_allowed_protocols()
Links
- Using WordPress ‘kses_allowed_protocols’ PHP filter | IT Support Guides
- How to Use the WordPress `kses_allowed_protocols` PHP Filter for Modifying Allowed Protocols.
- This article explains how to use the `kses_allowed_protocols` WordPress PHP filter to modify the list of protocols allowed in HTML attributes.
- wp_allowed_protocols() – Function | Developer.WordPress.org
- Retrieves a list of protocols to allow in HTML attributes.
- Mentions the hook using `kses_allowed_protocols`.