Where is this HTML coming from

Last updated by Matt Beckett

Where is this HTML being generated?

http://docs.elgg.org/wiki/Engine/Views

Elgg follows an MVC pattern where Views are 'V'.

Views are reusable code that get called like this:

  echo elgg_view('view/name', $params);

Where $params is an array of variables used by the view.

The views can be found in their own php files, in core they reside in the directory /views

On each pageload there is a viewtype set - typically as a $_GET value - [site_url]?view=rss

If nothing is defined for the viewtype the type will be 'default'

Therefore the same views can render differently depending on the viewtype.

The view with the name 'view/name' can be found at:

  /views/[viewtype]/view/name.php

  eg.
  /views/default/view/name.php
  /views/rss/view/name.php

When markup problems appear, or you want to trace back the origin of a particular view there a few methods that work.

Developers plugin

A bundled core plugin that is very helpful for developers in a number of ways.

Under the menu 'Develop' => 'Settings' there is an option for 'wrap views', this wraps each view with HTML comments letting you know which view is generating that portion of the HTML. These comments look like:

HTML

Therefore in this case, the html is being generated in the file /views/default/page/elements/foot.php

 

Content Debugger plugin

https://github.com/beck24/Content-Debugger

This plugin adds a link to the topbar menu for administrators - if no topbar exists in the theme (as is the case with the current landing theme) a manual toggle is possible by visiting [site_url]/content_debugger/toggle

Once activated simply mouse-over the html you wish to identify and a very convenient tooltip will show various information including:

  - the view that generated the HTML
  - the hierarchy of views that called the originating view
  - the physical location of the view file
  - any view extensions and the order they are called in
  - how long it took to render the view

This is much more informative and quicker than the developer tools method, and the one I recommend.

 

Overwriting Views

Plugins and themes can redefine views simply by copying the file structure of the original. For example, if a core view is located at /views/default/input/text.php a plugin can redefine the view by creating (within the plugin structure) /views/default/input/text.php

If more than one plugin redefines a view, the plugin located lower down on the list (run last) takes priority.

In order to identify which specific file is defining a view you can either use the Content Debugger plugin as explained above, or use the developer tools plugin by going to 'Develop' => 'Tools' => 'Inspect' => 'Views'

Matt Beckett

I'm a self-employed web developer, family man, nerd, scuba diver. Manager/maintainer of this elgg community site, and core Elgg development team member.