{"id":1112,"date":"2020-09-02T13:42:31","date_gmt":"2020-09-02T17:42:31","guid":{"rendered":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/platforms\/nc-state-stories\/enhanced-news-add-on\/sandwich-narrative-block\/"},"modified":"2022-09-13T01:49:45","modified_gmt":"2022-09-13T05:49:45","slug":"sandwich-narrative-block","status":"publish","type":"page","link":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/products\/nc-state-stories\/enhanced-news-add-on\/sandwich-narrative-block\/","title":{"rendered":"Sandwich Narrative Block"},"content":{"rendered":"\n<p>While the main post content sets the stage and gives full details on a particular topic, the Sandwich Narrative block allows users to present a secondary, short-but-relevant story embedded directly within the original narrative that can add additional context, emphasize a point, or simply add more interest to the current story. <\/p>\n\n\n\n<p>Longer content may be hidden behind a collapsible area so that users can choose to continue reading more if they want, but can also continue reading the main story without needing to scroll past a larger distraction.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1790\" height=\"1438\" src=\"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-collapse-example.gif\" alt=\"\" class=\"wp-image-1126\"\/><\/figure>\n\n\n\n<p>Within the editor, the dotted outlined area denotes where content to be hidden should be entered.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"539\" src=\"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-editor-screenshot-1024x539.png\" alt=\"\" class=\"wp-image-1128\" srcset=\"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-editor-screenshot-1024x539.png 1024w, https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-editor-screenshot-300x158.png 300w, https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-editor-screenshot-768x404.png 768w, https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-editor-screenshot-1536x808.png 1536w, https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-content\/uploads\/2020\/09\/sandwich-narrative-editor-screenshot-2048x1078.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Additional options include background color, whether to use an image, and customization of the &#8220;Expand to Read More&#8221; call to action.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Image Recommendations<\/h2>\n\n\n\n<p>While a variety of different image sizes could work well in this block, a good start is the typical 16:9 1500px x 844px for landscape images or the inverse portrait style  in the 9:16 ratio (844px x 1500px). <\/p>\n\n\n\n<p>Images of other sizes (especially larger) are fine, though it&#8217;s good to keep in mind how certain images may look when viewed on a mobile device. For example, an extremely tall portrait-style image (5000px tall by 50px wide, for example) could be less than ideal for the mobile experience where the image and text stack over eachother. When in doubt, simply resize your desktop browser screen for a rough estimate of the mobile experience.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Block Availability<\/h2>\n\n\n\n<p>This block is available on all Immersive Template style posts.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Need help?<\/h2>\n\n\n\n<p>Have questions? Feel free to reach out with any questions or concerns at\u00a0<a href=\"http:\/\/go.ncsu.edu\/ucomm-dev-request\">go.ncsu.edu\/ucomm-dev-request<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>While the main post content sets the stage and gives full details on a particular topic, the Sandwich Narrative block allows users to present a secondary, short-but-relevant story embedded directly&hellip;<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":209,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":{"ncst_dynamicHeaderBlockName":"ncst\/default-header","ncst_dynamicHeaderData":"{\"pageIntro\":\"A block with a collapsible area, intended to showcase a secondary story relevant to the current post without directing the user elsewhere.\"}","ncst_content_audit_freq":"","ncst_content_audit_date":"","footnotes":"","_links_to":"","_links_to_target":""},"acf":[],"_links":{"self":[{"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/pages\/1112"}],"collection":[{"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/comments?post=1112"}],"version-history":[{"count":8,"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/pages\/1112\/revisions"}],"predecessor-version":[{"id":3032,"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/pages\/1112\/revisions\/3032"}],"up":[{"embeddable":true,"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/pages\/209"}],"wp:attachment":[{"href":"https:\/\/dev.ucomm.ncsu.edu\/documentation\/wp-json\/wp\/v2\/media?parent=1112"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}