How can we help you today?

How to Use Custom Icons and Images to Present Graphical Information

ShortPoint elements offer you a variety of icons to choose from. Nevertheless, sometimes you prefer to use your own, branded icons and images.


You can apply custom icons and images using any ShortPoint Design Element that accepts image URLs or has file picker options. This includes Image, Image Titles, Tiles, and other similar Design Elements.


We will demonstrate how you can do this in this article.


TABLE OF CONTENTS


Prerequisites

  • You have the latest version of ShortPoint SPFx installed on your SharePoint environment.
  • You must be a ShortPoint Designer with an active license.
  • You must have an icon or image URL or an icon or image file you want to use.

Interactive Tutorial

Press Get Started to follow the steps on setting up a custom icon or image in this interactive tutorial.



Step-by-Step Tutorial

These are the detailed instructions on how to add your custom icon or image to your page.


Step 1: Edit the ShortPoint web part

  • Click Edit on the SharePoint page where you want to use your custom icon or image.
  • Select the ShortPoint web part.
  • Press the pencil icon to enter edit mode.


Step 2: Open the Design Element settings window

  • Go to the Design Element where you want to display your custom icon or image. As an example, we will be updating a Tiles Design Element.

Tiles design element

  • Click the Design Element label to enter Active Mode.
  • Select the cogwheel icon to open the Design Element settings window.


Step 3: Update the Image field

In Design Elements that have Items lists, such as the Tiles Design Element, follow these steps to update each item. 

  • Press the cogwheel icon on the item that you want to update.
  • (optional) Remove the icon currently configured on the item.
  • In the Image field, you can choose to add the image URL of your custom icon or image or upload a file and select it using the file picker.
  • (optional) Do the same on all items in the list.


Tiles settings window


In Design Elements that show a single item, such as Image, you will find the Image field in the Content tab.

  • In the Image field, you can choose to add the image URL of your custom icon or image or upload a file and select it using the file picker.


image design element


Step 4: Hit Apply Changes and Save your edits

  • Once you are done, press the green checkmark button to apply your changes.
  • Preview the page to see the result.
  • Do not forget to hit Save.


You now know how to use custom icons and images on ShortPoint Design Elements. Do these steps to further customize the content of your SharePoint intranets.


Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 69 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more