Customizing the CSS styles of social lists | HCL Digital Experience

The lists of social objects rely on the availability of several CSS class definitions in the wp_social_rendering_85 theme module.

About this task

Pages that render the sample items must use a theme profile that includes the wp_social_rendering_85 theme module or another module that contains the same CSS class definitions. An example of such a theme profile is the Basic Content theme profile that is installed by default.

The wp_social_rendering_85 theme module includes a single CSS file that is named sr.css. This style sheet is loaded from the following directory location: PortalServer_root/theme/wp.theme.modules/webapp/installedApps/ThemeModules.ear/ThemeModules.war/modules/sr/v8.5/css/sr.css.

The wp_social_rendering_85 theme module defines the capability with the name social_rendering_85 and the version 8.5. No prerequisites are required to use this theme module.

Style sheet note: The lists of social objects use CSS styles that render differently, depending on the layout container that contains the social list web content viewer. Different classification CSS classes are assigned to these layout containers. As a result, the styles change when a social list web content viewer is moved from the center column into a narrower side column or vice versa. Furthermore, the styles are responsive to screen width and screen orientation. This responsiveness is achieved by using HTML5 and CSS3 media queries.