Admin panel 'view site' link to open in a new tab

How can we get the ‘view site’ link in the admin panel to open up in a new tab?


There is a simple answer to this, but I don’t think it’s very helpful without understanding why it works, so please try this:

  1. Activate your project’s virtual environment (e. g. ‘pipenv shell’ if using pipenv)
  2. Enter the python shell by using python shell
  3. Within the python shell:
    1. import django
    2. print(django.__path__)

That last command should print something like ['/Users/myuser/.local/share/virtualenvs/project_name-FovhbAOE/lib/python3.8/site-packages/django']. Copy the file path (e. g. /Users/myuser/.../django).

Open a new terminal window, and in this window use cd '/Users/myuser/.../django', pasting the file path that you copied above. You are now at the virtual environment’s copy of the django source code, so you can poke around and see what’s going on (you can also of course open the directory using your computer’s file explorer, or an IDE like Atom). This directory has all the information that’s used to build the ‘base functionality’ that Django comes with. In your case, you want to override one of the templates that the Django admin uses. So starting from the top directory of the django source code, you can go to contrib/admin/templates/admin/. To find the template file you want to change, I searched this ..templates/admin folder for any files containing the words ‘View site’. It turned out that the file ...templates/admin/base.html has this on line 40:
`{% trans ‘View site’ %} /

This means that you want to override the ‘…/base.html’ template file. How do you do that? You need to go to one of your project’s template directories, preferably (I’d say, in this case) a project-wide directory, like if you’ve specified one in your project/ file, in the dictionary in the TEMPLATES list, like this: 'DIRS': [os.path.join(BASE_DIR, 'templates')],.

Once you’ve decided on what template directory in your project you want to use:

  1. Create a subdirectory of the template directory named admin, e. g. project_directory/templates/admin.
  2. Make a copy of the django source code’s base.html template file and put it in ...templates/admin.
  3. When you’ve copied over the file, you can, in your project’s copy, change the relevant line (40 on my setup) to:
    <a href="{{ site_url }}" target="_blank">{% trans 'View site' %}</a> /

Now the link will open up in a new tab if you do runserver and go to the admin. The important part is target="_blank", which you can read about here.

Again, in the end all you do is create a subdirectory of a project template directory, copy a file to it, and then add two words on one line. But it’s useful to know how this general process works so you can solve similar tasks yourself.

If you don’t like poking around the source code on your computer, an alternative is to go to Django’s github repository and search for what you need there. I find it a bit harder to navigate, but I know some people prefer this way. And of course, you can find the relevant template there as well. Then all you have to do is copy all the contents over to a local base.html in a project template directory.

Also, the django docs have a general guide on how to override templates.