Create Channel Menu Code Settings

Step 1: Create a Snippet Settings File with JavaScript

You can use your JavaScript static resource files, including strings, arrays, JSON, and JavaScript functions for the channel menu. To get started, follow this code example to modify a menu item for channel menu static resource files. Use these supported settings.

Step 2: Upload Your Static Resource Files

With your code ready, upload a file as a static resource in Setup.

1. When you upload your file, select Public for the cache control.
2. Choose a static resource name that’s easy to remember. Use this name and not the file name in your channel menu settings.

Step 3: Add Resources to Code Settings

Edit your code settings to link to your static resource file.

1. From Setup, enter Channel Menu in the Quick Find box and select Channel Menu.
2. Click the name of the channel menu you want to edit.
3. In the Code Settings section, click Edit.
   
4. Select Add Code Setting.
5. Enter a unique Code Setting Name for your customization.
   
6. Add a description and select a resource type.
7. Select your uploaded resource name in the Static Resource field.
8. Select Add Code Setting to add more.
9. Save your changes.

Step 4: Implement Your Code Settings (Experience Builder Sites)

Add your code setting name in the property editor and load the Code Setting Name for your site on a specific page.

Step 5: Implement Your Code Settings (Websites)

Add your code setting name to your channel menu code snippet.

1. Apply a channel menu code snippet if you haven't done so yet.
2. Open the code snippet that you added to your website.
3. Add the new parameter as an object to the embedded_svc.menu.init() call in the snippet. See the end of this section for an example.
4. Check that the object is the last parameter passed into embedded_svc.menu.init().
5. Verify that your code snippet changes in your web page markup.
6. After 10 minutes, refresh your web page and confirm that the Channel Menu button appears. Check that the static resource is loaded and the item is working on the web page.

embedded_svc.menu.init(
	...existing parameters,
	{
		pageName: "InsertName"
	}
);