We are going to use the iframe-resizer-react library. You can install it via npm command:
npm install --save iframe-resizer-react
After the library is installed, you can import the IframeResizer component:
import IframeResizer from 'iframe-resizer-react'
And you just need to write the component like below:
<IframeResizer src="https://embed.testimonial.to/w/testimonial" style={{ width: "1px", minWidth: "100%" }} />
Normally you would set the width to 100% and have the height scale to fit the content. You only need to pass the Wall of Love URL to the src
You will find the Wall of Love URL in the embed code.
On the left sidebar, choose "Wall of Love" under "Embed & Metrics".
After selecting the layout you want, the embed code will show up.
In the embed code part, the second line is an <iframe>, something like this:
<iframe id="testimonialto-testimonial" src="https://embed.testimonial.to/w/testimonial?theme=light&card=base" frameborder="0" scrolling="no" width="100%"></iframe>
Only copy the string in the src
parameter, in the sample case, you just need to copy
https://embed.testimonial.to/w/testimonial?theme=light&card=base
Then paste the URL into the IframeResizer component src
prop.
That's it! 🥳
If you need help or have any questions, just click on the live chat widget. We will reach back as soon as possible ✌️