Read Time:1 Minute, 21 Second
I have noticed that when we add shopperapproved.com review code into our website/Testimonials page. The looks and theme of default code design are very simple and if your website theme is different then It will not match with it perfectly.
For Example,
By default, your page will something like this image
If you wish to change it then you will add given code into your CSS file.
/*# design for shopperapproved by VishalBarot.com */ .merchant_review { width:70%; background:#FFF; margin:40px auto; position: relative; border: 1px solid #EEEEEE; } .merchant_review:before, .merchant_review:after { z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 80%; max-width:300px; background: #777; -webkit-box-shadow: 0 15px 10px #777; -moz-box-shadow: 0 15px 10px #777; box-shadow: 0 15px 10px #777; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -o-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg); } .merchant_review:after { -webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto; } .name{ font-weight: bold; color: #0c66ff; } .comments{ color:#000000; border-top:1px solid #EEEEEE; } .info{ padding-bottom:5px; } .verified,.images{ border-radius:25px; font-weight: bold; background: #f1f6fd; color: #0c66ff; border: none; padding: 4px 4px; text-align: center; text-decoration: none; }
After you add this code into your CSS file it will display review and other data like
If you want to make adjustments to your page and having a difficulty you can ask me here into the comment section and I would be happy to help you out.
Thanks,
Vishal