Assign a theme to a component
In SXA, you can style your components using themes. Themes let you change the style of an existing component, for example, because of company branding changes or if you want a holiday edition, without interfering with the content.
To assign a theme to a component:
In the Content Editor, navigate to Site, Presentation, and click Component Themes.
Under Compatible Renderings, select the components that you want to assign themes to. You can assign the same theme to several components, and you can assign several themes to any component. You can also assign themes to specific components used in composite renderings.
Under Component Themes, select the themes you want to assign. You can select from both Site Themes and Base Themes.Note
If you remove the compatible rendering components that you selected, SXA always injects the themes selected under Component Themes on the page.
Under Priority, select the display priority for the component theme. You can chose the display After Site Themes, which is the default, or Before Base Themes.
This functionality works for both sites and shared sites. SXA injects themes from shared sites before component themes on main sites.