Overview

DBindly is a lightweight JavaScript library that enables dynamic content loading on any website. It works by reading data attributes from your HTML elements and replacing them with data from your collections.

How It Works

Create Collections - Use the dashboard to create collections and add data
Generate API Keys - Create an API key to access your data
Add the Script - Include DBindly on your website
Use Data Attributes - Add attributes like dbind_data, dbind_src to your HTML

Core Concepts

Collections

Collections are like database tables that store your content. Each collection has:

Columns - Define the structure (name, type)
Rows - Individual data items with unique IDs

Data IDs

Each row in a collection has a unique dataId. You can load data by:

URL parameter: ?did=your-data-id
JavaScript: DBindly.load('your-data-id')

API Keys

API keys authenticate your requests and enable:

Domain whitelisting
Rate limiting
Usage tracking

Data Attributes

DBindly uses HTML data attributes to define what content to display:

Attribute	Description	Example
`dbind_data`	Text content	`<span dbind_data="title"></span>`
`dbind_href`	Link URL	`<a dbind_href="url">Link</a>`
`dbind_src`	Image source	`<img dbind_src="image">`
`dbind_repeat`	Repeat for arrays	`<div dbind_repeat="items">`
`dbind_if`	Conditional display	`<span dbind_if="active==true">`

Supported Platforms

DBindly works with any platform that allows custom HTML and JavaScript:

Website Builders - Webflow, Wix, Squarespace, Framer
CMS Platforms - WordPress, Ghost, Contentful
E-commerce - Shopify, WooCommerce
Custom Sites - Any HTML/JavaScript website

Next Steps

Installation - Add DBindly to your site
Configuration - Configure options
Basic Attributes - Learn the basic attributes