WideHoly Embed
Zero Dependencies · ~5KB · Shadow DOM

Embed Scripture on
Any Website

Add WideHoly verse cards, chapter summaries, daily verses, and search to any website with a single line of HTML. No build tools. No dependencies.

Get Started GitHub →
<!-- Add this one script to your site -->
<script src="https://cdn.jsdelivr.net/npm/wideholy-embed@1/dist/embed.min.js"></script>

Live demo

6 Widget Types

Drop any of these into your HTML. Customize with data-* attributes.

Verse Card

Show any specific verse with translation badge and copy button.

<div data-wideholy="verse"
     data-ref="John 3:16"
     data-theme="light"></div>

Verse of the Day

Auto-refreshes daily. Cached in localStorage for performance.

<div data-wideholy="votd"
     data-theme="dark"></div>

Chapter Card

Chapter summary with verse count and link to full text.

<div data-wideholy="chapter"
     data-ref="Genesis 1"
     data-theme="sepia"></div>

Comparison Card

Side-by-side verse comparison with link to compare page.

<div data-wideholy="compare"
     data-a="John 3:16"
     data-b="2:255"></div>

Search Box

Redirects to WideHoly search. Great for sidebars.

<div data-wideholy="search"
     data-placeholder="Search Scripture…"></div>

Compact Verse of the Day

Smaller layout for sidebars, footers, or tight spaces.

<div data-wideholy="votd"
     data-size="compact"
     data-theme="sepia"></div>

Code Playground

Edit the HTML and see the widget live.

Preview uses live data from WideHoly API

3 Built-in Themes

Choose the theme that fits your site. Set once with data-theme.

Light data-theme="light"
Dark data-theme="dark"
Sepia data-theme="sepia"

Installation

Three ways to embed — choose what fits your stack.

⚡

jsDelivr CDN

Recommended

Global CDN, auto-updates when new versions publish to npm. Fastest option.

<script src="https://cdn.jsdelivr.net/npm/
wideholy-embed@1/dist/embed.min.js"></script>
☁️

R2 CDN

Hosted directly by WideHoly. Served from Cloudflare R2 with immutable caching.

<script src="https://cdn.wideholy.com
/embed.min.js"></script>
📦

npm Package

Use with Webpack, Vite, Rollup, or any bundler. ESM and UMD formats included.

npm install wideholy-embed

// In your JS/TS file:
import 'wideholy-embed';

API Reference

All data-* attributes supported by WideHoly embed widgets.

Attribute Values Default Description
data-wideholy verse, chapter, person, compare, votd, search required Widget type to render
data-ref "John 3:16" required for verse/chapter Scripture reference (book chapter:verse)
data-slug "moses", "paul" required for person Person slug (person widget only)
data-a, data-b verse refs required for compare Two verse refs for comparison
data-theme light, dark, sepia light Visual theme
data-size default, compact default Widget size variant
data-translation default, etc. default Translation code
data-show-original true, false false Show original language text below verse
data-placeholder any string "Search Scripture…" Search box placeholder text
data-lang en, ko, ja, es, … en UI language for widget labels

The WideHoly Sacred Text Family

Six domains for the world's major scriptural traditions. Each authoritative for its tradition with dedicated URL structure.

FAQ

Common questions about embedding sacred-text widgets.

Which sacred texts does WideHoly cover?

Five major scriptural traditions: WideBible for the Christian Bible (66 books), WideQuran for the Quran (114 surahs + tafsir), WideTorah for the Hebrew Torah and Talmudic study, WideGita for the Bhagavad Gita, WideSutra for Buddhist sutras. Plus WideHoly as the umbrella hub.

How accurate are the translations?

Public-domain and CC translations from authoritative sources: KJV/ASV/WEB for the Bible (translations list), Sahih International/Pickthall/Yusuf Ali for the Quran (translations list), JPS 1917 and Robert Alter for the Torah (translations list). Side-by-side comparison supported.

Can I embed a single verse or full chapter?

Yes. The verse widget accepts data-ref="John 3:16" or data-ref="2:255" (Quran Ayatul Kursi). The chapter widget accepts data-ref="Genesis 1". The compare widget shows two passages side-by-side across traditions.

Does WideHoly support multiple languages?

Yes. Each domain ships translations in 15 languages (EN, KO, JA, ZH-HANS, HI, AR, ES, FR, DE, PT, RU, ID, VI, TR, TH). Hindi, Arabic, and Thai render with proper script support. RTL direction handled automatically for Arabic and Hebrew.

Is there a Verse of the Day widget?

Yes. The votd widget rotates daily based on date, with separate calendars per tradition (Christian liturgical year, Islamic Hijri calendar, Hebrew calendar, Hindu calendar, Buddhist liturgical year). Same syntax: <div data-wideholy="votd"></div>.

Why 6 sites instead of one scripture portal?

Each tradition has unique structural needs: WideBible uses book→chapter→verse, WideQuran uses surah→ayah with juz divisions, WideTorah includes Talmudic tractates, WideGita has 18 chapters with multi-translator commentary, WideSutra organizes by collection. Dedicated domains enable scripture-specific URL patterns and proper SEO.