Lightning Communities Developer Guide

Get Up to Speed with Lightning Communities
Develop Lightning Communities: The Basics
Customize the Look and Feel of a Lightning Template
Update a Template with the Theme Panel
Override Template Elements with Custom CSS
Migrate CSS Overrides
CSS Overrides Migration for the Navigation Menu
CSS Overrides Migration for the Panels Container
CSS Overrides Migration for the Record Banner Component
CSS Overrides Migration for the Record Detail Component
CSS Overrides Migration for the Record Layout Component
CSS Overrides Migration for the Record List Component
CSS Overrides Migration for the Record Related List Component
CSS Overrides Migration for the Related Articles Component
CSS Overrides Migration for the Reputation Leaderboard Component
CSS Overrides Migration for the Embedded Service Sidebar Header Component
CSS Overrides Migration for Trending Articles by Topic Component
Use Custom Fonts in Your Community
Customize the Theme Layout of Your Template
Create Custom Content Layout Components for Communities
Configure Swappable Search and Profile Menu Components
Standard Design Tokens for Communities
Example: Build a Condensed Theme Layout Component
Develop Secure Code: Lightning Locker and Stricter CSP
Analyze and Improve Community Performance
Use a CMS with Your Community
Report on Deflections: The Deflection Signals Framework
Deploy a Community from Sandbox to Production
PDF

Newer Version Available

This content describes an older version of this product. View Latest

CSS Overrides Migration for the Related Articles Component

Some CSS selectors for the Related Articles component changed with the Lightning communities update. If you plan to continue using custom CSS overrides, migrate them forward after you update the template.

This topic identifies selector changes.

  • Use custom CSS sparingly because template updates might not support your customizations.
  • Custom CSS is now shared across all your community pages. If you used custom CSS for Login pages, copy it and close the CSS editor. Then navigate to a non-Login page, reopen the editor, and add the custom CSS.

Note

Full Related Articles

Previous Selector New Selector
.selfServiceSimilarArticles

.base-items

.uiAbstractList

.selfServiceBaseSimpleItems

 .comm-related-articles

Component Title

Previous Selector New Selector
.selfServiceSimilarArticles h2

.selfServiceSimilarArticles .base-items-header

 .comm-related-articles h2

Article List

Previous Selector New Selector
.selfServiceSimilarArticles ul

.selfServiceSimilarArticles .base-items

 .comm-related-articles ul

Article List Items

Previous Selector New Selector
.selfServiceSimilarArticles .base-simple-item .comm-related-articles li

.selfServiceSimilarArticles .base-simple-item

.comm-related-articles li

.comm-related-articles .comm-related-articles__item

Article Links

Previous Selector New Selector
.selfServiceSimilarArticles .item-title

.selfServiceSimilarArticles .item-title-link

 .comm-related-articles li a

.selfServiceSimilarArticles .item-title

.selfServiceSimilarArticles .item-title-link

.comm-related-articles li a

.comm-related-articles .comm-related-articles__item a