Move custom image filter to extendig Wagtail section

docs/extending/custom_image_filters.md

@@ -0,0 +1,38 @@
+(custom_image_filters)=
+
+# Custom image filters
+
+Wagtail comes with [various image operations](image_tag). To add custom image operation, add `register_image_operations` hook to your `wagtail_hooks.py` file.
+
+In this example, the `willow.image` is a Pillow Image instance. If you use another image library, or like to support multiple image libraries, you need to update the filter code accordingly. See the [Willow documentation](https://willow.readthedocs.io/en/latest/index.html) for more information.
+
+```python
+from PIL import ImageFilter
+
+from wagtail import hooks
+from wagtail.images.image_operations import FilterOperation
+
+
+class BlurOperation(FilterOperation):
+    def construct(self, radius):
+        self.radius = int(radius)
+
+    def run(self, willow, image, env):
+        willow.image = willow.image.filter(ImageFilter.GaussianBlur(radius=self.radius))
+        return willow
+
+
+@hooks.register("register_image_operations")
+def register_image_operations():
+    return [
+        ("blur", BlurOperation),
+    ]
+```
+
+Use the filter in a template, like so:
+
+```html+Django
+{% load wagtailimages_tags %}
+
+{% image page.photo width-400 blur-7 %}
+```

docs/extending/index.md

@@ -17,6 +17,7 @@ custom_tasks
 audit_log
 custom_account_settings
 customising_group_views
+custom_image_filters
 rich_text_internals
 extending_draftail
 custom_bulk_actions

docs/reference/hooks.md

@@ -1418,3 +1418,13 @@ def additional_log_actions(actions):
 ```{versionchanged} 2.15
 The ``LogFormatter`` class was introduced. Previously, dynamic messages were achieved by passing a callable as the ``message`` argument to ``register_action``.
 ```
+
+## Images
+
+(register_image_operations)=
+
+### `register_image_operations`
+
+Called on start-up. Register image operations that can be used to create renditions.
+
+See [](custom_image_filters).

docs/topics/images.md

@@ -414,41 +414,6 @@ Note that this will have no effect on PNG or GIF files. If you want all images t
 {% image page.photo width-400 format-webp webpquality-50 %}
 ```
 
-### Custom image filter
-
-In `wagtail_hooks.py` register your custom image filter.
-
-This example assumes Willow in combination with Pillow. If you use another image library, or like to support multiple image libraries, you need to update the code inside the run method. See the [Willow documentation](https://willow.readthedocs.io/en/latest/index.html) for more information.
-
-```python
-from PIL import ImageFilter
-
-from wagtail import hooks
-from wagtail.images.image_operations import FilterOperation
-
-
-class BlurOperation(FilterOperation):
-    def construct(self, radius):
-        self.radius = int(radius)
-
-    def run(self, willow, image, env):
-        willow.image = willow.image.filter(ImageFilter.GaussianBlur(radius=self.radius))
-        return willow
-
-
-@hooks.register("register_image_operations")
-def register_image_operations():
-    return [
-        ("blur", BlurOperation),
-    ]
-```
-
-In your template:
-
-```html+Django
-{% image page.photo width-400 blur-7 %}
-```
-
 ### Generating image renditions in Python
 
 All of the image transformations mentioned above can also be used directly in Python code.