Flint
Nearly every question about a drop-in widget turns out to be the same question wearing a different hat: I pasted the code and nothing happened. Those are first, in the order they are worth checking.
Work down this list. The first item accounts for most of them.
bibleengine.org. See the next question — this is the single most common cause and the least obvious, because nothing in the page looks wrong.<head> and there is no container div. Flint draws the box inside <div id="flint-search"></div>. Without one it falls back to the script tag’s own position — which, in the head, is nowhere. Add the div where you want the box.Open your browser’s console. Press F12, choose Console, and reload. Flint says plainly what went wrong — it does not fail silently. If it could not find anywhere to draw the box, it says so and tells you what to add.
Almost always a half-configured Content-Security-Policy. This is nastier than a missing one, because the box renders perfectly and only the searching is broken.
Flint needs bibleengine.org in two places, and they do different jobs:
script-src — to load flint.js and the engine it pulls in. Missing this, nothing appears at all.connect-src — to fetch the verses. Missing this, the box appears and searching fails.# add bibleengine.org to both directives script-src 'self' https://bibleengine.org; connect-src 'self' https://bibleengine.org;
If you do not know whether your site sends a CSP, it probably does not, and this is not your problem. Most CSP headers arrive by way of a security plugin or a host’s default configuration rather than by anyone deciding to add one.
connect-src, that is the one to fix — you do not have to guess.Some hosted platforms remove script tags from user content as a security measure. If yours does, Flint cannot work there, and neither can any other embeddable widget — it is not something we can work around from our end.
Two things usually help. First, paste into a raw HTML or embed block rather than the visual editor; the visual editor is often what removes the tag, not the platform. Second, check whether your plan allows custom code at all — on several platforms that is a paid feature, and on the free tier the tag is silently discarded when you save.
A quick way to tell: save the page, then use View Source in your browser and look for flint.js. If it is not in the source, it was removed before it ever reached the visitor.
You have set data-results to an address that is not the page holding the plain snippet. The box submits to whatever that attribute says, so the two have to agree.
A common version of this on a blog: the results are pointed at the site’s front page. That appears to work at first, because the search box happens to be there too — but as new posts are published, the box is pushed further down, and eventually visitors land on a page of recent posts with their results somewhere below the fold. Point data-results at a fixed page you have set aside for it, not at an address whose content changes.
If you would rather not maintain a second page at all, delete data-results. The box will then show its own results wherever it sits.
The rule is the same everywhere: the div goes where you want the box, the script goes wherever that platform keeps its scripts. Only the names of the boxes change.
| Platform | Where things go |
|---|---|
| WordPress | Make a page for the results first — an ordinary published page, called something like Bible Search — and put the plain div and script in it with a Custom HTML block. Then put the box wherever you want it, in a Custom HTML block or a sidebar Custom HTML widget, with data-results pointing at that page’s address. The script can go in your theme’s footer instead of alongside each div if you would rather add it once. Do not paste into the visual editor — it will eat the tag; use the Custom HTML block. |
| Squarespace | Div: a Code Block on the page. Script: Settings → Advanced → Code Injection → Footer. Custom code requires a paid plan. |
| Wix | Both together in an Embed HTML element. Wix sandboxes it in an iframe, so the box and its results live inside that frame — give the element plenty of height. |
| Blogger | Div: an HTML/JavaScript gadget in the layout, or the HTML view of a post. Script: Theme → Edit HTML, just before </body>. |
| Ghost | Div: an HTML card. Script: Settings → Code Injection → Site Footer. |
| Plain HTML | Exactly as printed on the Flint page. Nothing special is needed. |
If your platform is not listed, the two questions to answer are “where can I put raw HTML in the page” and “where can I put a script tag”. Any platform that answers both can run Flint.
Because the two are answered in genuinely different ways. A word search consults an index, then fetches only the twenty verses it is about to show you. A quoted phrase has no index of its own — the words are looked up separately, and then every verse containing all of them has to be read to see whether the words actually sit next to each other in that order.
For an uncommon phrase that is a handful of files and you will not notice. For a phrase built out of common words it can be a great many, and there will be a pause. It is working, not stuck.
If you know roughly where the phrase is, searching the distinctive words on their own is usually faster and gets you there just as well.
Words like the, and, of and a are not indexed. They appear in so many verses that an index of them would be nearly the size of the Bible and would not narrow anything down.
Flint tells you when it has done this rather than pretending the word was not there — the line above the results says which words it skipped. If every word in your search was a skipped one, there is nothing left to search for.
Those words still work inside a quoted phrase, because a phrase is matched against the verse text itself rather than against the index. "the way, the truth" finds what you would expect.
No, and that is the correct behaviour rather than a shortcoming. Results are assembled in the visitor’s browser after the page loads, so a crawler sees an empty search box.
This is how search pages are supposed to behave. Nobody wants a search engine indexing another search engine’s result pages, and Google has asked for years that such pages be kept out of the index. If you want scripture text on your site that is indexed, that is a job for real pages with real content, not for a search box.
Yes, three ways, in increasing order of effort.
data-accent sets the colour of the button, the focus ring and the search highlight, and the button’s lettering is worked out from it so a dark brand colour gets white type. data-width caps the width. data-button and data-placeholder change the wording.flint- class and none of Flint’s own rules use !important, so anything you write will win. The demo site widens the button for a narrow sidebar in two lines.data-styles="off" injects no CSS whatsoever and leaves the markup bare for you to style from nothing.Flint never imports a font. It inherits whatever your page is set in, which is why it does not look like a stranger’s widget dropped into your design.
Back to your own site. A visitor who clicks a reference in your results runs the lookup where they already are; when the results are on the same page it does not even reload. We are not interested in taking your readers.
If you have a Bible reader of your own you would rather send them to, data-link points the references at it and the reference is appended URL-encoded.
Free, with no account to make, no key to paste, no quota to run out of and no plan to be upgraded to. There is nothing on our end that identifies your installation, which also means there is no switch that could turn yours off.
It is worth saying plainly why, because “free” is usually the part that later turns out to have a catch. BibleEngine is nothing but static files. There is no server running your searches, no database answering queries, and therefore no bill that grows when more people use it. Cloudflare hosts the files at no charge. The only recurring cost is the domain name, and as long as that is paid there is no reason for any of this to go away.
That is a different footing from the service this one descends from. phpAV had a server behind every search, and a server is a bill that arrives whether the money is there or not; when it was not, the site came down. Flint cannot fail that way, because there is nothing to run.
What nobody can promise is forever. What we can do is make sure you are not stranded: everything — the widget, the engine, the Bible text, the index — is CC0, so it can be copied and hosted anywhere by anyone, including you. See hosting it yourself.
The King James Version by default, with the American King James Version available through data-translation="akjv". Both are public domain, as are the Strong’s numbers and the Hebrew and Greek lexicon.
The KJV text keeps its editorial conventions rather than flattening them: words supplied by the translators are set in italic, the words of Christ appear in red, and the paragraph marks stay where the printers put them. Those marks are stored with the text and styled when it is displayed, so nothing is lost.
If you find an error in the text, please say so. Corrections go to the source files, so every site using Flint gets them at once.
Yes, and there is nothing to license or ask about. Copy flint.js, BibleEngine.js and the /v1/ folder to your own server and point Flint at them:
<div id="flint-search"></div> <script src="/js/flint.js" data-engine="/js/BibleEngine.js" data-base="/v1"></script>
Everything is flat files, so any host that can serve a file can serve them. There is no PHP, no database and nothing to install — the whole thing runs in the visitor’s browser either way.
They solve opposite halves of the same problem, and they are built to sit on the same page.
Flint gives your reader a search box: they arrive wanting to find something, and they type. VerseTagger works on the text you have already written: it finds the references in your own prose — John 3:16, ranges, comma lists — and shows the verse when a reader hovers over one, so nobody has to leave your article to read what you cited.
If you write about scripture, you probably want both.
Not answered here? The Flint page has the full list of options and a live demo, and you can always write and ask.