{"id":75,"date":"2026-02-11T16:18:29","date_gmt":"2026-02-11T16:18:29","guid":{"rendered":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/?page_id=75"},"modified":"2026-02-19T17:42:55","modified_gmt":"2026-02-19T17:42:55","slug":"visual-router-block","status":"publish","type":"page","link":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/","title":{"rendered":"Visual Router Block"},"content":{"rendered":"\n<section class=\"Hero circles\" data-animate>\n  \n\n<div class=\"Common\">\n  \n\n<h1 class=\"wp-block-heading\">Visual Router Block<\/h1>\n\n\n\n<div class=\"wp-block-buttons\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/\">Return to CMS Guide<\/a><\/div>\n<\/div>\n\n<\/div>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"600\" src=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\" alt=\"placeholder 900 x 600\" class=\"wp-image-9\" style=\"aspect-ratio:3\/2;object-fit:cover\" srcset=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg 900w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-300x200.jpg 300w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-768x512.jpg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/figure>\n\n<\/section>\n\n\n\n<div class=\"Common\">\n  \n\n<p class=\"is-style-intro\">The Visual Router block creates visual interest by adding images to a group of related links, with or without supporting description text. The block contains a heading, intro text, an optional call to action, and visual router items. Each visual router item contains an image, a linked sub-heading, and optional description text. When the block is first placed on the page, only one visual router item exists. This can be duplicated as needed for the desired number of items in the router. The visual router items display in rows of three at desktop display sizes. Best practice is to use between 3 to 6 router items. Explore the functional example below for more details.<\/p>\n\n<\/div>\n\n\n\n<section class=\"Section is-style-default\">\n  \n\n<div class=\"Common\">\n  \n\n<h2 class=\"wp-block-heading\">Visual Router Example<\/h2>\n\n\n\n<p>This intro text is used to provide context and additional details for the items in the router grid. Best practice is to limit this text to 1-5 sentences.<\/p>\n\n<\/div>\n\n\n\n<div class=\"VisualRouter\">\n  \n\n<div class=\"VisualRouterItem\">\n  \n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"600\" src=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\" alt=\"placeholder 900 x 600\" class=\"wp-image-9\" style=\"aspect-ratio:3\/2;object-fit:cover\" srcset=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg 900w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-300x200.jpg 300w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-768x512.jpg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/figure>\n\n\n\n<div class=\"Common\">\n  \n\n<h3 class=\"wp-block-heading\"><a href=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/\" data-type=\"page\" data-id=\"5\">Visual Router Item<\/a><\/h3>\n\n\n\n<p>The visual router item description text is used to encourage the user to click on the link to learn more about the topic of the item. Best practice is to limit this text to 1-3 sentence.<\/p>\n\n<\/div>\n\n<\/div>\n\n\n\n<div class=\"VisualRouterItem\">\n  \n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"600\" src=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\" alt=\"placeholder 900 x 600\" class=\"wp-image-9\" style=\"aspect-ratio:3\/2;object-fit:cover\" srcset=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg 900w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-300x200.jpg 300w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-768x512.jpg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/figure>\n\n\n\n<div class=\"Common\">\n  \n\n<h3 class=\"wp-block-heading\"><a href=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/\" data-type=\"page\" data-id=\"5\">Lorem Ipsum Dolor sit Amet Consectetur<\/a><\/h3>\n\n\n\n<p>Nulla facilisi. Maecenas mauris erat, laoreet sed velit id, tempus hendrerit tellus.<\/p>\n\n<\/div>\n\n<\/div>\n\n\n\n<div class=\"VisualRouterItem\">\n  \n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"900\" height=\"600\" src=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\" alt=\"placeholder 900 x 600\" class=\"wp-image-9\" style=\"aspect-ratio:3\/2;object-fit:cover\" srcset=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg 900w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-300x200.jpg 300w, https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600-768x512.jpg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/figure>\n\n\n\n<div class=\"Common\">\n  \n\n<h3 class=\"wp-block-heading\"><a href=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/\" data-type=\"page\" data-id=\"5\">Vestibulum<\/a><\/h3>\n\n\n\n<p>Fusce aliquam porttitor fermentum. Mauris condimentum euismod tellus, nec laoreet erat luctus id. Donec ac erat quis odio tempus scelerisque quis eu libero.<\/p>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n\n<div class=\"wp-block-buttons\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/\">Optional Call to Action<\/a><\/div>\n<\/div>\n\n<\/section>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":3,"featured_media":0,"parent":5,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-75","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Visual Router Block - 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:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Visual Router Block - Web Guide\" \/>\n<meta property=\"og:url\" content=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Guide\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-19T17:42:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"900\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/\",\"url\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/\",\"name\":\"Visual Router Block - Web Guide\",\"isPartOf\":{\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\",\"datePublished\":\"2026-02-11T16:18:29+00:00\",\"dateModified\":\"2026-02-19T17:42:55+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#primaryimage\",\"url\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\",\"contentUrl\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg\",\"width\":900,\"height\":600,\"caption\":\"placeholder 900 x 600\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CMS Guide\",\"item\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Visual Router Block\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/#website\",\"url\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/\",\"name\":\"Web Guide\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/wwwpreview-teton.uwosh.edu\/web\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Visual Router Block - 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:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/","og_locale":"en_US","og_type":"article","og_title":"Visual Router Block - Web Guide","og_url":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/","og_site_name":"Web Guide","article_modified_time":"2026-02-19T17:42:55+00:00","og_image":[{"width":900,"height":600,"url":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/","url":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/","name":"Visual Router Block - Web Guide","isPartOf":{"@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/#website"},"primaryImageOfPage":{"@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#primaryimage"},"image":{"@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#primaryimage"},"thumbnailUrl":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg","datePublished":"2026-02-11T16:18:29+00:00","dateModified":"2026-02-19T17:42:55+00:00","breadcrumb":{"@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#primaryimage","url":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg","contentUrl":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-content\/uploads\/sites\/3\/2026\/02\/900x600.jpg","width":900,"height":600,"caption":"placeholder 900 x 600"},{"@type":"BreadcrumbList","@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/visual-router-block\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/"},{"@type":"ListItem","position":2,"name":"CMS Guide","item":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/cms-guide\/"},{"@type":"ListItem","position":3,"name":"Visual Router Block"}]},{"@type":"WebSite","@id":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/#website","url":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/","name":"Web Guide","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/pages\/75","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/comments?post=75"}],"version-history":[{"count":5,"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/pages\/75\/revisions"}],"predecessor-version":[{"id":257,"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/pages\/75\/revisions\/257"}],"up":[{"embeddable":true,"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/pages\/5"}],"wp:attachment":[{"href":"https:\/\/wwwpreview-teton.uwosh.edu\/web\/wp-json\/wp\/v2\/media?parent=75"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}