Skip to main content

ReadMe developer hubs

ReadMe Docs Testimonial Widget Embed

ReadMe hubs have a settings screen made for this: Appearance, then CSS, JS, HTML, with an End of Body Tag field that lands right before the closing body tag. That holds the StoryProof script. The widget div then goes into HTML you control, such as the landing page’s Custom HTML body or a Custom Page in HTML mode. Plan rules and ReadMe’s single page navigation decide how far you can take it.

  • The script in the End of Body Tag field
  • The div on the landing page or a Custom Page
  • Which ReadMe plans unlock which fields
Use the free toolStart free (opens in a new tab)
ReadMe · End of Body Tag include

Project dashboard › Appearance › CSS, JS, HTML › End of Body Tag

<script src="https://app.storyproof.io/embed.js" async></script>

3 places to paste in ReadMe. Your widget id goes in once.

Free tool, no sign-upTry it below

ReadMe fields

Script include, landing page and Custom Page

Type the widget id. The first card goes in the End of Body Tag field once. Then pick where the div lives: the landing page’s Custom HTML body, a Custom Page in HTML mode, or both.

Shown in StoryProof when you copy a widget’s embed code.

Part 1 · End of Body Tag include

Project dashboard › Appearance › CSS, JS, HTML › End of Body Tag

<script src="https://app.storyproof.io/embed.js" async></script>

Part 2 · Landing page body

Appearance › Navigation › Landing Page on › body template: Custom HTML

<!-- Landing page › body › Custom HTML template -->
<section class="customer-proof">
  <h2>Teams shipping on our API</h2>
  <div data-storyproof-widget="YOUR_WIDGET_ID"></div>
</section>

Part 3 · A Custom Page

Custom Pages › new page › HTML mode

<!-- Custom Page set to HTML mode (ReadMe sanitizes this HTML) -->
<h1>Customer stories</h1>
<p>What developers say after their first integration.</p>
<div data-storyproof-widget="YOUR_WIDGET_ID"></div>

Save, then open the hub in a private window and load the page with the widget directly. View source to confirm the script sits before the closing body tag and the div kept its data-storyproof-widget attribute.

The HTML is produced in your browser. The id you type is not stored.

The problem, solved

ReadMe hub snags and how the embed fits around them

  • Problem 1

    Custom JavaScript is greyed out

    ReadMe’s plan table puts Custom JavaScript on Enterprise only, which rules out pasting code there for most teams.

  • Problem 2

    Custom Pages strip what I paste

    ReadMe sanitizes HTML on Custom Pages and sends CSS and JavaScript to the Appearance settings instead.

  • Problem 3

    Widget blank after moving between guides

    ReadMe says the hub is a single page app: custom script loads once and does not re-run on each page change.

  • Problem 4

    Marketing quotes in technical docs

    Developers distrust hype, and one unreviewed quote on an API hub draws the wrong attention.

  • Problem 5

    Starter plan with no custom HTML

    ReadMe’s table shows Custom HTML unavailable on Starter, so there is no field for the script at all.

In StoryProof

Set it up in a ReadMe project

Step 1 of 5

Choose the widget’s testimonials

In StoryProof, build a widget for the hub, choose a compact layout and the approved testimonials it shows, and copy its id.

What each ReadMe plan lets you do here

From the plan table on ReadMe’s Custom CSS, HTML, and JavaScript page, read 2026-11-14.
ReadMe planCustom HTML includeCustom JavaScriptTestimonial route
StarterNot listedNot listedLink to your Wall of Love
ProListedNot listedScript in End of Body Tag, div on landing or Custom Page
EnterpriseListedListedSame as Pro, plus lifecycle events you can test

Before you start

Limits on ReadMe

  • ReadMe docs as of 2026-11-14

    Menu names, plan availability, sanitizing and the lifecycle events follow docs.readme.com as read on 2026-11-14. Nobody has tried these steps on a live ReadMe hub yet.

  • In app navigation

    StoryProof does not claim a widget fills after a ReadMe page change without a reload. Direct loads are the dependable case.

  • Sanitized HTML

    ReadMe sanitizes Custom Page HTML. If the data attribute is ever removed, use the landing page body or link to the Wall of Love.

  • No ReadMe integration

    StoryProof has no ReadMe app or integration. The include tag and the div are the whole setup.

  • Badge on lower plans

    Widgets keep a small "Powered by StoryProof" badge until Pro.

FAQ

Questions people ask

Short answers to what usually comes up next.

Should the script go in Head Tag or End of Body Tag?

Either is allowed; ReadMe describes Head Tag as suitable for loading external JS. End of Body Tag keeps the async file after your content, which suits a widget.

Can I put the widget inside a guide page?

Guide pages are reached mostly by in app navigation, where scripts do not re-run. The landing page and a directly linked Custom Page are the safer spots.

Does the script slow down API reference pages?

It loads async once per hub visit. Pages without a div simply have nothing for it to fill.

Is there a way without any ReadMe plan upgrade?

Yes. A normal link from a guide to your StoryProof Wall of Love needs no custom HTML at all.

Still have a question? Ask the StoryProof team or book a demo.

Show developers who already ships with you

Approve testimonials in StoryProof, then add one include tag and one div to your ReadMe hub.

Start free (opens in a new tab)

Sources

  1. Custom CSS, HTML, and JavaScript, ReadMe Documentation. Checked 2026-11-14.
  2. Custom Pages, ReadMe Documentation. Checked 2026-11-14.
  3. Landing Page, ReadMe Documentation. Checked 2026-11-14.

Last updated 2026-11-14.