{"id":468,"date":"2021-11-10T12:10:04","date_gmt":"2021-11-10T17:10:04","guid":{"rendered":"https:\/\/www.marshall.edu\/website\/?page_id=468"},"modified":"2026-03-02T13:57:41","modified_gmt":"2026-03-02T18:57:41","slug":"about-shortcodes","status":"publish","type":"page","link":"https:\/\/www.marshall.edu\/marsha\/about-shortcodes\/","title":{"rendered":"About Shortcodes"},"content":{"rendered":"<p>Shortcodes are a way to drop pre-built components into any page or post without writing HTML. The Marsha theme includes a library of shortcodes, all prefixed with <code>mu_<\/code>, that cover everything from alerts and buttons to program listings and image teasers.<\/p>\n<h2>Basic Usage<\/h2>\n<p>A shortcode is written inside square brackets with any parameters included as attributes:<\/p>\n\n<div x-data=\"{ copied: false, rawCode: '' }\" x-init=\"rawCode = $refs.codeSource.textContent\" class=\"mb-12\">\n\n\t\t\t<div class=\"px-6 py-6 border border-b-0 rounded-t-lg border-gray-200 bg-white\">\n\t\t\t\n\t\n<div\n\t\tclass=\"bg-green py-8 mb-6 last:mb-0 first:mt-0 mt-6 first:mb-8\"\n>\n\t<div class=\"w-full xl:container mx-auto px-4\">\n\t\t<div class=\"bg-white flex flex-col lg:flex-row items-start py-6 px-6 ring-4 ring-white\/10 rounded\">\n\n\t\t\t\n\t\t\t<div class=\"flex-1  font-semibold text-gray-900 no-img flex flex-col items-start\">\n\t\t\t\t<div class=\"flex-1\">Your message here.<\/div>\n\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<\/div>\n\t<\/div>\n<\/div>\n\n\t\t<\/div>\n\t\n\t<div class=\"\">\n\t\t<div class=\"flex items-center justify-between px-4 py-2.5\" style=\"background: #181825; border-bottom: 1px solid rgba(255,255,255,.06);\">\n\t\t\t<span class=\"text-[11px] font-medium tracking-wide text-white\/40\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\">Shortcode<\/span>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\t@click=\"navigator.clipboard.writeText(rawCode); copied = true; setTimeout(() => copied = false, 2000)\"\n\t\t\t\tclass=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-[11px] font-medium cursor-pointer transition-all duration-150\"\n\t\t\t\t:class=\"copied\n\t\t\t\t\t? 'bg-green\/20 text-green border border-green\/30'\n\t\t\t\t\t: 'bg-white\/8 text-white\/60 border border-white\/10 hover:bg-white\/14 hover:text-white\/90'\"\n\t\t\t\tstyle=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\"\n\t\t\t>\n\t\t\t\t<template x-if=\"!copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"\/>\n\t\t\t\t\t\t<path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<template x-if=\"copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<polyline points=\"20 6 9 17 4 12\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<span x-text=\"copied ? 'Copied!' : 'Copy'\"><\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t\t<div class=\"rounded-b-lg overflow-x-auto\" style=\"background: #1e1e2e;\">\n\t\t\t<pre class=\"px-5 py-4\"><code x-ref=\"codeSource\" class=\"language-bbcode text-[13px] leading-relaxed\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace; color: #cdd6f4;\">[mu_alert type=&quot;green&quot;]Your message here.[\/mu_alert]<\/code><\/pre>\n\t\t<\/div>\n\t<\/div>\n\n<\/div>\n\n<p>Some shortcodes are self-closing (no content between tags):<\/p>\n\n<div x-data=\"{ copied: false, rawCode: '' }\" x-init=\"rawCode = $refs.codeSource.textContent\" class=\"mb-12\">\n\n\t\t\t<div class=\"px-6 py-6 border border-b-0 rounded-t-lg border-gray-200 bg-white\">\n\t\t\t\n<div\n\tclass=\"relative w-full aspect-video cursor-pointer overflow-hidden rounded-xl shadow-sm  \"\n\tx-data=\"{\n\t\tplayVideo: false,\n\t\tsrc: 'https:\/\/www.youtube.com\/embed\/og5EzN2v1wE?modestbranding=1&autoplay=1',\n\t\tplay() {\n\t\t\tthis.$refs.yt.src = this.src;\n\t\t\tthis.playVideo = true;\n\t\t},\n\t\tstop() {\n\t\t\tthis.$refs.yt.src = '';\n\t\t\tthis.playVideo = false;\n\t\t}\n\t}\"\n\t>\n\t<div class=\"group\/video relative\" x-on:click=\"play\">\n\t\t\t\t\t\t\t\t\t<img decoding=\"async\" x-show=\"!playVideo\" x-ref=\"video\" src=\"https:\/\/i3.ytimg.com\/vi_webp\/og5EzN2v1wE\/maxresdefault.webp\" alt=\"\" class=\"w-full h-full object-cover aspect-video\" \/>\n\t\t\t\t\t\n\t\t\t\t<div x-show=\"!playVideo\" class=\"absolute inset-0 bg-black\/5 transition-all duration-300 ease-out group-hover\/video:bg-black\/20\"><\/div>\n\n\t\t\t\t<div x-show=\"!playVideo\" class=\"absolute inset-0 flex items-center justify-center z-4\">\n\t\t\t<div class=\"w-16 h-16 md:w-20 md:h-20 bg-green rounded-2xl flex items-center justify-center shadow-lg transition-all duration-300 ease-out group-hover\/video:rounded-[50%] group-hover\/video:scale-110 group-hover\/video:shadow-xl\">\n\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" class=\"w-7 h-7 md:w-10 md:h-10 text-white hc:text-gray-900 contrast-more:text-gray-900 ml-1\">\n\t\t\t\t\t<path d=\"M8 5v14l11-7z\"\/>\n\t\t\t\t<\/svg>\n\t\t\t<\/div>\n\t\t<\/div>\n\n\t\t\t\t\t\t\t<div x-show=\"!playVideo\" class=\"absolute bottom-0 inset-x-0 h-1 bg-green hc:bg-gray-900 contrast-more:bg-gray-900 z-4\"><\/div>\n\t\t\n\t\t\t\t\t<\/div>\n\n\t<div x-cloak x-show=\"playVideo\" class=\"relative aspect-video w-full\">\n\t\t<div x-on:click=\"stop\" class=\"absolute top-0 left-[50%] flex items-center justify-center bg-green text-white z-5 p-2 cursor-pointer\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\" class=\"w-6 h-6\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" \/><\/svg>\n\t\t<\/div>\n\n\t\t<iframe loading=\"lazy\" x-ref=\"yt\" class=\"aspect-video w-full\" title=\"YouTube Video\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n\t<\/div>\n<\/div>\n\n\n\t\t<\/div>\n\t\n\t<div class=\"\">\n\t\t<div class=\"flex items-center justify-between px-4 py-2.5\" style=\"background: #181825; border-bottom: 1px solid rgba(255,255,255,.06);\">\n\t\t\t<span class=\"text-[11px] font-medium tracking-wide text-white\/40\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\">Shortcode<\/span>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\t@click=\"navigator.clipboard.writeText(rawCode); copied = true; setTimeout(() => copied = false, 2000)\"\n\t\t\t\tclass=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-[11px] font-medium cursor-pointer transition-all duration-150\"\n\t\t\t\t:class=\"copied\n\t\t\t\t\t? 'bg-green\/20 text-green border border-green\/30'\n\t\t\t\t\t: 'bg-white\/8 text-white\/60 border border-white\/10 hover:bg-white\/14 hover:text-white\/90'\"\n\t\t\t\tstyle=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\"\n\t\t\t>\n\t\t\t\t<template x-if=\"!copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"\/>\n\t\t\t\t\t\t<path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<template x-if=\"copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<polyline points=\"20 6 9 17 4 12\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<span x-text=\"copied ? 'Copied!' : 'Copy'\"><\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t\t<div class=\"rounded-b-lg overflow-x-auto\" style=\"background: #1e1e2e;\">\n\t\t\t<pre class=\"px-5 py-4\"><code x-ref=\"codeSource\" class=\"language-bbcode text-[13px] leading-relaxed\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace; color: #cdd6f4;\">[mu_youtube id=&quot;og5EzN2v1wE&quot;]<\/code><\/pre>\n\t\t<\/div>\n\t<\/div>\n\n<\/div>\n\n<p>Others wrap content or nest child shortcodes inside a parent wrapper:<\/p>\n\n<div x-data=\"{ copied: false, rawCode: '' }\" x-init=\"rawCode = $refs.codeSource.textContent\" class=\"mb-12\">\n\n\t\t\t<div class=\"px-6 py-6 border border-b-0 rounded-t-lg border-gray-200 bg-white\">\n\t\t\t\n\n\n<div class=\"flex flex-wrap justify-center items-stretch gap-8 cards-per-row-3\">\n\t\n\n\t\t\t<div class=\"card flex flex-col rounded-lg overflow-hidden relative transition-all duration-200 ease-out shadow-sm self-stretch\">\n\t\n\t\t\t\t<div class=\"absolute top-0 left-0 right-0 h-1 bg-linear-to-r from-green to-green-bright\"><\/div>\n\n\t\t<div class=\"p-6 pb-0 pt-7 bg-gray-50\">\n\t\t\t\n\t\t\t<div class=\"uppercase font-bold text-lg tracking-wider leading-tight text-gray-900\">\n\t\t\t\tCard One\n\t\t\t<\/div>\n\n\t\t\t<div class=\"h-0.75 mt-4 w-10 bg-green\"><\/div>\n\t\t<\/div>\n\n\t\t\n\t\t<div class=\"px-6 pt-4 pb-7 flex flex-1 flex-col styled-list text-[15px] bg-gray-50 text-gray-500\">\n\t\t\t\t\t\t\t<div class=\"flex-1\">Body text here.<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t\n\t\t\n\t\t\t<\/div>\n\t\n\n\t\t\t<div class=\"card flex flex-col rounded-lg overflow-hidden relative transition-all duration-200 ease-out shadow-sm self-stretch\">\n\t\n\t\t\t\t<div class=\"absolute top-0 left-0 right-0 h-1 bg-linear-to-r from-green to-green-bright\"><\/div>\n\n\t\t<div class=\"p-6 pb-0 pt-7 bg-gray-50\">\n\t\t\t\n\t\t\t<div class=\"uppercase font-bold text-lg tracking-wider leading-tight text-gray-900\">\n\t\t\t\tCard Two\n\t\t\t<\/div>\n\n\t\t\t<div class=\"h-0.75 mt-4 w-10 bg-green\"><\/div>\n\t\t<\/div>\n\n\t\t\n\t\t<div class=\"px-6 pt-4 pb-7 flex flex-1 flex-col styled-list text-[15px] bg-gray-50 text-gray-500\">\n\t\t\t\t\t\t\t<div class=\"flex-1\">Body text here.<\/div>\n\t\t\t\t\t<\/div>\n\n\t\t\n\t\t\n\t\t\t<\/div>\n\t\n\n<\/div>\n\n\t\t<\/div>\n\t\n\t<div class=\"\">\n\t\t<div class=\"flex items-center justify-between px-4 py-2.5\" style=\"background: #181825; border-bottom: 1px solid rgba(255,255,255,.06);\">\n\t\t\t<span class=\"text-[11px] font-medium tracking-wide text-white\/40\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\">Shortcode<\/span>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\t@click=\"navigator.clipboard.writeText(rawCode); copied = true; setTimeout(() => copied = false, 2000)\"\n\t\t\t\tclass=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-[11px] font-medium cursor-pointer transition-all duration-150\"\n\t\t\t\t:class=\"copied\n\t\t\t\t\t? 'bg-green\/20 text-green border border-green\/30'\n\t\t\t\t\t: 'bg-white\/8 text-white\/60 border border-white\/10 hover:bg-white\/14 hover:text-white\/90'\"\n\t\t\t\tstyle=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\"\n\t\t\t>\n\t\t\t\t<template x-if=\"!copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"\/>\n\t\t\t\t\t\t<path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<template x-if=\"copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<polyline points=\"20 6 9 17 4 12\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<span x-text=\"copied ? 'Copied!' : 'Copy'\"><\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t\t<div class=\"rounded-b-lg overflow-x-auto\" style=\"background: #1e1e2e;\">\n\t\t\t<pre class=\"px-5 py-4\"><code x-ref=\"codeSource\" class=\"language-bbcode text-[13px] leading-relaxed\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace; color: #cdd6f4;\">[mu_cards]\n[mu_card title=&quot;Card One&quot; link=&quot;#&quot;]Body text here.[\/mu_card]\n[mu_card title=&quot;Card Two&quot; link=&quot;#&quot;]Body text here.[\/mu_card]\n[\/mu_cards]<\/code><\/pre>\n\t\t<\/div>\n\t<\/div>\n\n<\/div>\n\n<h2>Parameters<\/h2>\n<p>Parameters are passed as key-value pairs inside the opening tag. String values should be wrapped in quotes:<\/p>\n\n<div x-data=\"{ copied: false, rawCode: '' }\" x-init=\"rawCode = $refs.codeSource.textContent\" class=\"mb-12\">\n\n\t\t\t<div class=\"px-6 py-6 border border-b-0 rounded-t-lg border-gray-200 bg-white\">\n\t\t\tThis feature is only available by using the Full Width or Full Width (Hero) template.\n\t\t<\/div>\n\t\n\t<div class=\"\">\n\t\t<div class=\"flex items-center justify-between px-4 py-2.5\" style=\"background: #181825; border-bottom: 1px solid rgba(255,255,255,.06);\">\n\t\t\t<span class=\"text-[11px] font-medium tracking-wide text-white\/40\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\">Shortcode<\/span>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\t@click=\"navigator.clipboard.writeText(rawCode); copied = true; setTimeout(() => copied = false, 2000)\"\n\t\t\t\tclass=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-[11px] font-medium cursor-pointer transition-all duration-150\"\n\t\t\t\t:class=\"copied\n\t\t\t\t\t? 'bg-green\/20 text-green border border-green\/30'\n\t\t\t\t\t: 'bg-white\/8 text-white\/60 border border-white\/10 hover:bg-white\/14 hover:text-white\/90'\"\n\t\t\t\tstyle=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\"\n\t\t\t>\n\t\t\t\t<template x-if=\"!copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"\/>\n\t\t\t\t\t\t<path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<template x-if=\"copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<polyline points=\"20 6 9 17 4 12\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<span x-text=\"copied ? 'Copied!' : 'Copy'\"><\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t\t<div class=\"rounded-b-lg overflow-x-auto\" style=\"background: #1e1e2e;\">\n\t\t\t<pre class=\"px-5 py-4\"><code x-ref=\"codeSource\" class=\"language-bbcode text-[13px] leading-relaxed\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace; color: #cdd6f4;\">[mu_billboard title=&quot;Welcome to Marshall&quot; img=&quot;https:\/\/example.com\/image.jpg&quot;]<\/code><\/pre>\n\t\t<\/div>\n\t<\/div>\n\n<\/div>\n\n<p>In the documentation for each shortcode, parameters marked with a <strong>green code pill<\/strong> are required. All others are optional.<\/p>\n<h2>Wrapper Shortcodes<\/h2>\n<p>Several components use a wrapper\/item pattern, a parent shortcode that controls the overall layout and a child shortcode repeated for each item. Always open and close both tags:<\/p>\n\n<div x-data=\"{ copied: false, rawCode: '' }\" x-init=\"rawCode = $refs.codeSource.textContent\" class=\"mb-12\">\n\n\t\t\t<div class=\"px-6 py-6 border border-b-0 rounded-t-lg border-gray-200 bg-white\">\n\t\t\t\t\n\n\n\n\n\t<div class=\"mt-8 lg:mt-12 grid gap-6 grid-cols-1 lg:grid-cols-3\">\n\t\t\t\t\t<a\n\t\t\t\tclass=\"teaser group block no-underline overflow-hidden relative rounded-2xl min-h-70 transition-all duration-300 ease-out hover:-translate-y-2 hover:shadow-xl\"\n\t\t\t\thref=\"\/cos\/\"\n\t\t\t>\n\t\t\t\t\t\t\t\t<div class=\"absolute inset-0 z-0 overflow-hidden\">\n\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tclass=\"h-full w-full object-cover transition-transform duration-500 ease-out group-hover:scale-105\"\n\t\t\t\t\t\t\tsrc=\"https:\/\/example.com\/cos.jpg\"\n\t\t\t\t\t\t\talt=\"College of Science\"\n\t\t\t\t\t\t\/>\n\t\t\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t\t<div class=\"absolute inset-0 z-1 bg-linear-to-t from-gray-900\/70 via-gray-900\/35 to-gray-900\/10 transition-all duration-300 group-hover:from-gray-900\/75 group-hover:via-gray-900\/40\"><\/div>\n\n\t\t\t\t\t\t\t\t<div class=\"relative z-2 flex flex-col items-center justify-end h-full w-full px-6 py-7\">\n\t\t\t\t\t<span class=\"text-white font-bold text-xl text-center uppercase tracking-wide lg:text-2xl\">College of Science<\/span>\n\n\t\t\t\t\t<div class=\"bg-green h-0.75 w-8 mt-2.5 mx-auto rounded-full transition-all duration-300 ease-out group-hover:w-14\"><\/div>\n\n\t\t\t\t\t<span class=\"flex items-center justify-center w-9 h-9 rounded-full bg-green mt-3.5 transition-all duration-300 ease-out lg:opacity-0 lg:translate-y-2 lg:group-hover:opacity-100 lg:group-hover:translate-y-0\">\n\t\t\t\t\t\t<svg class=\"w-4 h-4 text-white\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\n\t\t\t\t\t<\/span>\n\t\t\t\t<\/div>\n\t\t\t<\/a>\n\t\t\t\t\t<a\n\t\t\t\tclass=\"teaser group block no-underline overflow-hidden relative rounded-2xl min-h-70 transition-all duration-300 ease-out hover:-translate-y-2 hover:shadow-xl\"\n\t\t\t\thref=\"\/cob\/\"\n\t\t\t>\n\t\t\t\t\t\t\t\t<div class=\"absolute inset-0 z-0 overflow-hidden\">\n\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tclass=\"h-full w-full object-cover transition-transform duration-500 ease-out group-hover:scale-105\"\n\t\t\t\t\t\t\tsrc=\"https:\/\/example.com\/cob.jpg\"\n\t\t\t\t\t\t\talt=\"College of Business\"\n\t\t\t\t\t\t\/>\n\t\t\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t\t\t\t<div class=\"absolute inset-0 z-1 bg-linear-to-t from-gray-900\/70 via-gray-900\/35 to-gray-900\/10 transition-all duration-300 group-hover:from-gray-900\/75 group-hover:via-gray-900\/40\"><\/div>\n\n\t\t\t\t\t\t\t\t<div class=\"relative z-2 flex flex-col items-center justify-end h-full w-full px-6 py-7\">\n\t\t\t\t\t<span class=\"text-white font-bold text-xl text-center uppercase tracking-wide lg:text-2xl\">College of Business<\/span>\n\n\t\t\t\t\t<div class=\"bg-green h-0.75 w-8 mt-2.5 mx-auto rounded-full transition-all duration-300 ease-out group-hover:w-14\"><\/div>\n\n\t\t\t\t\t<span class=\"flex items-center justify-center w-9 h-9 rounded-full bg-green mt-3.5 transition-all duration-300 ease-out lg:opacity-0 lg:translate-y-2 lg:group-hover:opacity-100 lg:group-hover:translate-y-0\">\n\t\t\t\t\t\t<svg class=\"w-4 h-4 text-white\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\n\t\t\t\t\t<\/span>\n\t\t\t\t<\/div>\n\t\t\t<\/a>\n\t\t\t<\/div>\n\n\n\t\t<\/div>\n\t\n\t<div class=\"\">\n\t\t<div class=\"flex items-center justify-between px-4 py-2.5\" style=\"background: #181825; border-bottom: 1px solid rgba(255,255,255,.06);\">\n\t\t\t<span class=\"text-[11px] font-medium tracking-wide text-white\/40\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\">Shortcode<\/span>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\t@click=\"navigator.clipboard.writeText(rawCode); copied = true; setTimeout(() => copied = false, 2000)\"\n\t\t\t\tclass=\"flex items-center gap-1.5 px-3 py-1.5 rounded text-[11px] font-medium cursor-pointer transition-all duration-150\"\n\t\t\t\t:class=\"copied\n\t\t\t\t\t? 'bg-green\/20 text-green border border-green\/30'\n\t\t\t\t\t: 'bg-white\/8 text-white\/60 border border-white\/10 hover:bg-white\/14 hover:text-white\/90'\"\n\t\t\t\tstyle=\"font-family: 'JetBrains Mono', ui-monospace, monospace;\"\n\t\t\t>\n\t\t\t\t<template x-if=\"!copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\"\/>\n\t\t\t\t\t\t<path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<template x-if=\"copied\">\n\t\t\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-3.5 w-3.5\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n\t\t\t\t\t\t<polyline points=\"20 6 9 17 4 12\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t\t<\/template>\n\t\t\t\t<span x-text=\"copied ? 'Copied!' : 'Copy'\"><\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t\t<div class=\"rounded-b-lg overflow-x-auto\" style=\"background: #1e1e2e;\">\n\t\t\t<pre class=\"px-5 py-4\"><code x-ref=\"codeSource\" class=\"language-bbcode text-[13px] leading-relaxed\" style=\"font-family: 'JetBrains Mono', ui-monospace, monospace; color: #cdd6f4;\">[mu_feature_row type=&quot;image&quot;]\n[mu_feature_item title=&quot;College of Science&quot; link=&quot;\/cos\/&quot; bg_image=&quot;https:\/\/example.com\/cos.jpg&quot;]\n[mu_feature_item title=&quot;College of Business&quot; link=&quot;\/cob\/&quot; bg_image=&quot;https:\/\/example.com\/cob.jpg&quot;]\n[\/mu_feature_row]<\/code><\/pre>\n\t\t<\/div>\n\t<\/div>\n\n<\/div>\n\n<h2>A Note on Editing<\/h2>\n\n\t\n<div\n\t\tclass=\"bg-gray-50 py-8 mb-6 last:mb-0 first:mt-0 mt-6 first:mb-8\"\n>\n\t<div class=\"w-full xl:container mx-auto px-4\">\n\t\t<div class=\"bg-white flex flex-col lg:flex-row items-start py-6 px-6 ring-4 ring-white\/10 rounded\">\n\n\t\t\t\t\t\t\t<div class=\"flex items-start justify-between shrink-0 mr-2\">\n\t\t\t\t\t<div class=\"text-gray-600 leading-none mt-0.5\"><svg data-slot=\"icon\" class=\"w-6 h-6\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><path d=\"M12 16v-4\"\/><path d=\"M12 8h.01\"\/><\/svg><\/div>\n\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\n\t\t\t<div class=\"flex-1 mt-4 lg:ml-6 lg:mt-0 py-0 pt-4 lg:py-0 lg:px-6 border-t lg:border-t-0 lg:border-l border-gray-900\/10 font-semibold text-gray-900 no-img flex flex-col items-start\">\n\t\t\t\t<div class=\"flex-1\">Shortcodes must be entered in the <strong>Text<\/strong> (HTML) editor tab, not the Visual editor. Switching between editors can sometimes add extra line breaks inside shortcode tags which may cause them to break.<\/div>\n\t\t\t\t\t\t\t<\/div>\n\n\t\t\t\t\t<\/div>\n\t<\/div>\n<\/div>\n\n","protected":false},"excerpt":{"rendered":"<p>Shortcodes are a way to drop pre-built components into any page or post without writing HTML. The Marsha theme includes a library of shortcodes, all prefixed with mu_, that cover everything from alerts and buttons to program listings and image teasers. Basic Usage A shortcode is written inside square brackets with any parameters included as<\/p>\n","protected":false},"author":203,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-sidebar-left.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-468","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/pages\/468","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/users\/203"}],"replies":[{"embeddable":true,"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/comments?post=468"}],"version-history":[{"count":5,"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/pages\/468\/revisions"}],"predecessor-version":[{"id":849,"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/pages\/468\/revisions\/849"}],"wp:attachment":[{"href":"https:\/\/www.marshall.edu\/marsha\/wp-json\/wp\/v2\/media?parent=468"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}