The DigiCommerce Product Reviews Block displays customer review information for digital products including star ratings, review counts, and review text. This block integrates seamlessly with DigiCommerce to show authentic customer feedback and helps build trust with potential buyers by showcasing social proof.
Adding the DigiCommerce Product Reviews Block
Navigate to the product page or any location where you want to display review information. Click the block inserter (+) and search for “Product Reviews” in the DigiBlocks DigiCommerce category. The block will be added with placeholder content showing how the reviews will appear on the frontend.
Display Options
Control which review elements appear using the toggle switches in the Display Options panel:
Show Stars – Displays the star rating visualization with filled and empty stars
Show Review Count – Shows the numerical rating and number of reviews
Show Reviews Text – Displays “customer review” or “customer reviews” text
These options can be combined in any combination to create the desired review display format.
Layout Configuration
Alignment
Use the responsive Alignment control to position the review elements:
Left – Aligns reviews to the left side of the container
Center – Centers the review display horizontally
Right – Positions reviews on the right side
Alignment can be set independently for desktop, tablet, and mobile devices to ensure optimal display across all screen sizes.
Style Customization
Colors
Configure review colors using the Normal and Hover tabs in the Colors panel:
Normal State Colors:
Stars Color – Set the color for filled star ratings
Empty Stars Color – Choose the color for unfilled star portions
Count Color – Define the color for review count text
Text Color – Set the color for review text labels
Hover State Colors:
Count Hover Color – Color for review count when hovering over the review link
Text Hover Color – Color for review text during hover interactions
Sizing & Spacing
Control the visual dimensions and spacing in the Sizing & Spacing panel:
Stars Size – Adjust the pixel size of star rating icons (10-40px range)
Items Spacing – Set the gap between stars, count, and text elements (0-50px range)
Padding – Add internal spacing around the review content
Margin – Set external spacing around the entire review block
All sizing controls include responsive options for different devices.
Typography
Configure text appearance using separate typography controls:
Count Typography:
Font Family – Select from available Google Fonts or system fonts
Font Size – Responsive controls with pixel, em, or rem units
Font Weight – Select from available font weights
Font Style – Normal or italic styling
Text Transform – None, uppercase, lowercase, or capitalize
Text Decoration – Add underline, overline, or line-through effects
Line Height – Control line spacing with em or pixel units
Letter Spacing – Adjust character spacing with responsive controls
Text Typography:
All the same typography options are available for the review text, allowing you to style the count and text differently for better visual hierarchy.
Advanced Features
Animation Effects
Add entrance animations to make reviews more engaging when users scroll to them. Choose from fade, slide, zoom, and bounce animations with a preview button to test effects before publishing.
Visibility Controls
Control when the review block appears using device-specific visibility options:
Hide on Desktop – Hide reviews on desktop displays
Hide on Tablet – Hide reviews on tablet devices
Hide on Mobile – Hide reviews on mobile screens
These controls are useful for creating different review displays across devices or showing reviews only where they’re most effective.
Additional Settings
HTML Anchor – Create a unique web address anchor for direct linking to the reviews section
Additional CSS Classes – Add custom CSS classes for advanced styling or theme integration
Frontend Display
The block serves as a template in the editor showing placeholder review data. On the frontend, it automatically displays actual DigiCommerce product review information including:
- Real star ratings based on customer reviews
- Accurate review counts from your DigiCommerce store
- Properly formatted review text and links to full review pages
The reviews are automatically linked to the full reviews section of your product pages, encouraging customer engagement and providing easy access to detailed feedback.
Integration Notes
This block works specifically with DigiCommerce digital products and requires the DigiCommerce plugin to be active. Review data is pulled automatically from your DigiCommerce product database, ensuring reviews always reflect current customer feedback without manual updates.