浏览代码

Settings for Additional Tracking Scripts (#415)

* Added new fields for additional tracking scripts
* New MonospaceField and specified the attributes and style of the widget

Co-authored-by: Vince Salvino <salvino@coderedcorp.com>
Roxanna Coldiron 3 年之前
父节点
当前提交
e834914434

+ 13 - 2
coderedcms/fields.py

@@ -1,13 +1,24 @@
 from django.db import models
 
 from coderedcms.widgets import ColorPickerWidget
+from django.forms.widgets import Textarea
 
 
 class ColorField(models.CharField):
     def __init__(self, *args, **kwargs):
         kwargs['max_length'] = 255
-        super(ColorField, self).__init__(*args, **kwargs)
+        super().__init__(*args, **kwargs)
 
     def formfield(self, **kwargs):
         kwargs['widget'] = ColorPickerWidget
-        return super(ColorField, self).formfield(**kwargs)
+        return super().formfield(**kwargs)
+
+
+class MonospaceField(models.TextField):
+    def formfield(self, **kwargs):
+        kwargs["widget"] = Textarea(attrs={
+            "rows": 12,
+            "class": "monospace",
+            "spellcheck": "false",
+        })
+        return super().formfield(**kwargs)

+ 24 - 0
coderedcms/migrations/0021_auto_20210730_1637.py

@@ -0,0 +1,24 @@
+# Generated by Django 3.1.13 on 2021-07-30 20:37
+
+import coderedcms.fields
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('coderedcms', '0020_auto_20210527_1030'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='analyticssettings',
+            name='body_scripts',
+            field=coderedcms.fields.MonospaceField(blank=True, help_text='Add tracking scripts toward closing <body> tag.', null=True, verbose_name='<body> tracking scripts'),
+        ),
+        migrations.AddField(
+            model_name='analyticssettings',
+            name='head_scripts',
+            field=coderedcms.fields.MonospaceField(blank=True, help_text='Add tracking scripts between the <head> tags.', null=True, verbose_name='<head> tracking scripts'),
+        ),
+    ]

+ 57 - 0
coderedcms/models/tests/test_wagtailsettings_models.py

@@ -0,0 +1,57 @@
+from django.test import Client
+from wagtail.tests.utils import WagtailPageTests
+from wagtail.core.models import Site
+
+from coderedcms.tests.testapp.models import WebPage
+from coderedcms.models.wagtailsettings_models import AnalyticsSettings
+
+
+class AnalyticsSettingsTestCase(WagtailPageTests):
+    """
+    Test that the relevant analytics settings appear in the homepage HTML.
+    """
+
+    model = WebPage
+
+    def setUp(self):
+        # HTTP client.
+        self.client = Client()
+
+        # Use home page and default site.
+        self.site = Site.objects.filter(is_default_site=True)[0]
+        self.homepage = WebPage.objects.get(url_path="/home/")
+
+        # Populate settings.
+        self.settings = AnalyticsSettings.for_site(self.site)
+        self.settings.ga_tracking_id = "UA-123"
+        self.settings.head_scripts = "<script>evil_tracker</script>"
+        self.settings.body_scripts = "<script>annoying_tracker</script>"
+        self.settings.save()
+
+    def test_get(self):
+        """
+        Tests to make sure the page serves a 200 from a GET request.
+        """
+        response = self.client.get(self.homepage.url, follow=True)
+        self.assertEqual(response.status_code, 200)
+
+    def test_ga_tracking_id(self):
+        """
+        Make sure the ga_tracking_id is present.
+        """
+        response = self.client.get(self.homepage.url, follow=True)
+        self.assertIn(self.settings.ga_tracking_id, str(response.content), 1)
+
+    def test_head_scripts(self):
+        """
+        Make sure the head_scripts is present.
+        """
+        response = self.client.get(self.homepage.url, follow=True)
+        self.assertInHTML(self.settings.head_scripts, str(response.content), 1)
+
+    def test_body_scripts(self):
+        """
+        Make sure the body_scripts is present.
+        """
+        response = self.client.get(self.homepage.url, follow=True)
+        self.assertInHTML(self.settings.body_scripts, str(response.content), 1)

+ 20 - 0
coderedcms/models/wagtailsettings_models.py

@@ -12,6 +12,7 @@ from wagtail.images.edit_handlers import ImageChooserPanel
 from wagtail.contrib.settings.models import BaseSetting, register_setting
 from wagtail.images import get_image_model_string
 
+from coderedcms.fields import MonospaceField
 from coderedcms.settings import cr_settings
 
 
@@ -226,6 +227,18 @@ class AnalyticsSettings(BaseSetting):
         verbose_name=_('Track button clicks'),
         help_text=_('Track all button clicks using Google Analytics event tracking. Event tracking details can be specified in each button’s advanced settings options.'),  # noqa
     )
+    head_scripts = MonospaceField(
+        blank=True,
+        null=True,
+        verbose_name=_('<head> tracking scripts'),
+        help_text=_('Add tracking scripts between the <head> tags.'),
+    )
+    body_scripts = MonospaceField(
+        blank=True,
+        null=True,
+        verbose_name=_('<body> tracking scripts'),
+        help_text=_('Add tracking scripts toward closing <body> tag.'),
+    )
 
     panels = [
         MultiFieldPanel(
@@ -234,6 +247,13 @@ class AnalyticsSettings(BaseSetting):
                 FieldPanel('ga_track_button_clicks'),
             ],
             heading=_('Google Analytics')
+        ),
+        MultiFieldPanel(
+            [
+                FieldPanel('head_scripts'),
+                FieldPanel('body_scripts'),
+            ],
+            heading=_('Other Tracking Scripts')
         )
     ]
 

