Vulnerability in EPiServer.Forms

Try our conversational search powered by Generative AI!

Per Nergård
Jan 31, 2010
(0 votes)

Changing the tooltip in the EPiServer page tree

I’m currently working an a project where the editors add meta data to the pages. This meta data contains information about which target audience the information is relevant for.

It’s important for the editor to view the meta data in order to edit the page for the correct target audience.

In the case of several pages in the same part of the structure with similar information, it would be quite tedious for the editor to be forced to click on a page and choose edit to be able to view this information.

After thinking about it for a while I thougt it would be nice to display the meta data in the tooltip.

I didn’t know how to go about this so I started with a bit of googling.

I found a post by Henrik Nyström where he managed to add custom icons to the EPiServer page tree using a control adapter. The module is available over at EPiCode.

After a session with reflector i figured how to manipulate the tooltip.

1. Create a new language file.

The EPiServer page tree tooltip “template” is located in the language<langcode>.xml file. So let’s create a new one.

Here I have added a new row to the tooltip. It’s the identifier between the brackets that we will replace with our own information.

<?xml version="1.0" encoding="utf-8" standalone="yes"?>
    <language name="English" id="en">
                    Page Type: [PageTypeName]&lt;br/&gt;
                    Created: [Created]&lt;br/&gt;
                    Changed: [Changed]&lt;br/&gt;
                    Page ID: [PageLink]&lt;br /&gt;
                    Sort index: [PagePeerOrder]&lt;br /&gt;
                    Custom: [custom]

2. Create a control adapter for the page tree. Don’t forget to add a .browser file in the App_Browsers folder.

At row 31 I add a attribute named custom with a text.


   1:  using System;
   2:  using System.Configuration;
   3:  using System.Collections.Generic;
   4:  using System.Diagnostics;
   5:  using System.Web;
   6:  using System.Web.Security;
   7:  using System.Web.UI;
   8:  using System.Web.UI.WebControls;
   9:  using System.Web.UI.HtmlControls;
  10:  using EPiServer.Core;
  11:  using EPiServer.UI.WebControls;
  12:  using EPiServer.Web.WebControls;
  14:  public class PageTreeViewAdapter : System.Web.UI.WebControls.Adapters.HierarchicalDataBoundControlAdapter
  15:  {
  17:      protected override void OnInit(System.EventArgs e)
  18:      {
  19:          base.OnInit(e);
  21:          Control.PageTreeViewItemDataBound += new PageTreeViewEventHandler(Control_PageTreeViewItemDataBound);
  22:      }
  24:      protected new PageTreeView Control
  25:      {
  26:          get { return base.Control as PageTreeView; }
  27:      }
  29:      private void Control_PageTreeViewItemDataBound(object sender, PageTreeViewEventArgs e)
  30:      {
  31:          e.Item.Attributes.Add("custom", "Custom tooltip text");
  33:      }
  34:  }
3. Compile and you’re done.
If you don’t like the EPiServer standard tooltip you can remove the rows that 
you don’t wan’t to display. Or replace all with just a [custom] tag and create
the tooltip dynamically for different users of maybe per page type.
Jan 31, 2010


Please login to comment.
Latest blogs
Update related content

In this article, I will show simple code that allow to replace linked content with other content selected by the Editor. When deleting content whos...

Grzegorz Wiecheć | Dec 8, 2023 | Syndicated blog

Getting Started with Optimizely SaaS Core and Next.js Integration: Content Areas and Blocks

The blog guide elaborates on improving content rendering by exploring content areas and blocks within the Optimizely CMS. It walks through setting ...

Francisco Quintanilla | Dec 8, 2023 | Syndicated blog

Maximize performance by uploading your external data to Optimizely Graph

Learn to integrate external data into Optimizely Graph for improved performance, covering data preparation, synchronization, and effective querying.

Surjit Bharath | Dec 6, 2023 | Syndicated blog

Google Read Aloud Reload Problems

Inclusive web experiences greatly benefit from accessibility features such as Google Read Aloud. This tool, which converts text into speech, enable...

Luc Gosso (MVP) | Dec 4, 2023 | Syndicated blog