{"id":123177,"date":"2019-09-16T15:20:06","date_gmt":"2019-09-16T19:20:06","guid":{"rendered":"http:\/\/www.bu.edu\/tech\/?page_id=123177"},"modified":"2025-07-03T09:56:01","modified_gmt":"2025-07-03T13:56:01","slug":"adding-promo-boxes","status":"publish","type":"page","link":"https:\/\/www.bu.edu\/tech\/services\/cccs\/websites\/www\/wordpress\/how-to\/bu-landing-pages\/adding-promo-boxes\/","title":{"rendered":"Adding Promo Boxes"},"content":{"rendered":"<style type=\"text\/css\">\n.content .entry ul li.plugin-tag-request::before { display: none; }<br \/>.content .entry ul.plugin-tags { padding-left: 0; }<br \/><\/style>\n<ul class=\"plugin-tags\">\n<li class=\"plugin-tag-request\" style=\"list-style-type: none; margin-left: 0; display: block;\">BU Landing Pages is available for sites using the BU Responsive Framework 2.x theme or custom themes based on Responsive 2.x.<\/li>\n<\/ul>\n<p>There are up to three sets of promo boxes that you are able to choose from and add using the Landing Page plug-in. Out of the box, they have default functionality and styles:<\/p>\n<ul>\n<li><img src=\"\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-4.37.20-PM.png\" alt=\"\" size-full=\"\" wp-image-123210=\"\" style=\"margin-top: 0px; vertical-align: sub;\" width=\"20\" \/> <strong>Promo Space 1:<\/strong> can hold up to eight promo boxes<\/li>\n<li><img src=\"\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-4.37.28-PM.png\" alt=\"\" size-full=\"\" wp-image-123209=\"\" style=\"margin-top: 0px; vertical-align: sub;\" width=\"20\" \/> <strong>Large Promo Box:<\/strong> one full-width promo area<\/li>\n<li><img src=\"\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-4.37.36-PM.png\" alt=\"\" size-full=\"\" wp-image-123208=\"\" style=\"margin-top: 0px; vertical-align: sub;\" width=\"20\" \/> <strong>Promo Space 2<\/strong> can hold up to eight promo boxes<\/li>\n<\/ul>\n<h3 id=\"promo\">Promo Space 1 &amp; Promo Space 2<\/h3>\n<p><img loading=\"lazy\" src=\"\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-3.34.42-PM.png\" alt=\"\" class=\"alignnone size-full wp-image-123218\" width=\"1905\" height=\"1018\" srcset=\"https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-3.34.42-PM.png 1905w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-3.34.42-PM-636x340.png 636w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-3.34.42-PM-768x410.png 768w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-16-at-3.34.42-PM-1024x547.png 1024w\" sizes=\"(max-width: 1905px) 100vw, 1905px\" \/><\/p>\n<p><img loading=\"lazy\" src=\"\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-1.06.11-PM.png\" alt=\"\" class=\"alignnone size-full wp-image-123230\" width=\"2392\" height=\"1016\" srcset=\"https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-1.06.11-PM.png 2392w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-1.06.11-PM-636x270.png 636w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-1.06.11-PM-768x326.png 768w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-1.06.11-PM-1024x435.png 1024w\" sizes=\"(max-width: 2392px) 100vw, 2392px\" \/><\/p>\n<p>Both Promo Space 1 and 2 have the same exact options\/metaboxes. Promo box spaces can consist of:<\/p>\n<ul>\n<li><strong>Promo Space Title:<\/strong>\u00a0the title for that set of promo boxes<\/li>\n<li><strong>Promo Space Copy:<\/strong>\u00a0the description or intro copy for that set of promo boxes<\/li>\n<li><strong>Title:<\/strong>\u00a0the title of an individual promo box<\/li>\n<li><strong>Image:<\/strong>\u00a0a header image of an individual promo box<\/li>\n<li><strong>Text:<\/strong>\u00a0the description or excerpt for an individual promo box<\/li>\n<li><strong>Button Text:<\/strong>\u00a0the button text on the button that links out to the promoted page or article. The default text is <em>Read More<\/em> if not filled out<\/li>\n<li><strong>Button Link<\/strong>\u00a0the link to the promoted page or article<\/li>\n<\/ul>\n<p>The only metaboxes you need to fill out in order for these sections to show up are the <strong>Title<\/strong> and <strong>Button Link<\/strong> metaboxes.<\/p>\n<p>In order to fill out the metaboxes for an individual promo box, click into the dropdowns or Add Another Promo Box, and then do so:<\/p>\n<p><img loading=\"lazy\" src=\"\/tech\/files\/2019\/09\/Screen_Shot_2019-09-17_at_1_03_06_PM-3.png\" alt=\"\" class=\"alignnone size-full wp-image-123234\" width=\"1580\" height=\"1448\" srcset=\"https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen_Shot_2019-09-17_at_1_03_06_PM-3.png 1580w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen_Shot_2019-09-17_at_1_03_06_PM-3-636x583.png 636w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen_Shot_2019-09-17_at_1_03_06_PM-3-768x704.png 768w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen_Shot_2019-09-17_at_1_03_06_PM-3-1024x938.png 1024w\" sizes=\"(max-width: 1580px) 100vw, 1580px\" \/><\/p>\n<h3 id=\"large\">Large (Full-Width) Space<\/h3>\n<p><img loading=\"lazy\" src=\"\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-2.06.26-PM.png\" alt=\"\" class=\"alignnone size-full wp-image-123239\" style=\"border: 1px solid #ddd;\" width=\"2684\" height=\"1328\" srcset=\"https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-2.06.26-PM.png 2684w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-2.06.26-PM-636x315.png 636w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-2.06.26-PM-768x380.png 768w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/Screen-Shot-2019-09-17-at-2.06.26-PM-1024x507.png 1024w\" sizes=\"(max-width: 2684px) 100vw, 2684px\" \/><\/p>\n<p>The large promo space is treated a little differently. Instead of having up to eight boxes, you are provided with one full-width promo box, that supports three types of layout options.<\/p>\n<p>Large (Full-Width) Space can consist of:<\/p>\n<ul>\n<li><strong>Layout:<\/strong>\u00a0the different layout options you can choose from. Options include: Image Full Background, Image Left, and Image Right<\/li>\n<li><strong>Promo Space Title:<\/strong>\u00a0the title of the promo box<\/li>\n<li><strong>Promo Space Copy:<\/strong>\u00a0the description or copy for the promo box<\/li>\n<li><strong>Image:<\/strong>\u00a0a header image of an individual promo box<\/li>\n<li><strong>Button Text:<\/strong>\u00a0the button text on the button that links out to the promoted page or article. The default text is <em>Read More<\/em> if not filled out<\/li>\n<li><strong>Button Link<\/strong>\u00a0the link to the promoted page or article<\/li>\n<\/ul>\n<p>The only metaboxes you need to fill out in order for this sections to show are the <strong>Promo Space Title<\/strong>, <strong>Image<\/strong>, and <strong>Button Link<\/strong> metaboxes.<\/p>\n<p><img loading=\"lazy\" src=\"\/tech\/files\/2019\/09\/screencapture-bun-cms-devl-bu-edu-bu-landing-pages-wp-admin-post-php-2019-09-17-14_03_12.png\" alt=\"\" class=\"alignnone size-full wp-image-123240\" width=\"1859\" height=\"2396\" srcset=\"https:\/\/www.bu.edu\/tech\/files\/2019\/09\/screencapture-bun-cms-devl-bu-edu-bu-landing-pages-wp-admin-post-php-2019-09-17-14_03_12.png 1859w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/screencapture-bun-cms-devl-bu-edu-bu-landing-pages-wp-admin-post-php-2019-09-17-14_03_12-493x636.png 493w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/screencapture-bun-cms-devl-bu-edu-bu-landing-pages-wp-admin-post-php-2019-09-17-14_03_12-768x990.png 768w, https:\/\/www.bu.edu\/tech\/files\/2019\/09\/screencapture-bun-cms-devl-bu-edu-bu-landing-pages-wp-admin-post-php-2019-09-17-14_03_12-794x1024.png 794w\" sizes=\"(max-width: 1859px) 100vw, 1859px\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>BU Landing Pages is available for sites using the BU Responsive Framework 2.x theme or custom themes based on Responsive 2.x. There are up to three sets of promo boxes that you are able to choose from and add using the Landing Page plug-in. Out of the box, they have default functionality and styles: Promo&#8230;<\/p>\n","protected":false},"author":10779,"featured_media":0,"parent":122771,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/pages\/123177"}],"collection":[{"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/users\/10779"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/comments?post=123177"}],"version-history":[{"count":28,"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/pages\/123177\/revisions"}],"predecessor-version":[{"id":158586,"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/pages\/123177\/revisions\/158586"}],"up":[{"embeddable":true,"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/pages\/122771"}],"wp:attachment":[{"href":"https:\/\/www.bu.edu\/tech\/wp-json\/wp\/v2\/media?parent=123177"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}