You might want to add custom imagery for the standard icons on your site: for example, the search bar icon, the title bar icons, or icons that appear on your cards. In order to do this, you’ll need to add the images to your site so that they can be referenced.
To add image files to Search:
- Click Pages in the navigation bar and click on your desired site.
- Click on the View Code Editor button.
- Hover over the master branch and click on the pencil icon (
) that appears.
- Click on the
staticfolder. - Click on the
assetsfolder. - Hover over the
imagesfile and click on the … icon. - Click Add file in the drop-down menu.
- Upload an image file to your
/static/assets/imagesfolder. Note that you must place images in this specific folder path, otherwise, they will not be accessible for use on your site.- Select Add a New File and name it. This will create a blank image for you to insert code into.
- Select Upload an Existing File. Then click Choose File to upload an image from your device.
- Click Add File.
- Your image file will appear under the images file with a path of
/static/assets/images/filename.extensionso you will need to reference the image with that structure. You can use this wherever the library is expecting an image URL. Below is an example of referencing a custom icon replacing the Search Bar magnifying glass:
"SearchBar": {
"placeholderText": "Search", // The placeholder text in the search bar
"customIconUrl": "static/assets/images/magnifying_glass.svg"
}