Showing posts with label Webpart Tile. Show all posts
Showing posts with label Webpart Tile. Show all posts

Create separate Tile list view for a Promoted Links in SharePoint

Most business users prefer to present featured links in Tile view in SharePoint.

SharePoint does not give an option to modify the Title view for promoted links in a traditional way, which means you cannot filter or sort the Tiles item.




Here I am going to show you how to modify or create separate Tile list view for a Promoted Links in SharePoint.


Go to your site where you want your promoted links and within the site contents click on "Add an App"


Give a name to your promoted links. Once the promoted links is created, add new columns as per you business requirements. Now to modify the Tile view or create a separate tile view, click on Create view 


SharePoint will take you to the List view settings page. Click on Custom View in SharePoint Designer. This will open a SharePoint designer, and ask you specify Tile view name. Enter the Tile view name.


Once the new SP Tile view is created, edit the newly created view. Now you will notice all your new columns available to select, filter etc. Make necessary changes in the list view, and click Okay.

You will see your custom Tile view! 








Remove SharePoint Webpart title link so that it does not drill down to the underlining list

There are many options you can take to remove the Title link. It depends upon whether you would like to keep every out of box or prefer to use Javascript.

Option 1:
Add an empty content editor webpart and give same title as listview webpart, and on the listview webpart you have to set the chrome to none so title doesn't display once you exit out of design mode.

You can modify Chrome Type property of the List View Webpart:

  • Site Action
  • Edit Page
  • From the context menĂ¹ on the top-right of the webpart choose Edit Web Part
  • Within the properties pane expand Appareance section
  • Modify the property Chrome Type to None or Border Only
  • Click Ok
  • Click on Stop Editing button





Option 2:
If you put a pound "#" in the Title URL you get a link to current page.

You can modify Chrome Type property of the List View Webpart:

  • Site Action
  • Edit Page
  • From the context menĂ¹ on the top-right of the webpart choose Edit Web Part
  • Edit the list view webpart
  • Expand the Advanced tab, and replace the title url with #
  • Click on Apply button
  • Click on Stop Editing button




Option 3: Javascript
Add a script editor webpart on the page, and add the following Javascript code. This code will disable all Webparts Title link on the page.

<script>
$(function() {
    $('.ms-webpart-titleText').each(function() {
        var link = $(this).find('a');
        if (link.length > 0)
            $(this).text(link.text());
    });
});
</script>

Option 4: Javascript
Add a script editor webpart on the page, and add the following Javascript code. This code will disable only specific Webpart Title link on the page.

<script>
$( document ).ready(function() {
    $('a[href="/sites/yoursitename/Lists/yourlistname"]').contents().unwrap();
});
</script>