Try ShortPoint nowBy default, the size of icons within the Tiles Design Element cannot be changed:
This article will show you how to adjust the icon size in Tiles using Custom CSS:
TABLE OF CONTENTS
Prerequisites
- You must have the latest version of ShortPoint installed on your SharePoint environment.
- You must be a ShortPoint Designer with an active license.
- You must already have a Tiles Design Element on your page.
Interactive Tutorial
Copy the code below before starting the tutorial:
.shortpoint-icon, .shortpoint-icon:before, .shortpoint-icon:after {
font-size: 60px;
}Step-by-step Tutorial
Follow the steps below for a detailed guide on how to resize icons:
Step 1: Edit the ShortPoint Web Part
- Go to the SharePoint page you want to use and click Edit:
- Click the cross icon to close the Toolbox:
- Select the ShortPoint tag.
- Click the Edit properties icon:
Step 2: Copy the Code
- Copy the Custom CSS code below:
.shortpoint-icon, .shortpoint-icon:before, .shortpoint-icon:after {
font-size: 60px;
}Step 3: Edit the Tiles Design Element
NOTEBefore proceeding, make sure you already have the Tiles Design Element on your page. If you still don’t have it, check out How to Customize the Tiles Design Element to learn how to do it.
- Click the Tiles tag:
- Select the cogwheel icon:
Step 4: Paste the Code
- Click the next icon:
- Navigate to the Custom CSS tab.
- Paste the code in the field provided.
- (Optional) Customize the font-size value according to your preferences.
Step 5: Save
- Once satisfied with the look of your Tiles, click the green check mark.
- Click the eye icon to see your page in real time:
- Click Save to apply your changes:
That’s it! You can now resize the icons inside the Tiles Design Element.
Related articles:
- How to Add Lottie Animations in the ShortPoint Code Design Element
- How to Disable Default Capitalization in Tiles Design Element Titles
- How to Redirect Users to an Item in an Accordion on Another Page
