I have managed to add some JavaScript that I found here and almost get my promoted links to be responsive.

The only issue is that when my screen gets below a resolution of approximately 900px the promoted links end up on a single line each.

I have seen the answer to the question asked within Stack Overflow but do not understand where it is I need to add the "!important" tag in order to override the SharePoint CSS which appears to be causing this.

Could anyone please advise on how to fix this.


$(document).ready(function () {
$('#promotedlinksbody_WPQ7').addClass('row container-fluid');
$('#promotedlinksbody_WPQ7').children().addClass('col-md-4 tilesresponsive');

1 Answer 1


Use this link to download the js:


Or if unavailable the page has been archived at the Internet Archive along with the code if you search for "Download JavaScript" on that page.

I didn't need to change anything in the code. Just save it, publish it and add the js-link in your webpart properties.

My location is: ~sitecollection/_catalogs/masterpage/display templates/MultilinePromotedLinks.js


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.