Step-by-Step Guide to Using the Template<\/h2>\n\n\n\nSet up the Interactive Tabs<\/h3>\n\n\n\n\n- Edit tab labels to match your content, you can double click on the tab text (in blue) or select the tab and edit on the settings tab:
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfz_g67VOLy5YehRklzrQSTJpYnGREWb7bgab9xJx8wV02St5CyE3PXxEvVo1EFc_o-7IyJzqUK_6aHExi_Z9TxLxUPPmIKaUv-Ozn0H1K6_aIJMksSkwORHEAKVPfecaPmNT21?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n\n\n\n - Add the content you desire in the Tab Section container.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfjZGNaHuGKpCsOZMASkG1Tlga-swqZiYeI7uG7Iq9-2PwMqqWe2vf9UaFPBaY9_X08Tz3EpxG7EN9DqnLW21z6lOT7waJDyrTcE-jA-kXMkVqDStwO2JrQxVuj0qEoSzOVDKCtow?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n\n\n\n - Add CTA links if necessary, and further personalize it with button micro-theme.<\/li>\n\n\n\n
- Customize using the micro-themes Pods.<\/li>\n<\/ul>\n\n\n\n
Index reveals<\/h3>\n\n\n\n\n- There are 4 sections linking to the Index page, they are all anchored to the respective section. Selecting the container that holds the reveal, add an action to them with an anchor, the anchor must have an unique name.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcwFwA-lfAQhVfbY7FE_0fnEZmL9HATyKi9Z2Ztyf0zXqYUyqUc32YN8BC_nkT8fCp_O8huoQoOQdkQxLc9B8r3eHCeu6uGzfsipQB4a14cvz0EqCE7SMMMxxI5yJ3wY54W4IMc3A?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n\n\n\n - On the Index page, select the Region Container and on the top right click on the anchor icon.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXfHCrPoWIc_qMPekVN2F-Z0Gp5FK2ozK9kdcN2Ir147pK1SbuJ4JKtFVBhnPj2QCuokGPpNevIdEstVgkLAbEKf3xNY_CdRPEs8T7d37nQ58vDibiRW98i8UX9cVmzLSOhIEZM5?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n\n\n\n - Give it the same unique name used before and hit save.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXeHTWQB9zzCJ_FI8D_1LGd4aIzfYL7ACpQN20QvjnF0zQ8OJAvlkp3zoEL_c1r9VZ7WYaC46MVXSdDDorOTRPecg0e_I0hIY4eNgnjR7fEyHgqtuB91KmiRNwI1RPs9LkJXraB-?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n<\/ul>\n\n\n\nSetting the chapter Flow<\/h3>\n\n\n\n\n- To add a Flow Step navigation is simple. Add a link and on the Design tab, under Buttons and Links, add a Link style. In this case we are using the Back Link.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcBlIPZbYOfOWJWLSzF5Szkx-Q5Y1fXNACqKaWIjZtpzZUTz3lko_mDwSyWYKmdJh6Z1sqA8muJEeGKou9V7mtiWxLB-Qn_mfDAaYAZyjvgSlL39yTqMnURjoprAG8IzE4IBlsRyw?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n\n\n\n - After styling the link, let\u2019s add an action to it. To add it, click on the Settings tab open Behaviors.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXcWk_JeZzujN-0siL5-TUquHY0NrcOI-LaUIpORiISgZRtlC9KSkDxJM9U5SDYAx7jfW0tSvsMWF3kNOV6IGzSIaHMI3dJ2B8-oU70kiHRzLASI8B4zIeeDF3BELlygtSjzxvKU?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n\n\n\n - On the Behaviors in Flow accordion, select the action desired, in this case, go to the previous flow step. Save it by clicking Apply.
![](\"https:\/\/lh7-rt.googleusercontent.com\/docsz\/AD_4nXdwtfX6pKUxm29qtF8SdTRVLsod96Qhqn2HcOGONN5QI_REQlAfJO1GtTthSPlrpQGi_qSzXGlBnYOJTuCfDhowDIPuYfSJihG59aKKEZeqMT5ou9QAl84yTLBFkeWYNuNlC0p_uQ?key=Fklr0F2xVoyZ7_6-TRAwtg\")
<\/li>\n<\/ul>\n\n\n\nTest and Publish<\/h3>\n\n\n\n
Before publishing, preview your Magazine White Paper on all viewports to ensure everything looks right. Verify that all accordion tabs, index links, and chapter flows work seamlessly, and test any interactive elements. Once everything checks out, your polished white paper is ready to engage your audience!<\/p>\n","protected":false},"excerpt":{"rendered":"
The Magazine White Paper template lets you create a professional interactive magazine with a clean, structured layout. It features a hero section, intro text, and tabbed navigation leading to an organized index with 4 […]<\/p>\n","protected":false},"author":21,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"nf_dc_page":"","footnotes":""},"categories":[1088,2107,39],"tags":[],"class_list":["post-7607","post","type-post","status-publish","format-standard","hentry","category-content-driven-templates","category-ion-templates","category-the-templates-gallery"],"_links":{"self":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/7607","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/users\/21"}],"replies":[{"embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/comments?post=7607"}],"version-history":[{"count":1,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/7607\/revisions"}],"predecessor-version":[{"id":7608,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/7607\/revisions\/7608"}],"wp:attachment":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/media?parent=7607"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/categories?post=7607"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/tags?post=7607"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- \n
- Edit tab labels to match your content, you can double click on the tab text (in blue) or select the tab and edit on the settings tab:
<\/li>\n\n\n\n - Add the content you desire in the Tab Section container.
<\/li>\n\n\n\n - Add CTA links if necessary, and further personalize it with button micro-theme.<\/li>\n\n\n\n
- Customize using the micro-themes Pods.<\/li>\n<\/ul>\n\n\n\n
Index reveals<\/h3>\n\n\n\n
- \n
- There are 4 sections linking to the Index page, they are all anchored to the respective section. Selecting the container that holds the reveal, add an action to them with an anchor, the anchor must have an unique name.
- On the Index page, select the Region Container and on the top right click on the anchor icon.
- Give it the same unique name used before and hit save.
Setting the chapter Flow<\/h3>\n\n\n\n
- \n
- To add a Flow Step navigation is simple. Add a link and on the Design tab, under Buttons and Links, add a Link style. In this case we are using the Back Link.
- After styling the link, let\u2019s add an action to it. To add it, click on the Settings tab open Behaviors.
<\/li>\n\n\n\n - On the Behaviors in Flow accordion, select the action desired, in this case, go to the previous flow step. Save it by clicking Apply.
<\/li>\n<\/ul>\n\n\n\nTest and Publish<\/h3>\n\n\n\n
Before publishing, preview your Magazine White Paper on all viewports to ensure everything looks right. Verify that all accordion tabs, index links, and chapter flows work seamlessly, and test any interactive elements. Once everything checks out, your polished white paper is ready to engage your audience!<\/p>\n","protected":false},"excerpt":{"rendered":"
The Magazine White Paper template lets you create a professional interactive magazine with a clean, structured layout. It features a hero section, intro text, and tabbed navigation leading to an organized index with 4 […]<\/p>\n","protected":false},"author":21,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"nf_dc_page":"","footnotes":""},"categories":[1088,2107,39],"tags":[],"class_list":["post-7607","post","type-post","status-publish","format-standard","hentry","category-content-driven-templates","category-ion-templates","category-the-templates-gallery"],"_links":{"self":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/7607","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/users\/21"}],"replies":[{"embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/comments?post=7607"}],"version-history":[{"count":1,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/7607\/revisions"}],"predecessor-version":[{"id":7608,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/7607\/revisions\/7608"}],"wp:attachment":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/media?parent=7607"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/categories?post=7607"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/tags?post=7607"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- To add a Flow Step navigation is simple. Add a link and on the Design tab, under Buttons and Links, add a Link style. In this case we are using the Back Link.
- There are 4 sections linking to the Index page, they are all anchored to the respective section. Selecting the container that holds the reveal, add an action to them with an anchor, the anchor must have an unique name.