How to Make the Style Options the Same for All Versions of an App
Update! We have released the Bulk Style Editor. With it, you can edit the styling of multiple items (apps, text, containers, etc) at the same time and from a single panel within our website maker! Check it out, it will help you design faster.
About the “Propagate App Style to All Pages” Option
In this article, you will learn how to make an app have the same styling options throughout your whole site. This way, all installed versions of that app will share the style, and if you update it in one page, changes will be reflected in all of them.
You would want to have the same styling in apps that remain the same throughout your site, such as items in the header, footer or some sidebars. For example: you may have a main menu (Navigation app), your logo (Image app), and a tagline (Text app) in the header. They all may have different styles (such as backgrounds, borders, drop shadows, etc) in each page. The following diagram illustrates this (with style propagation off).
But most probable, you’ll want to have the same styling for each version on all of your pages. So enabling it for each app, will make these styles consistent (propagate them) across your site. You don’t have to be on the home page to enable it. But note that the style will propagate using that app (on the specific page you’re currently editing) as a “base”. On from that moment on, all of them could be considered the base, since a change in any page will update the rest of them.
Take a look at the image below, which represents how the styles propagate from the home page (where the checkbox was selected) to the other pages of your site.
The same with the footer, you may have a navigation menu and some copyright information. So if you need to change the style of these apps, it will be updated in all the pages where you have that version installed.
App’s content is propagated (shared) by default. Learn more about app versions and content propagation on this how-to. You can have an app version that shares content and the style propagation turned on or off for that same app. But you can’t turn off content propagation.
How Does it Work?
When you install an app, a version is created. When you create a new page, you can copy all the apps’ versions on the current page you are on, to the new one.
The copied versions, will have the same content. So if for example you had a Navigation app in the first page you were working on, and when you created a new one you copied that Navigation app, you will have the same items of your original navigation on both pages.
Making Changes on an App
If you make a content or settings change to your navigation in any of the pages where it’s installed, changes will be reflected in all of those pages.
If the style propagation checkbox is enabled, that also includes the styling dot options, like backgrounds, margins, padding, borders, drop shadow, and more.
How to Disable the “Propagate Style” Feature
If you uncheck the “Propagate Style to All Pages” option, styling will be managed independently on that app. This option is enabled (checked) by default.
To access the settings of any app, go to the top of the app and find the app toolbar. In all apps is depicted by a wrench icon.
So if you want the styles for a given app to be consistent among all your pages, you must enable this option. Remember that, wherever you enable it (the page you’re editing on that moment), that app will be the base whose styles will be copied over the rest of pages (for that app version only).
Are we missing something? Please ask on the comments!