How can I display the Clutch review widget on my Webflow site when the copy and paste method mentioned in the instructions is not returning the correct iframe code?

Published on
September 22, 2023

If the copy and paste method mentioned in the Clutch review widget instructions is not generating the correct iframe code, there are several alternative methods you can try to display the Clutch review widget on your Webflow site:

  1. Custom Code Embed Widget: Webflow allows you to embed custom code into your site, which can be utilized to display the Clutch review widget. Follow these steps:
  • In your Webflow Designer, drag and drop the "Embed" widget onto your page where you want the Clutch widget to appear.
  • Click on the "Open Code Editor" button within the Embed widget.
  • Paste the correct iframe code provided by Clutch into the code editor.
  • Save and publish your site for the changes to take effect.
  1. Interactions: Another approach to displaying the Clutch review widget is by using Webflow's interactions feature. Here's how you can do it:
  • Create a new div block on your Webflow site where you want the Clutch widget to appear.
  • Set the position of the div block to relative.
  • Add a new link block within the div block, and set its position to absolute.
  • Adjust the width and height of the link block to match the Clutch widget dimensions.
  • Add an interaction to the div block that triggers on page load or on a specific event (e.g. scroll or click).
  • In the interaction, set the initial appearance of the link block to "display:none" or equivalent.
  • Add a new step to the interaction that changes the display property of the link block to "block" or equivalent.
  • Publish your site for the changes to take effect.
  1. CMS Embed Field: If you are using Webflow's CMS (Content Management System) to manage your site's content, you can utilize the Embed field to display the Clutch review widget dynamically. Follow these steps:
  • In your Webflow Designer, go to the Collection Editor for the collection where you want to display the Clutch widget.
  • Add a new field of type "Embed".
  • Edit the template for the collection item and insert the Embed field where you want the Clutch widget to appear.
  • In the CMS, for each collection item, paste the correct iframe code provided by Clutch into the Embed field.
  • Publish your site for the changes to take effect.

These alternative methods should help you display the Clutch review widget on your Webflow site, even if the copy and paste method mentioned in the instructions is not generating the correct iframe code.

Additional Questions:

  1. How can I embed external widgets in Webflow?
  2. What are some alternative ways to display dynamic content on a Webflow site?
  3. How can I integrate third-party services into my Webflow site?