{"id":130,"date":"2023-04-06T11:53:56","date_gmt":"2023-04-06T11:53:56","guid":{"rendered":"https:\/\/obo.zoj.mybluehost.me\/?p=130"},"modified":"2026-02-02T12:54:49","modified_gmt":"2026-02-02T12:54:49","slug":"what-is-an-ion-theme","status":"publish","type":"post","link":"https:\/\/ioninteractive.com\/ionacademy\/what-is-an-ion-theme\/","title":{"rendered":"What is an Ion Theme"},"content":{"rendered":"\n<p class=\"\">In a nutshell, a theme in Ion is a comprehensive stylesheet that houses your brand\u2019s style guidelines, keeping your branding guidelines consistent with point-and-click ease.<\/p>\n\n\n\n<p class=\"\">The theme is centralized, making universal improvements, adjustments and even re-brands as straightforward as updating the theme.<\/p>\n\n\n\n<figure class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube\"><div class=\"wp-block-embed__wrapper\">\n<div class=\"video_fit_container\"><iframe loading=\"lazy\" title=\"[EN] 7.2 Company&#039;s Theme and Branding\" width=\"960\" height=\"540\" src=\"https:\/\/www.youtube.com\/embed\/Q5KWqdgjXx8?list=PLrzGWAZ8_gVFCFVPITd687F_5q7WyvDdV\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/div>\n<\/div><\/figure>\n\n\n\n<p class=\"\">Through a simple dropdown, apply your theme and instantly update any creative in Ion to utilize your brand guidelines. You will then be able to apply micro-themes to individual elements like buttons, fonts, logos and more to make quick style changes that stay within your brand&#8217;s style guidelines.&nbsp;<\/p>\n\n\n\n<p class=\"\">Let\u2019s see how extremely powerful your Ion Theme is!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What is themes in Ion<\/strong><\/h2>\n\n\n\n<p class=\"\">As part of your Ion console setup, we will code one branded theme that can be applied to your Ion experiences. Your theme includes brand-approved styling that controls the look and feel of your creative.<\/p>\n\n\n\n<p class=\"\">For example, when you apply your theme to a template creative, the fonts for that creative will be updated to use your brand-approved fonts, buttons will take on brand-approved colors and your logo will appear in the top left corner of the page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"608\" loading=\"lazy\" src=\"https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-5-1024x608.png\" alt=\"\" class=\"wp-image-8666\" srcset=\"https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-5-1024x608.png 1024w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-5-300x178.png 300w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-5-768x456.png 768w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-5-1536x912.png 1536w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-5.png 1712w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"\">Before editing any creative you download from the Ion\u2019s Templates Gallery, you will want to apply your branded theme to the creative to ensure that it utilizes brand-approved styling that is loaded into your theme.<\/p>\n\n\n\n<p class=\"\">After downloading a template, you can quickly change the theme by selecting your branded theme from the theme dropdown menu on your creative management screen.&nbsp;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What are micro-themes in Ion<\/strong><\/h2>\n\n\n\n<p class=\"\">Your Ion Theme comes with tons of micro-themes that allow you to quickly change the style of the content on your page.<\/p>\n\n\n\n<figure class=\"wp-embed-aspect-16-9 wp-has-aspect-ratio wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo\"><div class=\"wp-block-embed__wrapper\">\n<div class=\"video_fit_container\"><iframe loading=\"lazy\" title=\"Micro-Themes\" src=\"https:\/\/player.vimeo.com\/video\/138019108?dnt=1&amp;app_id=122963\" width=\"960\" height=\"540\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write\"><\/iframe><\/div>\n<\/div><\/figure>\n\n\n\n<p class=\"\">By using Micro-Themes, you will be able to create hundreds of on-brand page style combinations using a single theme that is based off of your site\u2019s brand guidelines!<\/p>\n\n\n\n<p class=\"\">Micro-Themes are content-specific. So, if you\u2019re editing a link, you\u2019ll see Micro-Themes that are specific to styling links. But if you\u2019re editing text, you\u2019ll see Micro-Themes that are specific to styling text.&nbsp;<\/p>\n\n\n\n<p class=\"\">When editing a container, you can use Micro-Themes to apply variations of styling options built into your theme. This gives you the ultimate control over how your page is styled within the safe and consistent standards built into your branded theme. For instance, you can style any group of links as either your main navigation tabs or as footer links. You can also apply different color and style schemes to your content pods, forms, and other page elements, to create an alternate, on-brand look and feel to your page.&nbsp;<\/p>\n\n\n\n<p class=\"\">Simply select your container and then click into the Micro-Themes button within your creative studio. Next, select the style category you would like to use (i.e. navigation, pods, buttons, etc.) and then the type of styling you would like to apply to your container.<\/p>\n\n\n\n<p class=\"\">Here you can see two different Micro-Themes being applied to a container. All of the styling \u2014 text colors, background, button, etc. \u2014 are different based on the chosen Micro-Theme.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"800\" height=\"317\" loading=\"lazy\" src=\"https:\/\/obo.zoj.mybluehost.me\/wp-content\/uploads\/2022\/12\/image-02.jpg\" alt=\"\" class=\"wp-image-261\" srcset=\"https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2022\/12\/image-02.jpg 800w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2022\/12\/image-02-300x119.jpg 300w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2022\/12\/image-02-768x304.jpg 768w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/figure>\n\n\n\n<p class=\"\">Micro-Themes can also be used for smaller style changes like turning a text link into a button link.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"800\" height=\"344\" loading=\"lazy\" src=\"https:\/\/obo.zoj.mybluehost.me\/wp-content\/uploads\/2023\/04\/image-03.jpeg\" alt=\"\" class=\"wp-image-262\" srcset=\"https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-03.jpeg 800w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-03-300x129.jpeg 300w, https:\/\/ioninteractive.com\/ionacademy\/wp-content\/uploads\/2023\/04\/image-03-768x330.jpeg 768w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/figure>\n\n\n\n<p class=\"\">If you\u2019d like a new ion theme with Micro-Theme capability, reach out to your Customer Success Manager to talk about next steps!<\/p>\n\n\n\n<p class=\"\">If you are working within a theme that has Micro-Themes defined but are not able to find the Micro-Theme option in your creative studio, you may have something selected for which no Micro-Themes are designed. When in doubt, find the container for your content (its row, column, responsive grid, etc.), press the up arrow on your keyboard.Now that you already know everything about how to scale the creation of your interactive content experiences in Ion by leveraging your branded theme, <a href=\"https:\/\/ioninteractive.com\/platform\/\">let\u2019s explore other powerful capabilities of the platform<\/a> to take your interactive content strategy to the next level.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In a nutshell, a theme in Ion is a comprehensive stylesheet that houses your brand\u2019s style guidelines, keeping your branding guidelines consistent with point-and-click ease. The theme is centralized, making universal improvements, adjustments and [&hellip;]<\/p>\n","protected":false},"author":8,"featured_media":5286,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"nf_dc_page":"","footnotes":""},"categories":[2030,7],"tags":[2129,2127],"class_list":["post-130","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ion-themes","category-the-themes","tag-branding","tag-ion-themes"],"_links":{"self":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/130","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\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/comments?post=130"}],"version-history":[{"count":4,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/130\/revisions"}],"predecessor-version":[{"id":8667,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/posts\/130\/revisions\/8667"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/media\/5286"}],"wp:attachment":[{"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/media?parent=130"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/categories?post=130"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ioninteractive.com\/ionacademy\/wp-json\/wp\/v2\/tags?post=130"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}