Extending Object Detail Views¶
Apps can inject custom content into certain areas of the detail views of applicable models. This is accomplished by subclassing TemplateExtension
, designating a particular Nautobot model, and defining the desired methods to render custom content. Four methods are available:
left_page()
- Inject content on the left side of the pageright_page()
- Inject content on the right side of the pagefull_width_page()
- Inject content across the entire bottom of the pagebuttons()
- Add buttons to the top of the pagedetail_tabs()
- Add extra tabs to the end of the list of tabs within the page tabs navigation
Additionally, a render()
method is available for convenience. This method accepts the name of a template to render, and any additional context data you want to pass. Its use is optional, however.
When a TemplateExtension is instantiated, context data is assigned to self.context
. Available data include:
object
- The object being viewedrequest
- The current requestsettings
- Global Nautobot settingsconfig
- App-specific configuration parameters
For example, accessing {{ request.user }}
within a template will return the current user.
Declared subclasses should be gathered into a list or tuple for integration with Nautobot. By default, Nautobot looks for an iterable named template_extensions
within a template_content.py
file. (This can be overridden by setting template_extensions
to a custom value on the app's NautobotAppConfig
.) An example is below.
# template_content.py
from django.urls import reverse
from nautobot.apps.ui import TemplateExtension
from .models import Animal
class LocationAnimalCount(TemplateExtension):
"""Template extension to display animal count on the right side of the page."""
model = 'dcim.location'
def right_page(self):
return self.render('nautobot_animal_sounds/inc/animal_count.html', extra_context={
'animal_count': Animal.objects.count(),
})
class DeviceExtraTabs(TemplateExtension):
"""Template extension to add extra tabs to the object detail tabs."""
model = 'dcim.device'
def detail_tabs(self):
"""
You may define extra tabs to render on a model's detail page by utilizing this method.
Each tab is defined as a dict in a list of dicts.
For each of the tabs defined:
- The <title> key's value will become the tab link's title.
- The <url> key's value is used to render the HTML link for the tab
These tabs will be visible (in this instance) on the Device model's detail page as
set by the DeviceContent.model attribute "dcim.device"
This example demonstrates defining two tabs. The tabs will be ordered by their position in list.
"""
return [
{
"title": "App Tab 1",
"url": reverse("plugins:example_plugin:device_detail_tab_1", kwargs={"pk": self.context["object"].pk}),
},
{
"title": "App Tab 2",
"url": reverse("plugins:example_plugin:device_detail_tab_2", kwargs={"pk": self.context["object"].pk}),
},
]
template_extensions = [DeviceExtraTabs, LocationAnimalCount]