{"id":15429,"date":"2026-02-24T08:14:53","date_gmt":"2026-02-24T13:14:53","guid":{"rendered":"https:\/\/www.med.unc.edu\/webguide\/?page_id=15429"},"modified":"2026-03-04T09:01:27","modified_gmt":"2026-03-04T14:01:27","slug":"banners","status":"publish","type":"page","link":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/","title":{"rendered":"Banners"},"content":{"rendered":"<p>Banners can help highlight important information, promote initiatives, or create strong visual impact at the top of a page. However, banners must be implemented in ways that support accessibility, performance, and long-term maintainability.<\/p>\n<p>This page outlines what is allowed and not allowed in the School of Medicine web system.<\/p>\n<hr  style=\"margin:40px 0\"class=\" rule-thin osc-rule\" \/>\n<h2>Not Allowed<\/h2>\n<h3>Image Carousels, Sliders, and Slideshows<\/h3>\n<p>Image carousels (rotating banners) are not permitted.\u00a0Carousels create significant accessibility barriers, including keyboard navigation issues, timing controls, and screen reader confusion.<\/p>\n<p>Review our <a href=\"https:\/\/www.med.unc.edu\/webguide\/accessibility\/carousels\/\">Carousels Accessibility<\/a> documentation for more information.<\/p>\n<h3>Envira Gallery and Soliloquy Plugins<\/h3>\n<p>As mentioned, slideshows are not allowed, including those created with the Envira Gallery or Soliloquy plugins.<\/p>\n<ul>\n<li><strong>Envira Gallery<\/strong> may continue to be used for static image galleries, but it should not be used to create slideshow-style banners.<\/li>\n<li><strong>Soliloquy<\/strong> is being phased out. Sites currently using Soliloquy should redesign their slideshow content without it.<\/li>\n<\/ul>\n<hr  style=\"margin:40px 0\"class=\" rule-thin osc-rule\" \/>\n<h2>Allowed Banner Options<\/h2>\n<h3>Cells Plugin Banner Options (Recommended)<\/h3>\n<p>The Cells plugin includes several pre-designed banner and full-width layout options that are accessible and responsive.<\/p>\n<p>Using Cells is the preferred method for adding banners because:<\/p>\n<ul>\n<li>Layout and styling are already built to match the SOM theme<\/li>\n<li>Responsive behavior is handled automatically<\/li>\n<li>No HTML or CSS knowledge needed<\/li>\n<\/ul>\n<p>The <strong><a href=\"https:\/\/www.med.unc.edu\/webguide\/cells\/single-cell-blocks\/image-blocks\/\">Image Blocks<\/a><\/strong> and <strong><a href=\"https:\/\/www.med.unc.edu\/webguide\/cells\/single-cell-blocks\/banner-blocks\/\">Banner Blocks<\/a><\/strong> within Cells are the closest &#8220;banner&#8221; options.<\/p>\n<p>If you are new to Cells, review the <a href=\"https:\/\/www.med.unc.edu\/webguide\/cells\/general-usage\/\"><strong>Getting Started with Cells<\/strong><\/a> documentation before you begin.<\/p>\n<h3>Add an Image to the Featured Content Area<\/h3>\n<p>The <a href=\"https:\/\/www.med.unc.edu\/webguide\/userguide\/getting-started\/i-have-a-site\/featured-and-bottom-content-areas\/\"><strong>Featured Content area<\/strong><\/a> displays directly below the top navigation. If styled correctly, an image placed here can span the full width of the browser window and function as a banner.<\/p>\n<p>The Featured Content area <strong>only accepts HTML and shortcode<\/strong>. If you&#8217;re unfamiliar with HTML, the steps below will show you how to use the editor to generate the HTML you need.<\/p>\n<ol>\n<li>Add the Image to the main content area of the page.<\/li>\n<li>Ensure you add meaningful <strong><a href=\"https:\/\/www.med.unc.edu\/webguide\/userguide\/media\/images\/how-to-add-an-image\/#alt-text\">alt text<\/a><\/strong> (required).<\/li>\n<li>Click on the image to select it. This will highlight the code so it is easy to find in the next step.<\/li>\n<li>Click on the <strong>Code<\/strong> tab in the editor to view the html of the page.<br \/>\n<span class=\"imgBorderMed\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-14570\" src=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png\" alt=\"Screenshot highlighting the Visual and Text tab in the WordPress classic editor.\" width=\"500\" height=\"81\" srcset=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png 748w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab-300x49.png 300w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab-600x97.png 600w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab-560x91.png 560w\" sizes=\"auto, (max-width: 500px) 100vw, 500px\" \/><\/span><\/li>\n<li>The HTML for the image should already be highlighted (if you followed step #3 above). If not, locate and highlight the whole <strong>&lt;img&gt;<\/strong> tag.<\/li>\n<li>Copy the complete <strong>&lt;img&gt;<\/strong> HTML code.<\/li>\n<li>Paste the HTML into the <strong>Featured Content area<\/strong>.<\/li>\n<li>Modify the html\n<ol>\n<li>change the <strong>width<\/strong> attribute to 100%<\/li>\n<li>Remove the <strong>height<\/strong> attribute completely. This ensures the banner spans the full width and remains responsive.<\/li>\n<\/ol>\n<\/li>\n<li>The final results will look something like this:<br \/>\n<span class=\"imgBorderMed\"><a href=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-15447\" src=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content.png\" alt=\"Screenshot of the HTML of an image inside the Feature Content area, links to full image.\" width=\"700\" height=\"139\" srcset=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content.png 1176w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content-300x60.png 300w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content-1024x204.png 1024w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content-768x153.png 768w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content-600x119.png 600w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/image-in-featured-content-560x111.png 560w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/a><\/span><\/li>\n<li>Delete the image in the main body content area as it is no longer needed.<\/li>\n<li><strong>Save<\/strong> or Update the page.<\/li>\n<\/ol>\n<h4>Examples<\/h4>\n<p>Below are some examples of banners placed in the Featured Content area.<\/p>\n<div class=\"row  oscitas-bootstrap-container\">\n<div class=\"col-lg-6 col-md-6 col-xs-12 col-sm-6 oscitas-bootstrap-container\">\n<p><span class=\"imgBorderMed\"><a href=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-15443 size-full\" src=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1.png\" alt=\"Screenshot of the TEACCH website showing a banner image displayed in the Featured Content area, links to full-size image.\" width=\"1715\" height=\"566\" srcset=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1.png 1715w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1-300x99.png 300w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1-1024x338.png 1024w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1-768x253.png 768w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1-1536x507.png 1536w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1-600x198.png 600w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/teacch-banner-1-560x185.png 560w\" sizes=\"auto, (max-width: 1715px) 100vw, 1715px\" \/><\/a><\/span><\/p>\n<\/div>\n<div class=\"col-lg-6 col-md-6 col-xs-12 col-sm-6 oscitas-bootstrap-container\">\n<p><a href=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-15459\" src=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example.png\" alt=\"Screenshot of the Flow Cytometry Core Facility website showing a banner image displayed in the Featured Content area, links to full-size image.\" width=\"800\" height=\"309\" srcset=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example.png 1311w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example-300x116.png 300w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example-1024x395.png 1024w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example-768x296.png 768w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example-600x232.png 600w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/flow-cytometry-banner-example-560x216.png 560w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/a><\/p>\n<\/div>\n<\/div>\n<h3>Add an Image to the Main Content Area<\/h3>\n<p>A wide banner image can also be placed in the main body content area of a page. These images will not span the full width of the browser window and will instead be constrained by the main content area.<\/p>\n<p><span class=\"imgBorderMed\"><a href=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-15464\" src=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology.png\" alt=\"Example of the Cardiology website displaying a banner image in the body content area, links to full-size image.\" width=\"600\" height=\"387\" srcset=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology.png 1336w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology-300x194.png 300w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology-1024x661.png 1024w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology-768x496.png 768w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology-600x387.png 600w, https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/03\/banner-example-cardiology-560x361.png 560w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/span><\/p>\n<h3>Using the Featured Image Field<\/h3>\n<p>The <strong>Featured Image<\/strong> field can also be used to display a banner image below the top navigation. However, this option provides less layout control compared to Cells or images placed in the Featured Content area.<\/p>\n<ul>\n<li>The Featured Image area has a predetermined height. Images may be clipped depending on their dimensions.<\/li>\n<li>The amount of clipping varies based on screen size.<\/li>\n<li>The image is not fixed which means it will scroll with the page.<\/li>\n<\/ul>\n<p>To use this option, simply add an image to the <strong>Featured Image panel<\/strong>.<\/p>\n<p><span class=\"imgBorderMed\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-15442\" src=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2026\/02\/featured-image-panel.png\" alt=\"Screenshot of the Featured Image panel in WordPress.\" width=\"294\" height=\"109\" \/><\/span><\/p>\n<hr  style=\"margin:40px 0\"class=\" rule-thin osc-rule\" \/>\n<h2>Recommended Image Size for Banners<\/h2>\n<p>Choosing the right image size is important for visual quality and performance.<\/p>\n<p>Note that banner images should not be overly tall. Tall images push the page\u2019s main content down the screen, forcing visitors to scroll before seeing important information.<\/p>\n<p>A good banner supports the content \u2014 it shouldn&#8217;t overwhelm it.<\/p>\n<h3>For Full-Width Banners (Featured Content Area)<\/h3>\n<p>Because this area spans the full width of the browser window, banner images should be:<\/p>\n<ul>\n<li>2,000\u20133,000 pixels wide<\/li>\n<li>Optimized for web use<\/li>\n<li>Ideally under 800 KB<\/li>\n<\/ul>\n<p>Large enough images ensure clarity on wide desktop monitors, while proper compression prevents slow page load times.<\/p>\n<h3>For Banners in the Main Body Content Area<\/h3>\n<p>Images placed in the body content do not need to be as wide. Recommended size:<\/p>\n<ul>\n<li>1,200\u20131,800 pixels wide<\/li>\n<li>Optimized for web use<\/li>\n<li>Compressed for performance<\/li>\n<\/ul>\n<p>Uploading overly large images does not improve quality but can slow down page load time.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Banners can help highlight important information, promote initiatives, or create strong visual impact at the top of a page. However, banners must be implemented in ways that support accessibility, performance, and long-term maintainability. This page outlines what is allowed and not allowed in the School of Medicine web system. Not Allowed Image Carousels, Sliders, and &hellip; <a href=\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/\" aria-label=\"Read more about Banners\">Read more<\/a><\/p>\n","protected":false},"author":3206,"featured_media":0,"parent":2212,"menu_order":6,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"layout":"","cellInformation":"","apiCallInformation":"","footnotes":"","_links_to":"","_links_to_target":""},"class_list":["post-15429","page","type-page","status-publish","hentry","odd"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Banners - Web Guide<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Banners - Web Guide\" \/>\n<meta property=\"og:description\" content=\"Banners can help highlight important information, promote initiatives, or create strong visual impact at the top of a page. However, banners must be implemented in ways that support accessibility, performance, and long-term maintainability. This page outlines what is allowed and not allowed in the School of Medicine web system. Not Allowed Image Carousels, Sliders, and &hellip; Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Guide\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-04T14:01:27+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png\" \/>\n\t<meta property=\"og:image:width\" content=\"748\" \/>\n\t<meta property=\"og:image:height\" content=\"121\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/\",\"url\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/\",\"name\":\"Banners - Web Guide\",\"isPartOf\":{\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png\",\"datePublished\":\"2026-02-24T13:14:53+00:00\",\"dateModified\":\"2026-03-04T14:01:27+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#primaryimage\",\"url\":\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png\",\"contentUrl\":\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png\",\"width\":748,\"height\":121,\"caption\":\"Screenshot highlighting the Visual and Text tab in the WordPress classic editor.\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.med.unc.edu\/webguide\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"User Guide\",\"item\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/ughome\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Styling Content\",\"item\":\"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Banners\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/#website\",\"url\":\"https:\/\/www.med.unc.edu\/webguide\/\",\"name\":\"Web Guide\",\"description\":\"School of Medicine IT\",\"publisher\":{\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.med.unc.edu\/webguide\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/#organization\",\"name\":\"UNC School of Medicine\",\"url\":\"https:\/\/www.med.unc.edu\/webguide\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2017\/06\/School_of_Medicine_CarolinaBlue_Navy_rgb_h.png\",\"contentUrl\":\"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2017\/06\/School_of_Medicine_CarolinaBlue_Navy_rgb_h.png\",\"width\":612,\"height\":150,\"caption\":\"UNC School of Medicine\"},\"image\":{\"@id\":\"https:\/\/www.med.unc.edu\/webguide\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Banners - Web Guide","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/","og_locale":"en_US","og_type":"article","og_title":"Banners - Web Guide","og_description":"Banners can help highlight important information, promote initiatives, or create strong visual impact at the top of a page. However, banners must be implemented in ways that support accessibility, performance, and long-term maintainability. This page outlines what is allowed and not allowed in the School of Medicine web system. Not Allowed Image Carousels, Sliders, and &hellip; Read more","og_url":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/","og_site_name":"Web Guide","article_modified_time":"2026-03-04T14:01:27+00:00","og_image":[{"width":748,"height":121,"url":"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png","type":"image\/png"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/","url":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/","name":"Banners - Web Guide","isPartOf":{"@id":"https:\/\/www.med.unc.edu\/webguide\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#primaryimage"},"image":{"@id":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#primaryimage"},"thumbnailUrl":"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png","datePublished":"2026-02-24T13:14:53+00:00","dateModified":"2026-03-04T14:01:27+00:00","breadcrumb":{"@id":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#primaryimage","url":"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png","contentUrl":"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2025\/10\/visual-text-tab.png","width":748,"height":121,"caption":"Screenshot highlighting the Visual and Text tab in the WordPress classic editor."},{"@type":"BreadcrumbList","@id":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/banners\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.med.unc.edu\/webguide\/"},{"@type":"ListItem","position":2,"name":"User Guide","item":"https:\/\/www.med.unc.edu\/webguide\/userguide\/ughome\/"},{"@type":"ListItem","position":3,"name":"Styling Content","item":"https:\/\/www.med.unc.edu\/webguide\/userguide\/styling-content\/"},{"@type":"ListItem","position":4,"name":"Banners"}]},{"@type":"WebSite","@id":"https:\/\/www.med.unc.edu\/webguide\/#website","url":"https:\/\/www.med.unc.edu\/webguide\/","name":"Web Guide","description":"School of Medicine IT","publisher":{"@id":"https:\/\/www.med.unc.edu\/webguide\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.med.unc.edu\/webguide\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.med.unc.edu\/webguide\/#organization","name":"UNC School of Medicine","url":"https:\/\/www.med.unc.edu\/webguide\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.med.unc.edu\/webguide\/#\/schema\/logo\/image\/","url":"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2017\/06\/School_of_Medicine_CarolinaBlue_Navy_rgb_h.png","contentUrl":"https:\/\/www.med.unc.edu\/webguide\/wp-content\/uploads\/sites\/419\/2017\/06\/School_of_Medicine_CarolinaBlue_Navy_rgb_h.png","width":612,"height":150,"caption":"UNC School of Medicine"},"image":{"@id":"https:\/\/www.med.unc.edu\/webguide\/#\/schema\/logo\/image\/"}}]}},"_links_to":[],"_links_to_target":[],"_links":{"self":[{"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/pages\/15429","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/users\/3206"}],"replies":[{"embeddable":true,"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/comments?post=15429"}],"version-history":[{"count":19,"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/pages\/15429\/revisions"}],"predecessor-version":[{"id":15469,"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/pages\/15429\/revisions\/15469"}],"up":[{"embeddable":true,"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/pages\/2212"}],"wp:attachment":[{"href":"https:\/\/www.med.unc.edu\/webguide\/wp-json\/wp\/v2\/media?parent=15429"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}