Menu Images

Depending on your website design, you may be able to add clickable image links to your MainNav menus in Menu Manager. These image links will appear in your main navigation dropdown menus along with each menu item.

For example, if you have an “Explore and Play” main navigation dropdown menu, all menu items and menu image links will appear when you select “Explore and Play” from your main navigation at the top of your website. You may want to add an image link for the “Register for a Program” page. When someone selects the image link, it will take them to the “Register for a Program” page.

Change the image link

If you would like to change the page that the image links to, you just need to update the link in Menu Manager.

To change the image link:

  1. Navigate to Menu Manager
  2. Lock the Menu Manager to make changes
  3. Navigate to the MainNav menu you'd like to edit an image link
  4. Click the “MenuImages” item from the list of the items in that specific menu
  5. Select the menu image that you'd like to edit
  6. Update the “Link Text” and “URL” fields on the right side of the page with the new page link
  7. Select the “Save” button

You will need to publish the menu in order for these changes to appear on the live website.

Change the image

If you already have a menu image and you'd like to replace the image, you just need to upload the image to the i:Create Content Management System. Make sure the image has the exact same file name as the image you are replacing. This will automatically update the image in the menu.

Image size

Check your website style guide to find the image size guidelines for menu images. These will vary across websites.

Add an image link to a menu

If you want to add an image to a menu that doesn't already have an image, you need to:

  1. Navigate to Menu Manager
  2. Lock the Menu Manager to make changes. Then you need to:
  3. Navigate to the MainNav menu that you'd like to add an image
  4. Click the “MenuImages” item from the list of items in the specific menu
  5. Select “New Menu” from the “Working Menu” toolbar

This will allow you to edit the fields located to the right of the page. Complete each field just as if you were adding a new menu item. You will need to fill out the “Image Name” field. Once complete, select the “Save” button and then publish the menu so that your changes appear on the live website.

Finding the Image Name

To find the appropriate Image Name, navigate to File Manager, then:

  1. Select the folder in which you have stored your image, or search for your image by file name in the search bar.
  2. Once you have found your image in File Manager, hover over the image file and select "Copy Link."
  3. Paste the URL you have just copied into the "Image Name" field as per the instructions above.  
  4. Delete the root website name of the URL you have just copied in the Image Name field. For example, when inserting an image with the file name: https://sandboxcity.ghddigitalpss.com/en/resourcesGeneral/2017CityLandscape.jpg, delete "https://sandboxcity.ghddigitalpss.com/en" to make your Image Name: "/resourcesGeneral/2017CityLandscape.jpg".
  5. This Image Name path should allow you to successfully save and publish your new menu image link.