How to Display Countdown Element Without an Icon : ShortPoint Support

You can use custom CSS to remove the icon tile that comes with the default design of the Countdown Design Element. We will show you how to do that in this article.

Before	After

TABLE OF CONTENTS

Prerequisites
Interactive Tutorial
Step-by-step Tutorial

Prerequisites

You have the latest ShortPoint SPFx version installed on your SharePoint environment.
You are a ShortPoint Designer with an active license.
You inserted a Countdown Design Element on your SharePoint page.

Interactive Tutorial

Go through the interactive tutorial to learn how to remove the icon in the Countdown Design Element.

Copy this custom CSS code to edit your Countdown Design Element:

.shortpoint-countdown-icon {
    display: none;
}

Step-by-step Tutorial

Follow these steps on how to apply the custom CSS to your Countdown Design Element:

Step 1: Edit the ShortPoint web part

Go to your SharePoint page and edit it.

edit the page

Select the ShortPoint web part and click the pencil icon to enter edit mode.

enter ShortPoint edit mode

Step 2: Launch the Countdown Design Element settings window

Navigate to the Countdown Design Element on your page.
Click the cogwheel icon to open the settings window.

open Countdown settings window

Step 3: Copy and paste the custom CSS

This is the custom CSS we will be using to remove the icon on the Countdown Design Element:

.shortpoint-countdown-icon {
    display: none;
}

Copy the custom CSS code.
Switch to the Custom CSS tab on the settings window.
Paste in the space provided.

paste code in custom CSS tab

Step 4: Apply changes and save

Once done, click the green checkmark button to apply your changes.
Remember to hit Save.

That is all! Your Countdown Design Element does not have an icon anymore.

How to Display Countdown Element Without an Icon

Prerequisites

Interactive Tutorial