How to Use Custom CSS in Feedspace Widgets

Overview

Feedspace lets you apply Custom CSS to any widget directly from the widget editor. Use it to adjust fonts, colors, spacing, and typography to match your website’s design.

Custom CSS is available on plans that include it. If your current plan does not, turning on the Custom CSS toggle opens an upgrade prompt instead of the code box.

Step 1: Open widget settings

1. Log in to your Feedspace account.
2. Click Widgets in the left sidebar.
3. Click the Pencil (Edit) icon on the widget card to open the editor.
4. Click the Design tab.

Step 2: Access the Custom CSS option

1. In the settings panel on the right, scroll down to the Advanced Customization section.
2. Turn on the Custom CSS toggle.
3. A text area appears where you can enter your CSS code (max 1500 characters).

Step 3: Add your custom CSS

Enter or paste your CSS code into the box to style your widget elements.

Example:

.feedspace-review-content {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 18px;
}

This snippet changes the font to Montserrat, increases the text size, and makes the review text bolder for better readability.

Step 4: Preview the design

• The preview on the left side updates automatically as you make CSS changes.
• You can switch between Desktop and Phone views to ensure your widget looks perfect on all devices.

Step 5: Save and apply

Once you’re satisfied with the design, click Save and Next in the top-right corner to apply your custom styles.

Tips

• Use CSS to modify fonts, text colors, star icons, spacing, and more.
• Keep the CSS minimal to maintain widget responsiveness.
• If something doesn’t look right, simply clear your CSS box to revert to default styling.

Common questions

Is there a limit on how much CSS I can add?

Yes. The Custom CSS box holds up to 1,500 characters. Keep your rules focused on the elements you want to restyle so you stay within that limit.

Why does the Custom CSS toggle show an upgrade prompt?

Custom CSS is available on plans that include it. If your plan does not, switching the toggle on opens an upgrade prompt. Once you are on a plan that includes Custom CSS, the toggle reveals the code box.