Customizing Widget Appearance

The Sociable Reviews widget includes a footer that reads “Powered by Sociable Reviews”. You can hide this footer or customize other widget elements using CSS.

Hiding the Widget Footer

To hide the “Powered by Sociable Reviews” footer, add the following CSS:

.sociable-widget-footer { display: none !important; }

Hiding Other Widget Elements

Hide Review Source Labels

To hide the “via Google” / “via Facebook” / “via Trustpilot” text on each review:

.sociable-review-source { display: none !important; }

Hide “Read More” Links

To hide the links to original reviews on each platform:

.sociable-read-more-container { display: none !important; }

Hide Review Dates

`.sociable-review-date {
display: none !important;
}`

Hide Reviewer Avatars

`.sociable-reviewer-image {
display: none !important;
}`

How to Add Custom CSS

Method 1: Shopify Theme Customizer

1. Go to Online Store → Themes → Customize.
2. Navigate to the page containing your Sociable Reviews block.
3. Click on the Sociable Reviews block in the sidebar.
4. If your theme supports a Custom CSS field for the block, paste the CSS there.
5. Click Save.

Method 2: Theme Code Editor

1. Go to Online Store → Themes.
2. Click Actions → Edit code.
3. Open your theme’s CSS file (commonly assets/base.css or assets/theme.css).
4. Add the CSS at the end of the file.
5. Click Save.

Adjusting Spacing

After hiding elements, you may want to adjust spacing:

`/* Reduce top padding after hiding elements */ .sociable-reviews { padding-top: 10px !important; }

/* Adjust review card padding */ .sociable-review-card { padding: 12px !important; }`

Troubleshooting

• Clear your browser cache and reload the page after adding CSS.
• Make sure you are editing the active theme.
• If styles are not applying, ensure you have included !important in your CSS rules.

If you need help with CSS changes, contact us at support@soviapps.com.