Load Scripture on your own Website

Easy to Use

Works
Everywhere

GetBible Loader is an intuitive and lightweight JavaScript solution for embedding Bible scripture into your website. By simply adding the getBible class to any element on your webpage, you can enable users to see the full scripture text in a tooltip when they hover over a reference, or a modal when they click it or simply inline.

GetBible Loader Integration Guide

For Scripture in Modals, Tooltips, & Inline

How to Add GetBible Loader to Your Website

Include the GetBible JavaScript File:
- First, include the GetBible script in the section of your HTML document:
Markup Your Scripture References:
- In the body of your HTML document, apply the getBible class to any element that should display a scripture tooltip. Here is an example using a ul list:
```
<ul>
  <li class="getBible">John 3:16</li>
  <li class="getBible" data-format="modal">1 John 3:16-19,22</li>
  
</ul>
```
Result:
- The first list item is inline (format), while the second is a modal. Inline is the default behaviour:
  - John 3:16
  - 1 John 3:16-19,22

For a detailed example, check out the basic usage example in the getbible/loader repository.

Utilizing Data Attributes

Data attributes allow you to customize the behavior and display of the scripture in tooltips, modals, or inline.

You can see the data attributes we act on in the action class of this library.

data-format:[default: inline] Specify the format you would like to load (e.g., modal). There are three options modal, inline, and tooltip you can just select one at a time.
data-translation:[default: kjv] Specify the Bible translations (abbreviation) to use, separated by semicolons (e.g., kjv;aov). The tooltip will fetch the scripture from each translation listed.
data-show-book-name:[default: 0] Set to 1 to display the book name of the reference.
data-show-reference:[default: 1] Set to 1 to display the full reference string.
data-show-local-reference:[default: 0] Set to 1 to display your local reference string.
data-show-translation:[default: 0] Set to 1 to display the translation name.
data-show-abbreviation:[default: 0] Set to 1 to display the abbreviation of the translation.
data-show-language:[default: 0] Set to 1 to display the language of the translation.
data-show-language-code:[default: 0] Set to 1 to display the language code of the translation.

Here's how you might use these attributes:

<span class="getBible"
  data-format="modal"
  data-translation="kjv;aov;arabicsv"
  data-show-translation="1"
  data-show-language="1">John 3:16,19</span>

Example: John 3:16,19

In the example above, the modal for these lverses will show text from both the King James Version (KJV) and another version abbreviated as AOV and ArabicSV. It will also display the translation name and language for each scripture reference, as well as the book name.

Scripture Reference Formatting

Nearly all abbreviations on almost all languages should work.

Here you can view all the files of the various translations we use to parse each reference in their respective languages.

Should you see room for improvement to these, please open an issue at our support desk, we welcome any help to make this work even better.

Some Guidelines

Chapter and Verse: Follow the book name with the chapter number, a colon, and the verse number(s) (e.g., "Jn3:16").
Multiple Verses: Separate multiple verses with commas (e.g., "Jn 3:16,17").
Verse Ranges: Indicate a range of verses using a hyphen (e.g., "John 3:16-19").
Multiple References: Separate different scripture references with semicolons (e.g., "Joh 3:16-17; 1 Jo3:16-19").
One Chapter Per/Reference: Each reference should only target one chapter.

See simplicity in action

Now available as a Joomla Plugin

Simply span your Scripture reference with the GetBible class and attributes, and see it represent your text in a tooltip, modal or inline as in our examples below:

Sample HTML

<p>Jesus empaphatically stated in 
<span class="getBible uk-link" data-translation="kjv;aov" data-show-translation="1" data-show-language="1" data-format="modal">Matthew 28:18-19; Mark 16:15</span>
 that we have His authority to go preach His truth to all nations. This great commission is seen repeated in 
<span class="getBible uk-link" data-translation="kjv;aov" data-show-translation="1" data-show-language="1" data-format="tooltip">Revelation 14:6</span> 
and fulfilled in 
<span class="getBible uk-link" data-translation="kjv;swahili;peshitta;korean;textusreceptus;martin;maori" data-show-translation="1" 
data-show-language="1" data-format="modal">Revelation 7:9</span></p>
<p>Paul gave us example of how he fulfilled the great commission in 
<span class="getBible uk-link" data-translation="kjv" data-show-translation="1" 
data-show-language="1" data-format="modal">1 Corinthians 1:17; 1 Corinthians 9:14,16,18</span>

What did Jesus say about Missions?

From the weatlth of Scripture

Jesus empaphatically stated in Matthew 28:18-19; Mark 16:15 that we have His authority to go preach His truth to all nations. This great commission is seen repeated in Revelation 14:6 and fulfilled in Revelation 7:9

Paul gave us example of how he fulfilled the great commission in 1 Corinthians 1:17; 1 Corinthians 9:14,16,18

Our Inline Option

Philippians 4:13

See repository of the Joomla! Plugin for GetBible Loader