Exercise 9: Overriding a pattern TTW#


This exercise requires a working buildout using a fork of the collective.jstraining package.

In this exercise we will be overriding a pattern through the web.

You will be working in the exercise9 directory of the collective.jstraining package.


Overriding resources through the web is limited to resources using the ++plone++ namespace. For more information read https://5.docs.plone.org/adapt-and-extend/theming/resourceregistry.html#the-plone-traversal-namespace


In this exercise, we will first run the installation

  1. Start up your Plone instance

  2. Install the Exercise 9 add-on

Try current pattern#

Add a new page, and using the source code editor add a <p> element with the exercise9 pattern

<p class="pat-exercise9">test</p>

After saving, you should see test Exercise 9 was here

Choose the pattern to override#

Go to the Site Setup, then to the Resource Registries.

Under the Overrides tab, pick ++plone++exercise9/pattern.js.

Now modify the line:

that.$el.append(' <span>Exercise 9 was here</span>');

To be

that.$el.append(' <span>Exercise 9 has been overridden</span>');

Recompile bundle#

Go back to the Registry tab, and find the exercise9 bundle.

Click the Build button. Finally, click Build it


Now, if you go back to the page you added before, you should now see test Exercise 9 has been overridden.