Add setting to open external links in new tab (#279)

coderedcms/migrations/0017_generalsettings_external_new_tab.py

@@ -0,0 +1,18 @@
+# Generated by Django 2.2.9 on 2019-12-27 20:33
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('coderedcms', '0016_auto_20191025_1620'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='generalsettings',
+            name='external_new_tab',
+            field=models.BooleanField(default=False, verbose_name='Open all external links in new tab'),
+        ),
+    ]

coderedcms/models/wagtailsettings_models.py

@@ -279,6 +279,10 @@ class GeneralSettings(BaseSetting):
         default=10,
         verbose_name=_('Number of results per page'),
     )
+    external_new_tab = models.BooleanField(
+        default=False,
+        verbose_name=_('Open all external links in new tab')
+    )
 
     panels = [
         MultiFieldPanel(
@@ -293,6 +297,12 @@ class GeneralSettings(BaseSetting):
             ],
             _('Search Settings')
         ),
+        MultiFieldPanel(
+            [
+                FieldPanel('external_new_tab'),
+            ],
+            _('Links')
+        ),
     ]
 
     class Meta:

coderedcms/static/coderedcms/js/codered-front.js

@@ -250,6 +250,21 @@ $(document).ready(function()
         });
     }
 
+    /*** Link handling ***/
+    if(typeof cr_external_new_tab !== 'undefined' && cr_external_new_tab) {
+        $('a').each(function() {
+            var href = $(this).prop('href').trim();
+            if(
+                !href.startsWith(cr_site_url) &&
+                !href.startsWith('/') &&
+                !href.startsWith('#') &&
+                !href.startsWith('?')
+            ) {
+                $(this).prop('target', '_blank');
+            }
+        });
+    }
+
 });
 
-/* @license-end */
+/* @license-end */

coderedcms/templates/coderedcms/pages/base.html

@@ -21,6 +21,12 @@
         {% endif %}
         {% endblock %}
 
+        {# Pass in CMS variables to JavaScript #}
+        <script>
+            cr_site_url = "{{request.site.root_url}}";
+            cr_external_new_tab = {{settings.coderedcms.GeneralSettings.external_new_tab|yesno:"true,false"}};
+        </script>
+
         <meta charset="utf-8" />
         <meta http-equiv="X-UA-Compatible" content="IE=edge" />
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

docs/how_to/index.rst

@@ -8,4 +8,5 @@ with CodeRed CMS.
 .. toctree::
     :maxdepth: 1
 
+    link_targets
     translation

docs/how_to/link_targets.rst

@@ -0,0 +1,15 @@
+Open External Links in New Tab
+==============================
+
+A common requirement by marketing teams is to force external links to open in
+a new tab, rather than to navigate the current tab. Wagtail has strong opinions
+against this practice, hence Wagtail does not provide the ability to set the
+``target`` attribute of links in rich text fields. But, the reality of the
+matter is that not everyone shares this opinion.
+
+CodeRed CMS provides a setting that will use JavaScript to open all external
+links, meaning any link not on the current domain, to open with
+``target='_blank'``:
+
+**Settings > General > Open all external links in
+new tab**

docs/releases/v0.17.0.rst

@@ -5,6 +5,8 @@ CodeRed CMS 0.17.0 release notes
 New features
 ------------
 
+* NEW setting to globally force all external links to open in a new tab. See
+  :doc:`/how_to/link_targets`.
 * Upgraded Wagtail to version 2.7
 * New UI of streamfield, and other changes from
   `Wagtail 2.7 <https://docs.wagtail.io/en/stable/releases/2.7.html>`_.

setup.cfg

@@ -1,3 +1,3 @@
 [flake8]
-exclude = coderedcms/project_template/*,migrations,schema.py
+exclude = coderedcms/project_template/*,coderedcms/migrations/*,schema.py
 max-line-length = 100