Creating Customer Quote Overlays
By providing direct quotes from actual customers, you legitimize your brand while simultaneously displaying an actual use-case where your product/service was a distinct solution.
Showcasing your service or product is an absolute given on most websites. Often, this presentation can come in the mold of customer or client quotes. By providing direct quotes from actual customers, you legitimize your brand while simultaneously displaying an actual use-case where your product/service was a distinct solution.
Within web design, there is a variety of methods you can use to display these quotes. One such method is to show the quote as an overlay on top of specific client logos. This technique has the added benefit of being able to condense a number of customer quotes into a defined space all without compromising your overall design.
Below is the HTML and CSS required a for customer quotes to appear as an overlay. Customize the colors, text, and logos to fit your needs!
Step 1 - quote-overlay.html
Copy and paste the code below into your web page
Step 2 - quote-overlay.css
Download the CSS below and include it in your web pagequote-overlay.css
Step 3 - Include the following resources on your web page
The above HTML, CSS, and includes should produce effective customer quote overlays. Bootstrap handles the column formatting for a variety of devices while custom CSS produces all of the necessary transition effects. Swap out the logos for those of your actual customers and add distinct quotes related to your service or product. Enjoy!