diff --git a/cdhweb/pages/templates/cdhpages/blocks/feature_block.html b/cdhweb/pages/templates/cdhpages/blocks/feature_block.html index 32cf15b0..6fad018a 100644 --- a/cdhweb/pages/templates/cdhpages/blocks/feature_block.html +++ b/cdhweb/pages/templates/cdhpages/blocks/feature_block.html @@ -9,9 +9,9 @@

{{ self.heading }}

{% endif %} - {% image self.image width-750 format-webp as img_base %} - {% image self.image width-1200 format-webp as img_sm %} - {% image self.image width-1400 format-webp as img_md %} + {% image self.image width-750 as img_base %} + {% image self.image width-1200 as img_sm %} + {% image self.image width-1400 as img_md %} diff --git a/cdhweb/pages/templates/cdhpages/blocks/image_block.html b/cdhweb/pages/templates/cdhpages/blocks/image_block.html index 65f86095..71eee2ef 100644 --- a/cdhweb/pages/templates/cdhpages/blocks/image_block.html +++ b/cdhweb/pages/templates/cdhpages/blocks/image_block.html @@ -1,20 +1,20 @@ {% load wagtailcore_tags wagtailimages_tags l10n %} {% if self.size == 'small' %} - {% image self.image width-500 format-webp as img_base %} - {% image self.image width-700 format-webp as img_sm %} - {% image self.image width-750 format-webp as img_md %} - {% image self.image width-1000 format-webp as img_xl %} + {% image self.image width-500 as img_base %} + {% image self.image width-700 as img_sm %} + {% image self.image width-750 as img_md %} + {% image self.image width-1000 as img_xl %} {% elif self.size == 'medium' %} - {% image self.image width-750 format-webp as img_base %} - {% image self.image width-1200 format-webp as img_md %} - {% image self.image width-1700 format-webp as img_xxl %} + {% image self.image width-750 as img_base %} + {% image self.image width-1200 as img_md %} + {% image self.image width-1700 as img_xxl %} {% else %} - {% image self.image width-1000 format-webp as img_base %} - {% image self.image width-1500 format-webp as img_sm %} - {% image self.image width-1700 format-webp as img_md %} - {% image self.image width-2000 format-webp as img_xl %} - {% image self.image width-2300 format-webp as img_xxxl %} + {% image self.image width-1000 as img_base %} + {% image self.image width-1500 as img_sm %} + {% image self.image width-1700 as img_md %} + {% image self.image width-2000 as img_xl %} + {% image self.image width-2300 as img_xxxl %} {% endif %}
diff --git a/cdhweb/settings/components/base.py b/cdhweb/settings/components/base.py index bb04411a..1a44566b 100644 --- a/cdhweb/settings/components/base.py +++ b/cdhweb/settings/components/base.py @@ -315,6 +315,16 @@ {"class": "cdhweb.pages.embed_finders.GlitchHubEmbedFinder"}, ] +WAGTAILIMAGES_WEBP_QUALITY = 80 + +WAGTAILIMAGES_FORMAT_CONVERSIONS = { + "avif": "avif", + "gif": "gif", + "bmp": "webp", + "jpeg": "webp", + "png": "webp", + "webp": "webp", +} # List of allowed tags in the rich text editor (tinyMCE). We need to add the # HTML5
, as it's not included by default. diff --git a/templates/cdhpages/blocks/tile.html b/templates/cdhpages/blocks/tile.html index 735d7258..0321bba5 100644 --- a/templates/cdhpages/blocks/tile.html +++ b/templates/cdhpages/blocks/tile.html @@ -72,18 +72,18 @@
{% if tile_type == 'internal_page_tile' %} {% if internal_page.specific.feed_image %} - {% image internal_page.specific.feed_image fill-900x493 format-webp as image %} + {% image internal_page.specific.feed_image fill-900x493 as image %} {{ image.alt }} {% elif internal_page.specific.hero_image %} - {% image internal_page.specific.hero_image fill-900x493 format-webp as image %} + {% image internal_page.specific.hero_image fill-900x493 as image %} {{ image.alt }} {% elif internal_page.specific.image %} - {% image internal_page.specific.image fill-900x493 format-webp as image %} + {% image internal_page.specific.image fill-900x493 as image %} {{ image.alt }} {% endif %} {% else %} {% if tile.value.image %} - {% image tile.value.image fill-900x493 format-webp as image %} + {% image tile.value.image fill-900x493 as image %} {{ image.alt }} {% endif %} {% endif %} diff --git a/templates/includes/event_hero.html b/templates/includes/event_hero.html index c258a68d..541e57ba 100644 --- a/templates/includes/event_hero.html +++ b/templates/includes/event_hero.html @@ -65,9 +65,9 @@

Speakers

of via inline style. {% endcomment %} - {% image self.image fill-1000x563 format-webp as img_base %} - {% image self.image fill-1250x703 format-webp as img_sm %} - {% image self.image fill-1650x928 format-webp as img_xl %} + {% image self.image fill-1000x563 as img_base %} + {% image self.image fill-1250x703 as img_sm %} + {% image self.image fill-1650x928 as img_xl %} diff --git a/templates/includes/person_hero.html b/templates/includes/person_hero.html index 98852b1f..eb23ce31 100644 --- a/templates/includes/person_hero.html +++ b/templates/includes/person_hero.html @@ -55,9 +55,9 @@

{{ self.title}}

If changing this by image rendition, update aspect-ratio in the CSS instead of via inline style. {% endcomment %} - {% image page.image fill-1000x750 format-webp as img_base %} - {% image page.image fill-1250x938 format-webp as img_sm %} - {% image page.image fill-1650x1238 format-webp as img_xl %} + {% image page.image fill-1000x750 as img_base %} + {% image page.image fill-1250x938 as img_sm %} + {% image page.image fill-1650x1238 as img_xl %} diff --git a/templates/includes/project_hero.html b/templates/includes/project_hero.html index b45f4826..8b5a5e41 100644 --- a/templates/includes/project_hero.html +++ b/templates/includes/project_hero.html @@ -34,9 +34,9 @@

{{ self.title}}

of via inline style. {% endcomment %} - {% image self.hero_image fill-1000x563 format-webp as img_base %} - {% image self.hero_image fill-1250x703 format-webp as img_sm %} - {% image self.hero_image fill-1650x928 format-webp as img_xl %} + {% image self.hero_image fill-1000x563 as img_base %} + {% image self.hero_image fill-1250x703 as img_sm %} + {% image self.hero_image fill-1650x928 as img_xl %} diff --git a/templates/includes/standard_hero.html b/templates/includes/standard_hero.html index e57becc6..90cfad38 100644 --- a/templates/includes/standard_hero.html +++ b/templates/includes/standard_hero.html @@ -16,9 +16,9 @@

{{ self.title}}

of via inline style. {% endcomment %} - {% image self.hero_image fill-1000x563 format-webp as img_base %} - {% image self.hero_image fill-1250x703 format-webp as img_sm %} - {% image self.hero_image fill-1650x928 format-webp as img_xl %} + {% image self.hero_image fill-1000x563 as img_base %} + {% image self.hero_image fill-1250x703 as img_sm %} + {% image self.hero_image fill-1650x928 as img_xl %}