CODEWITHSUNDEEP
wagtailwagtail-admin
commadelimited
commadelimited

Reputation: 5119

Remove "Internal link" option from Wagtail RichTextField link picker

My company is running Wagtail as a headless API, using it more as a way to store bits of content rather than entire pages. As such there's the occasional feature that doesn't make sense for us. In this case it's the "internal link" feature. Since we don't manage "pages" per se I'd like to remove this option from the chooser found on the rich text field, as seen below.

enter image description here

I've identified several admin templates which could be overridden to remove this functionality, but I wanted to first see if there's something which can simply disable this "internal link" option so that it just doesn't even show up.

The _link_types.html template would allow me to remove Internal Link as a choice, but it appears Wagtail defaults to Internal Link which means that even if the option is gone, the Internal Link chooser still shows up. Barring a simple option that can be toggled off, where should I be looking to default selection to External Link?

Upvotes: 5

Views: 1124

Answers (1)

LB Ben Johnston
LB Ben Johnston

Reputation: 5196

Below is an approach, it kind of feels a bit hacky and it would be great if there was a more natural way to do this but hopefully this helps.

See the documentation for an explanation of the Wagtail Hooks.

Step 1 - hide the internal link option

  • Use the hook insert_editor_css to inject some css to 'hide' the first link.
  • This achieves the same goal as the _link_types template override you have attempted but 'scopes' this to the editor modal only.
  • This is important as you want to avoid breaking the 'move page' and scenarios where the page chooser will be shown. The css feels a bit hacky but hopefully gets the job done.

Step 2 - override the internal link option to external link for modals

  • Use the hook insert_editor_js to override the window.chooserUrls.pageChooser value, this will again be on the editor page only & for the modals only.
  • Set this value to the new 'default' you want, in the code below we have set this to the external link option.
  • You can see how these values are set globally in the editor_js.html template.

Code


# file: wagtail_hooks.py

from django.contrib.staticfiles.templatetags.staticfiles import static
from django.utils.html import format_html
from django.urls import reverse

from wagtail.core import hooks


@hooks.register('insert_editor_css')
def editor_css():
    """Add /static/css/admin.css to the admin."""
    return format_html(
        '<link rel="stylesheet" href="{}">',
        static("css/admin.css")
    )


@hooks.register('insert_editor_js')
def editor_js():
    return format_html(
        """
        <script>
            window.chooserUrls.pageChooser = '{}';
        </script>
        """,
        reverse('wagtailadmin_choose_page_external_link')
    )

/* file: static/css/admin.css */

.modal-content .link-types :first-child {
  /* hide the 'internal' link option from the page chooser */
  display: none;
}

.modal-content .link-types {
  /* ensure the 'before' element can be positioned absolute */
  position: relative;
}

.modal-content .link-types::before {
  /* hide the left '|' bar */
  background: white;
  bottom: 0;
  content: '';
  left: 0;
  position: absolute;
  top: 0;
  width: 5px;
}

Upvotes: 3

Related Questions