Skip to main content
  1. Posts/

Nautobot: Custom Links

·933 words·5 mins

One of my favorite features of Nautobot that may not be well known is the capability to put a button on pages that take you to other locations. This can be helpful when lining up the source of truth as that first place that you go, the idea of adding custom links will just help to enforce that as the first place to go. When you look at the idea of a source of truth to help feed other systems, you start to see the topology like below.

Nautobot Source of Truth for Other Systems

The documentation for creating your own custom links is here: https://docs.nautobot.com/projects/core/en/stable/user-guide/platform-functionality/customlink/

Custom Links are built in the Nautobot UI under the Extensibility menu. Let’s build a basic button on the demo instance of Nautobot. Let’s build a link for Locations that will point to the Nautobot docs page as an example. Some ideas for actual implementations include links to site dashboards in your monitoring tool, or a link on a circuit to the portal page, or a link to CI data inside of your ITSM tool for a device.

  1. Navigate and log into https://demo.nautobot.com (Log in credentials are on the site, as of now demo/nautobot)
  2. On the left hand navigation menu, select EXTENSIBILITY and then select Custom Links
    Nautobot Extensibility
  3. The site by default does not have any links, there may be a few that demo users create themselves.
    Custom Links without any links present
  4. Select +Add on the upper right
  5. Fill out the form with the following:
    FieldValueDescription
    Content Typedcim | locationWhat Nautobot data type this applies to.
    NameSite LinkThe name of the custom link.
    TextNautobot DocsWhat the button should say.
    URLhttps://docs.nautobot.comWhat the link is sending to.
    Weight100This helps tweak where the link will appear in relation to other links.
    Group NameIf you want to group links together.
    Button ClassInfo (Aqua)This colors the button for the link.
    New WindowCheckedOpens the link in a new tab/window.

Custom Link Build

Click on Create on the bottom. This will create the link. Now when you navigate to a Location, you will now see a button on the upper right that will say Nautobot Docs that will take you to the Nautobot documentation pages.

Nautobot Location with Button

One of the awesome things that comes along with the Custom Links is the ability to put some logic into the text that you put there, such as only show the button if it is a particular device type, or manufacturer. This may also play in with systems that are part of a controller based system. Perhaps a link to Arista CloudVision if the device is an Arista device. I have done links to Grafana dashboards using the Modern Telemetry system that we have deployed, only if the device is of a particular device type that would be created to be in the monitoring solution.

Let’s make two more links using the same steps above, but with the custom logic of a link to CloudVision when the device manufacturer is Arista. If the device manufacturer is Cisco then link to the Cisco controller. In both instances for the demo, it will be a link to the manufacturer’s webpage. The custom text we will want is the following (will be a single line in the text of the button):

{% if obj.device_type.manufacturer.name == "Arista" %}
CloudVision
{% endif %}
FieldValueDescription
Content Typedcim | deviceWhat Nautobot data type this applies to.
NameArista CloudVisionThe name of the custom link.
Text{% if obj.device_type.manufacturer.name == “Arista” %}CloudVision{% endif %}What the button should say.
URLhttps://www.arista.com/en/products/eos/eos-cloudvisionWhat the link is sending to.
Weight100This helps tweak where the link will appear in relation to other links.
Group NameIf you want to group links together.
Button ClassWarning (Orange)This colors the button for the link.
New WindowCheckedOpens the link in a new tab/window.

CloudVision Button

{% if obj.device_type.manufacturer.name == "Cisco" %}
Cisco
{% endif %}
FieldValueDescription
Content Typedcim | deviceWhat Nautobot data type this applies to.
NameCiscoThe name of the custom link.
Text{% if obj.device_type.manufacturer.name == “Cisco” %}Cisco{% endif %}What the button should say.
URLhttps://www.cisco.comWhat the link is sending to.
Weight100This helps tweak where the link will appear in relation to other links.
Group NameIf you want to group links together.
Button ClassWarning (Orange)This colors the button for the link.
New WindowCheckedOpens the link in a new tab/window.

Cisco Button

Demonstration #

Now when you navigate to devices on Nautobot, when the device type manufacturer is present, you have new buttons that are available. Taking a look at an Arista device you now see the CloudVision button the top right.

Arista Device with Button

And when you navigate to a Cisco device as expected you have the Cisco button.

Cisco Device with button

Summary #

Nautobot’s Custom Links are a valuable part of building out the Network Automation Source of Truth. Knowing that there are going to be other systems, it is good to link to those other systems to help speed access to the particular device types. This is one more thing that will help drive the source of truth concept that is valuable inside of an organization, by allowing it to be a starting point of what the system should look like, and quickly accessing other data points that would be of value. I personally am a big fan of the Custom Links and have been driving them for a while. Custom Links are available in all versions of Nautobot.

Thanks for reading!

-Josh