Debug Skin

Last modified by Thomas Mortagne on 2026/02/26 15:34

cogSnippet Allowing to help understand XWiki templates
TypeXAR
Category
Developed by

Ludovic Dubost

Rating
0 Votes
LicenseGNU Lesser General Public License 2.1

Success

Installable with the Extension Manager

Description

Warning

This tool should only be used on development site and not on a production site as it modifies the HTML generated by the XWiki templating system and can have side effects on CSS styles and on Javascript. 

This small application allows to better understand XWiki skins and templates, as well as find the XWiki code currently active on an XWiki site. 

Using a click on an element of the page and maintaining the ALT key:

debugskin1.png

a popup will appear and tell you which templates contains this element and where the code of this template is located (either in the XWiki default templates, in an XWiki file system skin or in an XWiki skin stored in a wiki page):

debugskin2.png

Finally you can view all templates that make an XWiki page by clicking on the "Show All link" and all blocks will be shown on the screen:

debugskin3.png

Limitations:

  • This system does not allow to locate code coming from Javascript extensions or from certain AJAX calls. This is the case for example of annotations or the share page by email feature. If an element is not found as being from a template it is most probably coming from an AJAX call. You can use Firebug to detect the AJAX calls and the source of the content. 
  • This system does not detect the footer content as it would have broken the HTML ending the document

Prerequisites & Installation Instructions

We recommend using the Extension Manager to install this extension (Make sure that the text "Installable with the Extension Manager" is displayed at the top right location on this page to know if this extension can be installed with the Extension Manager). Note that installing Extensions when being offline is currently not supported and you'd need to use some complex manual method.

You can also use the following manual method, which is useful if this extension cannot be installed with the Extension Manager or if you're using an old version of XWiki that doesn't have the Extension Manager:

  1. Log in the wiki with a user having Administration rights
  2. Go to the Administration page and select the Import category
  3. Follow the on-screen instructions to upload the downloaded XAR
  4. Click on the uploaded XAR and follow the instructions
  5. You'll also need to install all dependent Extensions that are not already installed in your wiki

Install the XAR by importing it or using the XWiki Extension Manager. Visit the XWiki.DebugSkin page to activate the feature.
You will need to reload the page to be able to use the feature.

This application has been tested with XWiki Enterprise 3.4

Release Notes

v0.1

This application has been tested with XWiki Enteprise 3.4

Get Connected