{"id":4213,"date":"2021-12-09T11:06:34","date_gmt":"2021-12-09T11:06:34","guid":{"rendered":"https:\/\/blogs.kent.ac.uk\/webdev\/?p=4213"},"modified":"2021-12-09T11:12:04","modified_gmt":"2021-12-09T11:12:04","slug":"site-editor-updates-9-december","status":"publish","type":"post","link":"https:\/\/blogs.kent.ac.uk\/webdev\/2021\/12\/09\/site-editor-updates-9-december\/","title":{"rendered":"Site Editor Updates &#8211; 9 December"},"content":{"rendered":"<p>In our latest release we&#8217;re adding our usual minor website fixes and tweaks, along with two key new features: a new version of the Image Group Panel, and better display of page errors in Site Editor.<\/p>\n<h2>Image Group Panel<\/h2>\n<p>The Image Group Panel is an existing block (it&#8217;s currently called &#8216;Image panel group&#8217;). It lets you combine a small amount of text and call-to-action buttons with four images.<\/p>\n<figure id=\"attachment_4215\" aria-describedby=\"caption-attachment-4215\" style=\"width: 900px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-08-at-15.18.58.png\"><img loading=\"lazy\" class=\"wp-image-4215\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-08-at-15.18.58.png\" alt=\"\" width=\"900\" height=\"513\" \/><\/a><figcaption id=\"caption-attachment-4215\" class=\"wp-caption-text\">The original Image Group Panel let you have some text with an optional button, and four images.<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>The new version gives you a bit more choice:<\/p>\n<ul>\n<li>a range of different background colours, consistent with other feature-type panels<\/li>\n<li>2, 3 or 4 images<\/li>\n<li>an option for a thinner arrangement of images<\/li>\n<li>options for centred or left-aligned text<\/li>\n<\/ul>\n<p>In addition the new panel can be used at the top of a page to give a bit of a different feel and visual interest to a page.<\/p>\n<p>You can read more about Image Group Panels on our <a href=\"https:\/\/staff.kent.ac.uk\/digital\/example-site\/image-group-panel\">block example page<\/a>.<\/p>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_4216\" aria-describedby=\"caption-attachment-4216\" style=\"width: 900px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-07-at-08.48.44.png\"><img loading=\"lazy\" class=\"wp-image-4216\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-07-at-08.48.44.png\" alt=\"\" width=\"900\" height=\"434\" \/><\/a><figcaption id=\"caption-attachment-4216\" class=\"wp-caption-text\">The new version of the block lets you alter the number and layout of images, choose background colours, and change the alignment of the text.<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<h2>Page error display<\/h2>\n<p>We recently updated the block sidebar to show all the fields collapsed down into field groups. A side effect of this was that any errors were now hidden inside the collapsed sections. You could only see them by opening up all the sections.<\/p>\n<p>To fix this we&#8217;ve introduced sections coloured red to make it clearer where the errors are. When you click on an error notification, you jump straight to the field with the error as before.<\/p>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_4217\" aria-describedby=\"caption-attachment-4217\" style=\"width: 500px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-08-at-15.33.18.png\"><img loading=\"lazy\" class=\"wp-image-4217\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-08-at-15.33.18.png\" alt=\"\" width=\"500\" height=\"592\" \/><\/a><figcaption id=\"caption-attachment-4217\" class=\"wp-caption-text\">Field groups are highlighted in red where there&#8217;s a problem.<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>We&#8217;ve also added a red dotted border round each block in the editor which has an error, to make it clearer roughly where the errors are in a page.<\/p>\n<p>&nbsp;<\/p>\n<figure id=\"attachment_4218\" aria-describedby=\"caption-attachment-4218\" style=\"width: 900px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-08-at-15.33.41.png\"><img loading=\"lazy\" class=\"wp-image-4218\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2021\/12\/Screenshot-2021-12-08-at-15.33.41.png\" alt=\"\" width=\"900\" height=\"553\" \/><\/a><figcaption id=\"caption-attachment-4218\" class=\"wp-caption-text\">Blocks which have errors in them now have a dotted red border round them, so it&#8217;s easier finding where problems are in a page.<\/figcaption><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>In our latest release we&#8217;re adding our usual minor website fixes and tweaks, along with two key new features: a new version of the Image &hellip; <a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/2021\/12\/09\/site-editor-updates-9-december\/\">Read&nbsp;more<\/a><\/p>\n","protected":false},"author":2,"featured_media":4216,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[8337,79486],"tags":[521,79485,23153],"_links":{"self":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/4213"}],"collection":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/comments?post=4213"}],"version-history":[{"count":6,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/4213\/revisions"}],"predecessor-version":[{"id":4275,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/4213\/revisions\/4275"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media\/4216"}],"wp:attachment":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media?parent=4213"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/categories?post=4213"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/tags?post=4213"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}