Share real testimonials from the field. Let your customers see how everyday riders trust Draw It Out®—right from your own website.
This is a live, auto-updating widget that showcases real riders using Draw It Out® products in the arena, barn, and on the road. It’s fully responsive, lightweight, and looks great on any site.
Paste this code wherever you want the stories to appear (homepage, product page, or sidebar):
<iframe
src="https://drawliniment.com/pages/real-rider-stories"
width="100%"
height="1200"
frameborder="0"
style="border: none; overflow: hidden;"></iframe>🛠 Works with Shopify, WordPress, Wix, Squarespace, BigCommerce, and more.
We can personalize your embed with your logo, a custom intro message, or even local riders from your region.
Email us at support@drawliniment.com and we’ll get you set up.
Drop a brand-safe Draw It Out® product card on your site in seconds. It’s responsive, lightweight, and easy to customize. Use the No-JS HTML, Universal JS, or Shopify Liquid version below.
Tip: keep the button that points to your PDP first, and the “Learn More” link to Draw It Out® second.
Responsive up to 680px wide; adapts to phones automatically.
Paste this into your page. Change BUY_URL to your product page. Optional: change the image to your own PDP image.
<!-- Draw It Out® Dealer Card (No-JS) -->
<style>
.dio-card{--dio:#78be20;display:grid;grid-template-columns:96px 1fr;gap:14px;border:1px solid #e6efe5;border-radius:14px;padding:14px;background:#fff;align-items:center;max-width:680px}
.dio-card img{width:96px;height:96px;object-fit:contain;border-radius:10px;border:1px solid #f0f5ef;background:#fafdfa}
.dio-meta h4{margin:2px 0 4px;font-size:1.05rem}
.dio-meta p{margin:0;color:#586063;font-size:.95rem}
.dio-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.dio-cta{padding:8px 12px;border-radius:10px;border:2px solid var(--dio);text-decoration:none;font-weight:700}
.dio-cta.primary{background:var(--dio);color:#fff}
.dio-cta.ghost{color:var(--dio);background:#fff}
.dio-badge{display:inline-block;font-size:.78rem;padding:4px 8px;background:#eef8ea;color:#2a6e11;border:1px solid #d8f0cf;border-radius:999px}
@media (max-width:520px){ .dio-card{grid-template-columns:1fr} .dio-card img{width:100%;height:auto}}
</style>
<div class="dio-card" role="group" aria-label="Draw It Out 16oz Gel Product Card">
<img alt="Draw It Out 16oz High Potency Gel"
src="https://cdn.shopify.com/s/files/1/1668/4655/products/draw-it-out-r-horse-liniment-16oz-gel-draw-it-out-r--1.jpg">
<div class="dio-meta">
<span class="dio-badge">Sensation-Free • Odorless • Wrap-Ready</span>
<h4>Draw It Out® Gel — 16oz High Potency</h4>
<p>No sting. No scent. Stays where you put it—built for clean, show-friendly routines.</p>
<div class="dio-ctas">
<a class="dio-cta primary" href="BUY_URL">Buy from This Dealer</a>
<a class="dio-cta ghost" href="https://drawliniment.com/pages/draw-it-out-gel-16oz">Learn More</a>
</div>
</div>
</div>Paste both blocks. Edit the data-* values to point the widget at your URLs and image.
<!-- Draw It Out® Dealer Card (Universal JS) -->
<div class="dio-widget"
data-title="Draw It Out® Gel — 16oz High Potency"
data-desc="No sting. No scent. Stays where you put it—built for clean, show-friendly routines."
data-buy="https://YOUR-DOMAIN.example/product/draw-it-out-16oz"
data-learn="https://drawliniment.com/pages/draw-it-out-gel-16oz"
data-img="https://cdn.shopify.com/s/files/1/1668/4655/products/draw-it-out-r-horse-liniment-16oz-gel-draw-it-out-r--1.jpg"
data-accent="#78be20"></div><style>
.dio-card{--dio:var(--accent,#78be20);display:grid;grid-template-columns:96px 1fr;gap:14px;border:1px solid #e6efe5;border-radius:14px;padding:14px;background:#fff;align-items:center;max-width:680px}
.dio-card img{width:96px;height:96px;object-fit:contain;border-radius:10px;border:1px solid #f0f5ef;background:#fafdfa}
.dio-meta h4{margin:2px 0 4px;font-size:1.05rem}
.dio-meta p{margin:0;color:#586063;font-size:.95rem}
.dio-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.dio-cta{padding:8px 12px;border-radius:10px;border:2px solid var(--dio);text-decoration:none;font-weight:700}
.dio-cta.primary{background:var(--dio);color:#fff}
.dio-cta.ghost{color:var(--dio);background:#fff}
.dio-badge{display:inline-block;font-size:.78rem;padding:4px 8px;background:#eef8ea;color:#2a6e11;border:1px solid #d8f0cf;border-radius:999px}
@media (max-width:520px){ .dio-card{grid-template-columns:1fr} .dio-card img{width:100%;height:auto}}
</style>
<script>
(function(){
var el = document.querySelector('.dio-widget');
if(!el) return;
var t=el.dataset.title||'Draw It Out® Gel — 16oz High Potency';
var d=el.dataset.desc||'No sting. No scent. Stays where you put it—built for clean, show-friendly routines.';
var buy=el.dataset.buy||'#';
var learn=el.dataset.learn||'https://drawliniment.com/pages/draw-it-out-gel-16oz';
var img=el.dataset.img||'https://cdn.shopify.com/s/files/1/1668/4655/products/draw-it-out-r-horse-liniment-16oz-gel-draw-it-out-r--1.jpg';
var accent=el.dataset.accent||'#78be20';
el.innerHTML = '<div class="dio-card" style="--accent:'+accent+'" role="group" aria-label="'+t+' Card">'
+'<img alt="'+t+'" src="'+img+'" loading="lazy">'
+'<div class="dio-meta">'
+'<span class="dio-badge">Sensation-Free • Odorless • Wrap-Ready</span>'
+'<h4>'+t+'</h4>'
+'<p>'+d+'</p>'
+'<div class="dio-ctas">'
+'<a class="dio-cta primary" href="'+buy+'">Buy from This Dealer</a>'
+'<a class="dio-cta ghost" href="'+learn+'">Learn More</a>'
+'</div>'
+'</div>'
+'</div>';
})();
</script>Create a snippet named dio-card.liquid, paste the code, then render it in a Custom Liquid section. Change buy_url as needed.
{% comment %} Draw It Out® Dealer Card (Liquid) {% endcomment %}
{% assign buy_url = buy_url | default: 'https://YOUR-SHOP.myshopify.com/products/draw-it-out-16oz' %}
<style>
.dio-card{--dio:#78be20;display:grid;grid-template-columns:96px 1fr;gap:14px;border:1px solid #e6efe5;border-radius:14px;padding:14px;background:#fff;align-items:center;max-width:680px;margin:8px 0}
.dio-card img{width:96px;height:96px;object-fit:contain;border-radius:10px;border:1px solid #f0f5ef;background:#fafdfa}
.dio-meta h4{margin:2px 0 4px;font-size:1.05rem}
.dio-meta p{margin:0;color:#586063;font-size:.95rem}
.dio-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.dio-cta{padding:8px 12px;border-radius:10px;border:2px solid var(--dio);text-decoration:none;font-weight:700}
.dio-cta.primary{background:var(--dio);color:#fff}
.dio-cta.ghost{color:var(--dio);background:#fff}
.dio-badge{display:inline-block;font-size:.78rem;padding:4px 8px;background:#eef8ea;color:#2a6e11;border:1px solid #d8f0cf;border-radius:999px}
@media (max-width:520px){ .dio-card{grid-template-columns:1fr} .dio-card img{width:100%;height:auto}}
</style>
<div class="dio-card" role="group" aria-label="Draw It Out 16oz Gel Product Card">
<img alt="Draw It Out 16oz High Potency Gel"
src="https://cdn.shopify.com/s/files/1/1668/4655/products/draw-it-out-r-horse-liniment-16oz-gel-draw-it-out-r--1.jpg">
<div class="dio-meta">
<span class="dio-badge">Sensation-Free • Odorless • Wrap-Ready</span>
<h4>Draw It Out® Gel — 16oz High Potency</h4>
<p>No sting. No scent. Stays where you put it—built for clean, show-friendly routines.</p>
<div class="dio-ctas">
<a class="dio-cta primary" href="{{ buy_url }}">Buy from This Dealer</a>
<a class="dio-cta ghost" href="https://drawliniment.com/pages/draw-it-out-gel-16oz">Learn More</a>
</div>
</div>
</div>{% render 'dio-card', buy_url: 'https://YOUR-SHOP.myshopify.com/products/draw-it-out-16oz' %}#78be20 in CSS or set data-accent in Universal JS.src= to your own product image if preferred.BUY_URL (e.g., ?utm_source=dealer-site).Yes. Use the No-JS HTML version (Option A) in a standard HTML block. For WordPress, you can also paste the Universal JS version into a Custom HTML block.
Yes—edit the headline, description, and button labels right in the snippet. Keep the Learn More link pointing to the Draw It Out® info page.
Adjust width/height on the img, or remove the fixed sizes to let it expand full-width. The layout collapses to a single column on phones automatically.
No. Everything is inline for speed and reliability. You can swap the image URL to your own CDN if you like.
© Draw It Out®. Not a drug. Not intended to diagnose, treat, cure, or prevent disease. Always follow current show rules and consult your veterinarian for medical questions.
!