{"id":3786,"date":"2020-08-24T16:23:32","date_gmt":"2020-08-24T15:23:32","guid":{"rendered":"https:\/\/blogs.kent.ac.uk\/webdev\/?p=3786"},"modified":"2021-04-19T16:20:04","modified_gmt":"2021-04-19T15:20:04","slug":"site-editor-upcoming-changes","status":"publish","type":"post","link":"https:\/\/blogs.kent.ac.uk\/webdev\/2020\/08\/24\/site-editor-upcoming-changes\/","title":{"rendered":"Site Editor &#8211; upcoming changes"},"content":{"rendered":"<p class=\"lead\">We&#8217;re changing student and staff links and added a few improvements to existing blocks. <\/p>\n<h2>Student and staff links change<\/h2>\n<p>We&#8217;ve updated the student and staff links which you can see on the top right of the homepage.<\/p>\n<p>These will now <strong>link directly to the student and staff guides<\/strong> where popular links can be found at the top of those pages.<\/p>\n<p>All other links and broader help topics will be found by following the help buttons on the student and staff guide pages.<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/student-staff-links.jpg\"><img loading=\"lazy\" class=\"alignnone size-large wp-image-3810\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/student-staff-links-1024x718.jpg\" alt=\"\" width=\"1024\" height=\"718\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/student-staff-links-1024x718.jpg 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/student-staff-links-300x210.jpg 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/student-staff-links-768x538.jpg 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/student-staff-links.jpg 1358w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<h2><\/h2>\n<h2>Image panels<\/h2>\n<p>We&#8217;ve introduced the angled design to the Image panel. This is to align it with the diagonal design element that has started to be used more prominently in marketing.<\/p>\n<p>The existing blue title block will change to an angled design.<\/p>\n<p>There will now be options for different colours to reflect the &#8216;energy palette&#8217; where appropriates.<\/p>\n<p>All these blocks will be able to have the slash design idea, again in different colours.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/panels.jpg\"><img loading=\"lazy\" class=\"alignnone wp-image-3793 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/panels-1024x942.jpg\" alt=\"Screenshot of image panels\" width=\"1024\" height=\"942\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/panels-1024x942.jpg 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/panels-300x276.jpg 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/panels-768x707.jpg 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/panels.jpg 1087w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/thumbnail_Screenshot-2020-07-15-at-10.01.13.png\"><img loading=\"lazy\" class=\"alignnone wp-image-3792 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/thumbnail_Screenshot-2020-07-15-at-10.01.13-1024x458.png\" alt=\"Screenshot of image panel\" width=\"1024\" height=\"458\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/thumbnail_Screenshot-2020-07-15-at-10.01.13-1024x458.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/thumbnail_Screenshot-2020-07-15-at-10.01.13-300x134.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/thumbnail_Screenshot-2020-07-15-at-10.01.13-768x344.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/thumbnail_Screenshot-2020-07-15-at-10.01.13.png 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<h2>Editorial panel<\/h2>\n<p>We&#8217;ve updated the editorial panel which now includes the slash design element and additional colour and overlay options.<\/p>\n<p>You can choose dark or light text and solid or translucent background depending on what works with your image.\u00a0 We&#8217;ve increased the amount of text you can have and can also have two featured buttons.<\/p>\n<p>You can also use the Editorial panel as a header element on the page.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1.png\"><img loading=\"lazy\" class=\"alignnone wp-image-3796 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1-1024x428.png\" alt=\"Screenshot of editorial panel\" width=\"1024\" height=\"428\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1-1024x428.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1-300x125.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1-768x321.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1.png 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a> <a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download.png\"><img loading=\"lazy\" class=\"alignnone wp-image-3797 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1024x437.png\" alt=\"Screenshot of editorial panel\" width=\"1024\" height=\"437\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-1024x437.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-300x128.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-768x328.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download.png 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a> <a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-2.png\"><img loading=\"lazy\" class=\"alignnone wp-image-3798 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-2-1024x451.png\" alt=\"Screenshot of editorial panel\" width=\"1024\" height=\"451\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-2-1024x451.png 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-2-300x132.png 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-2-768x338.png 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/download-2.png 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/editorial.jpg\"><img loading=\"lazy\" class=\"alignnone wp-image-3799 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/editorial-1024x451.jpg\" alt=\"Screenshot of editorial panel\" width=\"1024\" height=\"451\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/editorial-1024x451.jpg 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/editorial-300x132.jpg 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/editorial-768x338.jpg 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/editorial.jpg 1087w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<h2>Icons blocks<\/h2>\n<p>You\u2019ll also see some changes for icons. You&#8217;ll be able to use the energy colours for these, either solid or inverted. And also not have rings around icons so you can use special icons such as ones like Stay Safe.<\/p>\n<p>You can still use the existing simple blue design, so these are just some extra options to help add impact to a page.<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/icons.jpg\"><img loading=\"lazy\" class=\"alignnone wp-image-3808 size-large\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/icons-796x1024.jpg\" alt=\"Screenshot of icon card variations and colours\" width=\"796\" height=\"1024\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/icons-796x1024.jpg 796w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/icons-233x300.jpg 233w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/icons-768x988.jpg 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/icons.jpg 1280w\" sizes=\"(max-width: 796px) 100vw, 796px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<h2>Image cards<\/h2>\n<p>We&#8217;ve also updated standard image card panels. You&#8217;ll be able to choose an optional video icon overlay if you want to indicate that a story contains a featured video.<\/p>\n<p>You&#8217;ll also be able choose a compact mobile format. This reduced the size of the card image and hides the description text, making the title more prominent on mobile.<\/p>\n<p>You can also give your cards a white background to help them stand out against a coloured panel background.<\/p>\n<p><a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/card-update2.jpg\"><img loading=\"lazy\" class=\"alignnone size-large wp-image-3832\" src=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/card-update2-1024x990.jpg\" alt=\"Screenshot of card panel\" width=\"1024\" height=\"990\" srcset=\"https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/card-update2-1024x990.jpg 1024w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/card-update2-300x290.jpg 300w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/card-update2-768x742.jpg 768w, https:\/\/blogs.kent.ac.uk\/webdev\/files\/2020\/08\/card-update2.jpg 1351w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<h2>Other bug fixes<\/h2>\n<ul>\n<li>Fixed chevrons on icon card titles<\/li>\n<li>Fixed video card chevron alignment<\/li>\n<li>Fixed quote panel chevron alignment<\/li>\n<li>Made uploading video image optional for inline videos<\/li>\n<li>Made lead text optional on content pages<\/li>\n<li>Fixed anchor link output on events listing with date picker<\/li>\n<li>Fixed &#8216;Contact us&#8217; heading bug<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>We&#8217;re changing student and staff links and added a few improvements to existing blocks. Student and staff links change We&#8217;ve updated the student and staff &hellip; <a href=\"https:\/\/blogs.kent.ac.uk\/webdev\/2020\/08\/24\/site-editor-upcoming-changes\/\">Read&nbsp;more<\/a><\/p>\n","protected":false},"author":17235,"featured_media":3995,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[79486,79485,1],"tags":[79486],"_links":{"self":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/3786"}],"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\/17235"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/comments?post=3786"}],"version-history":[{"count":23,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/3786\/revisions"}],"predecessor-version":[{"id":3833,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/posts\/3786\/revisions\/3833"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media\/3995"}],"wp:attachment":[{"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/media?parent=3786"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/categories?post=3786"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.kent.ac.uk\/webdev\/wp-json\/wp\/v2\/tags?post=3786"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}