Modify Web Part Title using jquery

This post describes how to modify a Web Part Title using jquery in SharePoint.

First of all I would like to point out, that I only found a was to “extend” the Web Part title and not to “replace” it. This means, that the existing Web Part title remains and you are able using the following solution to append additional text to the existing title.

Furthermore, I describe a solution that only needs a javascript to be integrated into an existing SharePoint (Web Part) page. No customization of MasterPages etc. are necessary.

Components

The Javascript

You need a little javascript that modifies the Web Part title. In my example I take the value from an URL paramter and append that to the Web Part.

 

In order to get the Web Part ID of the Web Part you want to modify, you could use e.g. IE Development Tools (F12):
Identify the Web Part and copy the ID that starts with “WebPartCaptionWPQ”. The last digit identifies the Web Part.

IE F12 - WebPartCaptionWPQ3

 

Save the javascript as “ModifyWebPartTitle.txt” within the SharePoint Site, e.g. in the library “Site Assets”.

Site Assets - Modify Web Part Title

CEWP

Add a CEWP (Content Editor Web Part) to the Web Part page and configure the properties so that the content will be from the previously saved javascript in the Site Assets library and that the Chrome Type is set to “none” (in order to hide the Web Part).

CEWP - Modofy Web Part Title - Web Part Properties

That’s pretty much it.

The Result

Navigate to your SharePoint page and use the URL Paramter you specified as the desired value.

Modify Web Part Title - Result

1741 Total Views 4 Views Today
Please follow and like:
My RSS Feed
Follow me by Email
Like it on Facebook
Share on Google+
Share on Twitter
Share on LinkedIn
Share on Xing

You may also like...

2 Responses

  1. Patrick says:

    Great script!
    Would it be possible to edit the filter value of a certain view of a webpart?
    E.g. show items only if title equals “xyz”
    Thanks in advance!
    Patrick

    • Markus says:

      Sure! What I usually do is to add a Filter Web Part (“Query String (URL) Filter”) to the page and pass the filter values within the url.
      You can combine that with the script that adjusts the Web Part title.

Leave a Reply

Your email address will not be published. Required fields are marked *

Enjoy this blog? Please spread the word :)