{"id":168,"date":"2023-07-07T11:34:39","date_gmt":"2023-07-07T15:34:39","guid":{"rendered":"https:\/\/carleton.ca\/cutheme\/?page_id=168"},"modified":"2024-09-18T20:31:39","modified_gmt":"2024-09-19T00:31:39","slug":"news-cards","status":"publish","type":"page","link":"https:\/\/carleton.ca\/cutheme-docs\/block-library\/card-blocks\/news-cards\/","title":{"rendered":"News Cards"},"content":{"rendered":"\n<section class=\"w-screen px-6 cu-section cu-section--white ml-offset-center md:px-8 lg:px-14\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n            <div class=\"cu-textmedia flex flex-col lg:flex-row mx-auto gap-6 md:gap-10 my-6 md:my-12 first:mt-0 max-w-5xl\">\n        <div class=\"justify-start cu-textmedia-content cu-prose-first-last\" style=\"flex: 0 0 100%;\">\n            <header class=\"font-light prose-xl cu-pageheader md:prose-2xl cu-component-updated cu-prose-first-last\">\n                                    <h1 class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px text-3xl md:text-4xl lg:text-5xl lg:leading-[3.5rem] pb-5 after:w-10 text-cu-black-700 not-prose\">\n                        News Cards\n                    <\/h1>\n                \n                                \n                                    \n\n\n<div class=\"wp-block-buttons is-layout-flex wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/carleton.ca\/cutheme-docs\/block-library\/card-blocks\/\">How to: Card Blocks<\/a><\/div>\n<\/div>\n\n\n\n                            <\/header>\n\n                    <\/div>\n\n            <\/div>\n\n    <\/div>\n<\/section>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;blockHeader&quot;&#x3A;&quot;Defaults&quot;,&quot;numberOfPosts&quot;&#x3A;3,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;numberOfColumns&quot;&#x3A;3,&quot;showImages&quot;&#x3A;true,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showExcerpts&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"defaults\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Defaults\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-3 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Update your files while keeping the original URL exactly the same.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We\u2019re excited to share a new way to highlight your media mentions \u2014 the In the Media block! This new feature makes it easy to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-3.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                For anyone adding images to posts, pages, people profiles, or content blocks \u2014 here\u2019s a quick reference to help you choose the right size and\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;blockHeader&quot;&#x3A;&quot;With&#x20;a&#x20;Load&#x20;More&quot;,&quot;numberOfPosts&quot;&#x3A;3,&quot;moreButton&quot;&#x3A;&quot;loadmore&quot;,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;numberOfColumns&quot;&#x3A;3,&quot;showImages&quot;&#x3A;true,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showExcerpts&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"with-a-load-more\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        With a Load More\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-3 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Update your files while keeping the original URL exactly the same.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We\u2019re excited to share a new way to highlight your media mentions \u2014 the In the Media block! This new feature makes it easy to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-3.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                For anyone adding images to posts, pages, people profiles, or content blocks \u2014 here\u2019s a quick reference to help you choose the right size and\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                            <button aria-label=\"Load More\" class=\"loadMore cu-button not-prose cu-button--dark-grey cu-button--center \" type=\"button\">\n    <div class=\"block load-more-button\">\n        Load More\n    <\/div>\n    <div class=\"hidden no-more-posts\">\n        No more to load\n    <\/div>\n    <div class=\"items-center justify-center hidden load-more-spinner cu-pageloader\">\n    <div class=\"inline-block h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n        <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n            Loading&#8230;\n        <\/span>\n    <\/div>\n<\/div>\n<\/button>\n                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;blockHeader&quot;&#x3A;&quot;Image,&#x20;Date&#x20;and&#x20;Title&quot;,&quot;numberOfPosts&quot;&#x3A;3,&quot;showExcerpts&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;numberOfColumns&quot;&#x3A;3,&quot;showImages&quot;&#x3A;true,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"image-date-and-title\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Image, Date and Title\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-3 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-3.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Donec et lectus vitae leo eleifend lacinia. Morbi dictum sem nisl. In commodo orci vitae ultricies molestie. Ut nisl tortor, posuere nec lacus in, sodales blandit metus. Mauris quis lobortis eros. Nunc id cursus tellus, et pulvinar tortor. Nunc nisi felis, volutpat et ante eget, elementum convallis nisl. Fusce hendrerit ac risus nec eleifend. Morbi malesuada, diam at dignissim mattis, mauris diam mattis urna, sit amet sagittis nisl lorem at velit.<\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;blockHeader&quot;&#x3A;&quot;Date&#x20;and&#x20;Title&quot;,&quot;showImages&quot;&#x3A;false,&quot;showExcerpts&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;numberOfColumns&quot;&#x3A;3,&quot;numberOfPosts&quot;&#x3A;6,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"date-and-title\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Date and Title\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-3 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-09-23T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        September 24, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Page Titles and Page Banners: What\u2019s the Difference?\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/page-titles-vs-page-banners-whats-the-difference-and-best-practices\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Page Titles and Page Banners: What\u2019s the Difference?\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-25T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 26, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Add Anchors to your Webpages\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/how-to-add-anchors-to-your-webpages\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Add Anchors to your Webpages\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-21T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 22, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Where Did My Landing Page Go? Navigating cuTheme Menus\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/where-did-my-landing-page-go-navigating-cutheme-menus\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Where Did My Landing Page Go? Navigating cuTheme Menus\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;blockHeader&quot;&#x3A;&quot;Date,&#x20;Title&#x20;and&#x20;Excerpt&quot;,&quot;showImages&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;numberOfColumns&quot;&#x3A;3,&quot;numberOfPosts&quot;&#x3A;6,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showExcerpts&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"date-title-and-excerpt\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Date, Title and Excerpt\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-3 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Update your files while keeping the original URL exactly the same.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We\u2019re excited to share a new way to highlight your media mentions \u2014 the In the Media block! This new feature makes it easy to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                For anyone adding images to posts, pages, people profiles, or content blocks \u2014 here\u2019s a quick reference to help you choose the right size and\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-09-23T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        September 24, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Page Titles and Page Banners: What\u2019s the Difference?\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Page titles boost SEO while banners shape design. With this update, you can now customize each separately for flexibility.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/page-titles-vs-page-banners-whats-the-difference-and-best-practices\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Page Titles and Page Banners: What\u2019s the Difference?\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-25T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 26, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Add Anchors to your Webpages\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Anchors\u2014also known as jump links or bookmarks\u2014allow users to quickly navigate to specific sections of a webpage. They\u2019re especially useful on longer pages where readers\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/how-to-add-anchors-to-your-webpages\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Add Anchors to your Webpages\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-21T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 22, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Where Did My Landing Page Go? Navigating cuTheme Menus\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Good website navigation is key to a great user experience. cuTheme was designed to make navigation more intuitive and accessible, especially when it comes to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/where-did-my-landing-page-go-navigating-cutheme-menus\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Where Did My Landing Page Go? Navigating cuTheme Menus\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;blockHeader&quot;&#x3A;&quot;Image&#x20;and&#x20;Title&quot;,&quot;numberOfPosts&quot;&#x3A;3,&quot;showDates&quot;&#x3A;false,&quot;showExcerpts&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;numberOfColumns&quot;&#x3A;3,&quot;showImages&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"image-and-title\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Image and Title\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-3 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-3.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n<p><\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;numberOfColumns&quot;&#x3A;4,&quot;blockHeader&quot;&#x3A;&quot;Four&#x20;Columns&quot;,&quot;numberOfPosts&quot;&#x3A;4,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;showImages&quot;&#x3A;true,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showExcerpts&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-7xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"four-columns\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Four Columns\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-7xl md:grid-cols-2 lg:grid-cols-4 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Update your files while keeping the original URL exactly the same.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We\u2019re excited to share a new way to highlight your media mentions \u2014 the In the Media block! This new feature makes it easy to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-3.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                For anyone adding images to posts, pages, people profiles, or content blocks \u2014 here\u2019s a quick reference to help you choose the right size and\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-4.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-09-23T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        September 24, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Page Titles and Page Banners: What\u2019s the Difference?\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Page titles boost SEO while banners shape design. With this update, you can now customize each separately for flexibility.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/page-titles-vs-page-banners-whats-the-difference-and-best-practices\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Page Titles and Page Banners: What\u2019s the Difference?\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n    \n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--grey cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;numberOfColumns&quot;&#x3A;4,&quot;blockHeader&quot;&#x3A;&quot;Date&#x20;and&#x20;Title&#x20;at&#x20;4&#x20;Columns&#x20;with&#x20;Grey&#x20;Background&quot;,&quot;blockBackground&quot;&#x3A;&quot;grey&quot;,&quot;numberOfPosts&quot;&#x3A;8,&quot;showImages&quot;&#x3A;false,&quot;showExcerpts&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-7xl bg-cu-black-50 max-w-screen-2xl mx-auto rounded-xl px-6 py-5 md:px-14 md:py-12 md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"date-and-title-at-4-columns-with-grey-background\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Date and Title at 4 Columns with Grey Background\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-7xl md:grid-cols-2 lg:grid-cols-4 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-09-23T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        September 24, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Page Titles and Page Banners: What\u2019s the Difference?\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/page-titles-vs-page-banners-whats-the-difference-and-best-practices\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Page Titles and Page Banners: What\u2019s the Difference?\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-25T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 26, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Add Anchors to your Webpages\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/how-to-add-anchors-to-your-webpages\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Add Anchors to your Webpages\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-21T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 22, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Where Did My Landing Page Go? Navigating cuTheme Menus\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/where-did-my-landing-page-go-navigating-cutheme-menus\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Where Did My Landing Page Go? Navigating cuTheme Menus\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-21T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 22, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Ready \u2013 Prepare your Site for a Seamless Migration!\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-ready-prepare-your-site-for-a-seamless-migration\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Ready \u2013 Prepare your Site for a Seamless Migration!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-13T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 14, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing Our New Alt Text Checker\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-our-new-alt-text-checker\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing Our New Alt Text Checker\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;numberOfColumns&quot;&#x3A;4,&quot;blockHeader&quot;&#x3A;&quot;Date,&#x20;Title&#x20;and&#x20;Excerpt&#x20;at&#x20;4&#x20;Col&quot;,&quot;numberOfPosts&quot;&#x3A;8,&quot;showImages&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showExcerpts&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-7xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"date-title-and-excerpt-at-4-col\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Date, Title and Excerpt at 4 Col\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-7xl md:grid-cols-2 lg:grid-cols-4 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Update your files while keeping the original URL exactly the same.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We\u2019re excited to share a new way to highlight your media mentions \u2014 the In the Media block! This new feature makes it easy to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-10-26T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        October 27, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Image Size Cheat Sheet\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                For anyone adding images to posts, pages, people profiles, or content blocks \u2014 here\u2019s a quick reference to help you choose the right size and\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-image-size-cheat-sheet\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Image Size Cheat Sheet\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-09-23T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        September 24, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Page Titles and Page Banners: What\u2019s the Difference?\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Page titles boost SEO while banners shape design. With this update, you can now customize each separately for flexibility.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/page-titles-vs-page-banners-whats-the-difference-and-best-practices\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Page Titles and Page Banners: What\u2019s the Difference?\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-25T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 26, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Add Anchors to your Webpages\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Anchors\u2014also known as jump links or bookmarks\u2014allow users to quickly navigate to specific sections of a webpage. They\u2019re especially useful on longer pages where readers\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/how-to-add-anchors-to-your-webpages\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Add Anchors to your Webpages\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-21T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 22, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Where Did My Landing Page Go? Navigating cuTheme Menus\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Good website navigation is key to a great user experience. cuTheme was designed to make navigation more intuitive and accessible, especially when it comes to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/where-did-my-landing-page-go-navigating-cutheme-menus\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Where Did My Landing Page Go? Navigating cuTheme Menus\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-21T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 22, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        cuTheme Ready \u2013 Prepare your Site for a Seamless Migration!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Reviewing your website thoroughly before migrating it lets you start off on the right foot and can make for a smoother transition. It is also\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/cutheme-ready-prepare-your-site-for-a-seamless-migration\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                cuTheme Ready \u2013 Prepare your Site for a Seamless Migration!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-05-13T20:00:00-04:00\" class=\"block italic text-sm text-cu-black-600\">\n        May 14, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing Our New Alt Text Checker\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We are excited to announce a new website feature to enhance accessibility and improve user experience. This feature automatically checks whether an image has alt\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-our-new-alt-text-checker\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing Our New Alt Text Checker\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n<p><\/p>\n\n\n\n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--white cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;numberOfColumns&quot;&#x3A;2,&quot;blockHeader&quot;&#x3A;&quot;Two&#x20;Columns&quot;,&quot;numberOfPosts&quot;&#x3A;2,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;blockBackground&quot;&#x3A;&quot;white&quot;,&quot;showImages&quot;&#x3A;true,&quot;showDates&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showExcerpts&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl  md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"two-columns\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Two Columns\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-2 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2026-03-03T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        March 4, 2026\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                Update your files while keeping the original URL exactly the same.\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                        <time datetime=\"2025-12-08T19:00:00-05:00\" class=\"block italic text-sm text-cu-black-600\">\n        December 9, 2025\n    <\/time>\n\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n            <div class=\"flex flex-col px-6 dark:text-white\">\n            <p class=\"text-base text-cu-black-700 dark:text-white \">\n                We\u2019re excited to share a new way to highlight your media mentions \u2014 the In the Media block! This new feature makes it easy to\n                                    &#8230;\n                            <\/p>\n        <\/div>\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n\n\n\n<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, consequat semper metus.<\/p>\n\n\n\n<p>Donec et lectus vitae leo eleifend lacinia. Morbi dictum sem nisl. In commodo orci vitae ultricies molestie. Ut nisl tortor, posuere nec lacus in, sodales blandit metus. Mauris quis lobortis eros. Nunc id cursus tellus, et pulvinar tortor. Nunc nisi felis, volutpat et ante eget, elementum convallis nisl. Fusce hendrerit ac risus nec eleifend. Morbi malesuada, diam at dignissim mattis, mauris diam mattis urna, sit amet sagittis nisl lorem at velit.<\/p>\n\n\n    \n\n\n\n                                                                                                                                                                                                                                                                                                                                                                                                        \n\n\n\n<section class=\"w-screen px-6 cu-section cu-section--grey cu-section--cards ml-offset-center md:px-8 lg:px-14\" data-attributes=\"&#x7B;&quot;numberOfColumns&quot;&#x3A;2,&quot;blockHeader&quot;&#x3A;&quot;Grey&#x20;Block&#x20;Background&quot;,&quot;blockBackground&quot;&#x3A;&quot;grey&quot;,&quot;numberOfPosts&quot;&#x3A;2,&quot;showDates&quot;&#x3A;false,&quot;showExcerpts&quot;&#x3A;false,&quot;blockType&quot;&#x3A;&quot;cards&quot;,&quot;contentType&quot;&#x3A;&quot;post&quot;,&quot;currentPage&quot;&#x3A;1,&quot;showImages&quot;&#x3A;true,&quot;showTimeToRead&quot;&#x3A;true,&quot;showFilter&quot;&#x3A;false,&quot;taxName&quot;&#x3A;&quot;category&quot;,&quot;moreButton&quot;&#x3A;&quot;none&quot;,&quot;categories&quot;&#x3A;&quot;&quot;,&quot;tags&quot;&#x3A;&quot;&quot;&#x7D;\" data-page=\"2\">\n    <div class=\"space-y-6 cu-max-w-child-5xl bg-cu-black-50 max-w-screen-2xl mx-auto rounded-xl px-6 py-5 md:px-14 md:py-12 md:space-y-10 cu-prose-first-last\">\n\n                            \n\n\n<header class=\"mb-6 cu-pageheader cu-component-updated md:mb-12\">\n    <h2 id=\"grey-block-background\" class=\"cu-prose-first-last font-semibold !mt-2 mb-4 md:mb-6 relative text-2xl md:text-3xl lg:text-4xl lg:leading-[3rem] pb-4 after:w-8 after:absolute after:h-px after:bottom-0 after:bg-cu-red after:left-px\">\n        Grey Block Background\n    <\/h2>\n\n    <\/header>\n        \n                \n        <div class=\"cu-loading hidden text-center mx-auto h-6 w-6 animate-spin rounded-full border-4 border-solid border-current border-r-transparent align-[-0.125em] motion-reduce:animate-[spin_1.5s_linear_infinite]\" role=\"status\">\n    <span class=\"!absolute !-m-px !h-px !w-px !overflow-hidden !whitespace-nowrap !border-0 !p-0 ![clip:rect(0,0,0,0)]\">\n        Loading&#8230;\n    <\/span>\n<\/div>\n\n                                        \n        <p class=\"cu-no-posts hidden\">\n            No\n            category\n\n            posts are available.\n        <\/p>\n\n                <div class=\"cu-column cu-component not-contained mx-auto grid max-w-5xl md:grid-cols-2 gap-6 md:gap-10\">\n                        \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-1.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        How to Replace a Media File in cuTheme (Without Breaking Anything)\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2026\/how-to-replace-a-media-file-in-cutheme-without-breaking-anything\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                How to Replace a Media File in cuTheme (Without Breaking Anything)\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n            \n                    \n\n<div class=\"not-prose cu-card rounded-lg @container md:max-w-xl flex flex-col gap-3 bg-white shadow-lg shadow-cu-black-100 group duration-300 ease-in hover:scale-[1.02] hover:shadow-cu-black-200\">\n\n            <figure class=\"mb-2 overflow-hidden rounded-t-lg\">\n            <img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/its-production.s3.amazonaws.com\/gutenberg\/cutheme-plugin\/images\/thumb-fallbacks\/news-thumb-2.jpg\" alt=\"Randomly generated thumbnail\" width=\"600\" height=\"400\" \/>\n        <\/figure>\n    \n    \n        <header class=\"flex flex-col gap-3  px-6 first:mt-6\">\n        <div class=\"flex flex-row w-full gap-1\">\n                    <\/div>        \n        \n    \n    <h3 class=\"line-clamp-3 text-lg font-semibold text-cu-black @sm:md:text-xl leading-6 @sm:md:leading-8\">\n        Introducing the \u201cIn the Media\u201d Block!\n    <\/h3>\n\n            <\/header>\n\n\n    \n    <footer class=\"px-6 pt-3 mt-auto md:pt-5\">\n        <a href=\"https:\/\/carleton.ca\/cutheme-docs\/2025\/introducing-the-in-the-media-block\/\" class=\"cu-button cu-button--red cu-button--small\">\n            Read news\n            <span class=\"sr-only\">\n                post\n                Introducing the \u201cIn the Media\u201d Block!\n            <\/span>\n        <\/a>\n    <\/footer>\n<\/div>\n\n                    \n        <\/div>\n        \n                                    \n    <\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras varius, augue id facilisis rutrum, lectus erat porta ante, id egestas sem odio eget justo. Phasellus ac lorem dictum ante cursus pellentesque. Suspendisse a tincidunt felis, ut semper libero. Quisque suscipit orci posuere sodales pretium. Nullam et iaculis arcu. Morbi lacus nulla, molestie eleifend urna vitae, [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":751,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_cu_dining_location_slug":"","footnotes":"","_links_to":"","_links_to_target":""},"cu_page_type":[11],"class_list":["post-168","page","type-page","status-publish","hentry","cu_page_type-general"],"acf":{"cu_post_thumbnail":false},"_links":{"self":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/168","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/comments?post=168"}],"version-history":[{"count":5,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/168\/revisions"}],"predecessor-version":[{"id":4345,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/168\/revisions\/4345"}],"up":[{"embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/pages\/751"}],"wp:attachment":[{"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/media?parent=168"}],"wp:term":[{"taxonomy":"cu_page_type","embeddable":true,"href":"https:\/\/carleton.ca\/cutheme-docs\/wp-json\/wp\/v2\/cu_page_type?post=168"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}