3. Add CarStory SRP Badges

CarStory SRP badges display vehicle highlights alongside listings on search results pages (SRPs).

Used CarStory before?

If your website has used any CarStory Market Report product in the past, it is important to remove all existing CarStory code on the SRP. Please ensure no CarStory code exists on the SRP page before implementing the new ILMR Buttons.

Choose Badge style

CarStory SRP badges are available in three sizes, shown below. Choose the style that works best with your SRP design.

Default Size SRP Badge	Portrait Size SRP Badge	Horizontal Banner SRP Badge
162px X 64px	77px X 137px	418px X 36px
<div class="carstory-container" data-carstory-vin="PUT VIN HERE"><span class="carstory-button carstory-layout-landscape"></span></div>	<div class="carstory-container" data-carstory-vin="PUT VIN HERE"><span class="carstory-button carstory-layout-portrait"></span></div>	<div class="carstory-container" data-carstory-vin="PUT VIN HERE"><span class="carstory-button carstory-layout-horizontal"></span></div>

EMBED CARSTORY SRP CODE SNIPPET

Step 1:

To display SRP badges, place the HTML code snippet (from the table above) in the location where you want the CarStory Market Report SRP Badges to appear. Be sure to pass in the correct VIN for the vehicle, in place of the "PUT VIN HERE" text inside the code block.

Step 2:

Add this script block toward the bottom of the SRP page, before the closing tag:

<script async src="//widget.carstory.com/v1.0/button.js"></script>
<script>
var cswbntL0ad=setInterval(function(){window.CarStory&&(clearInterval(cswbntL0ad),window.CarStory.buildButtons({noClickButtons:!0,referrer:"PLACE-YOUR-REFERRER-HERE"}))},100),cb=function(){var e=document.createElement("link");e.rel="stylesheet",e.href="//widget.carstory.com/v1.0/no-click-button.css";var t=document.getElementsByTagName("head")[0];t.parentNode.insertBefore(e,t)},raf=requestAnimationFrame||mozRequestAnimationFrame||webkitRequestAnimationFrame||msRequestAnimationFrame;raf?raf(cb):window.addEventListener("load",cb);
</script>

"Referrer" Use:

During the inventory on-boarding process, your dealership may have been assigned a "Referrer" ID to use in your CarStory code. It is critical this ID be utilized (if assigned).

Installation Notes:

• View All Possible SRP Badges
• You can choose to omit a layout style and the badge will default to the Landscape Display.
• Placing this script (from Step 2) at the bottom, will allow your page to load faster and ensure that all CarStory Market Report styles have been downloaded before loading the widget HTML.
• If you don’t have a responsive site, please remember to add this code to your mobile site template.