Animated Title Banner in SharePoint Modern site

Mimic the look of a slide show or rotating banner on your SharePoint site with an animated gif!

Hello there! This is Danielle Lissak invading my friend The SharePoint Nomad’s blog to share some SharePoint tricks with ya.  We recently had a client that really wanted a sort of slideshow in the header block of their corporate portal page.  I was unable to find a way to do this within the features currently offered on the SharePoint modern site so I was left to my own devices.  Here’s how I managed to mimic the look of a slideshow or rotating banner on the client’s site with an animated gif.

I’m not going to go into how to create an animated gif since this is a SharePoint blog, but there are many programs out there to do so.  I used PowerPoint to create this one because I already had it and I’m cheap. 

Depending on how you want it to appear, you may need to size your gif so that it fits the space at 100% scale.  This way, you can control the height of the banner and minimize stretching/zooming. 

Once you have your gif you can add it to your SharePoint page just as you would any other image.  However, adding it to the banner block the standard way may cut off a part of your image as shown below.  And although you can’t tell here, it is animated!

This may work well for your project but in this case, it did not suit my client’s needs. 

The work around is to delete the existing webpart.  In the case of the Communications templates, delete the Hero webpart to get the menu shown below.  Then just choose the Image option and proceed to insert the image as you normally would.

Now pat yourself on the back because you’re done! 

Did I miss something? Let me know in the comments and I’ll add it in! 

Keep on keepin’ on,

Danielle Lissak