+ 2 - 2
coderedcms/static/coderedcms/css/codered-admin.css

@@ -1,6 +1,6 @@
 /*
 CodeRed CMS (https://www.coderedcorp.com/cms/)
-Copyright 2018-2019 CodeRed LLC
+Copyright 2018-2021 CodeRed LLC
 License: https://github.com/coderedcorp/coderedcms/blob/dev/LICENSE
 */
 
@@ -11,7 +11,7 @@ html, body {
     background-color:#fff;
     font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif !important;
 }
-code, pre,
+code, pre, textarea.monospace,
 .monospace textarea {
     font-family: SFMono-Regular,Menlo,Monaco,Consolas,monospace;
 }

+ 1 - 1
coderedcms/static/coderedcms/css/codered-editor.css

@@ -1,6 +1,6 @@
 /*
 CodeRed CMS (https://www.coderedcorp.com/cms/)
-Copyright 2018-2019 CodeRed LLC
+Copyright 2018-2021 CodeRed LLC
 License: https://github.com/coderedcorp/coderedcms/blob/dev/LICENSE
 */
 

+ 1 - 1
coderedcms/static/coderedcms/scss/codered-front.scss

@@ -3,7 +3,7 @@
 ///
 /*
 CodeRed CMS (https://www.coderedcorp.com/cms/)
-Copyright 2018-2019 CodeRed LLC
+Copyright 2018-2021 CodeRed LLC
 License: https://github.com/coderedcorp/coderedcms/blob/dev/LICENSE
 */
 

+ 9 - 0
coderedcms/templates/coderedcms/pages/base.html

@@ -20,6 +20,9 @@
               gtag('config', '{{settings.coderedcms.AnalyticsSettings.ga_tracking_id}}');
             </script>
         {% endif %}
+        {% if settings.coderedcms.AnalyticsSettings.head_scripts %}
+            {{settings.coderedcms.AnalyticsSettings.head_scripts|safe}}
+        {% endif %}
         {% endblock %}
 
         {# Pass in CMS variables to JavaScript #}
@@ -196,5 +199,11 @@
             {% endblock %}
             {% block struct_seo_extra %}{% endblock %}
         {% endif %}
+
+        {% block body_tracking_scripts %}
+        {% if settings.coderedcms.AnalyticsSettings.body_scripts %}
+            {{settings.coderedcms.AnalyticsSettings.body_scripts|safe}}
+        {% endif %}
+        {% endblock %}
     </body>
 </html>

+ 53 - 0
docs/how_to/add_tracking_scripts.rst

@@ -0,0 +1,53 @@
+Add Tracking Scripts
+====================
+
+Tracking scripts, such as like Google Analytics or Facebook Pixels, can be added
+to the ``<head>`` and ``<body>`` of all of your web pages.
+
+Tracking settings are located in the Wagtail Admin dashboard under
+**Settings > Tracking**.
+
+
+Google Analytics
+----------------
+
+For Google Analytics, all you need is the **GA Tracking ID**. Copy and paste this ID into the field.
+Then, if you want to track button clicks, just click the checkbox. Save and you're done!
+
+
+Other Scripts
+-------------
+
+If you have other tracking codes to add, follow these steps:
+
+#. In the Wagtail admin, go to **Settings > Tracking**.
+
+#. The tracking scripts will usually give you instructions of where to place
+   them. So, make sure to verify the instructions that were given to you.
+
+#. Copy and paste scripts that should be between the ``<head>`` tags in the box
+   labeled for ``<head>`` scripts.
+
+#. Copy and paste scripts that should be toward the closing ``<body>`` tag in
+   the box labeled for ``<body>`` scripts.
+
+#. Click **Save** and you're done!
+
+
+.. figure:: img/head-body-scripts-widgets.png
+    :alt: The TRACKING dashboard.
+
+    The tracking dashboard.
+
+.. note::
+
+    You can verify that the scripts on the web page by going to the site and inspecting the Source Code.
+    Then search for the ``<script>`` tags, either visually or by hitting ``CTRL + F`` on your keyboard
+    and searching for the code.
+    Here's how to get the Source Code if you are not sure:
+
+    * Firefox: https://developer.mozilla.org/en-US/docs/Tools/View_source
+
+    * Chrome: https://support.google.com/surveys/answer/6172725?hl=en
+
+    * IE/Edge: https://docs.microsoft.com/en-us/microsoft-edge/devtools-guide-chromium/resources/

二进制
docs/how_to/img/head-body-scripts-widgets.png


+ 1 - 0
docs/how_to/index.rst

@@ -9,6 +9,7 @@ with CodeRed CMS.
     :maxdepth: 1
 
     headers_and_footers
+    add_tracking_scripts
     link_targets
     translation
     docker

+ 7 - 0
docs/releases/v0.21.0.rst

@@ -7,6 +7,13 @@ New features
 
 * Upgraded to Wagtail 2.13
 
+* Added new ``<head>`` and ``<body>`` tracking script settings. See
+  :doc:`/how_to/add_tracking_scripts`.
+
+* Added new ``coderedcms.fields.MonospaceField`` for rendering text area fields
+  in the Wagtail admin with monospace input and spell-checking disabled. This is
+  used by the new tracking settings and is useful for implementing code-oriented
+  fields.
 
 Upgrade considerations
 ----------------------