How to add links on the SharePoint tiles hover?

Question

One of the Projects I am working on, I am displaying SharePoint OOTB tiles on the landing page of a team site.Now one of the requirements I have is to display certain links which will be visible when someone hovers over the tile. These links will be pointing to some of the custom document library views(content types based) created on the site.Please note that when clicked on the tile, I am directing user to the actual document library.

Is there a way to implement this by leveraging css/js? Also the links will be tile specific. If someone knows about this, please let me know. Thanks in advance.

Answer 1

The easiest way is create tile for each library view.

Otherwise, you need to create extra columns to store these view paths for each library link tile, and then try to display them in the tile.

If you are using the Promoted links, it is difficult to display additional information (additional item properties) on the detail hover panel in the OOB tile view.

As a workaround, an idea is, use Content Search web part to display these items and customize the item display template to display them as tiles. Then, you can configure what property need to be displayed.

More information about displaying tiles in SharePoint Content Search web part using Display Templates.

Another alternative, you may need to do some coding to build your own solution (custom list web part/view) to achieve this functionality you’re looking for.