Developers

Three ways to put booking on your website.

Every integration talks to the same public BookDinePlay API, so availability, menus and reservations stay consistent no matter how you embed them.

Plain JavaScript SDK

Drop a widget into any website.

Framework-free and dependency-free. Load the script, call renderBookingWidget, and BookDinePlay renders a self-contained, style-isolated reservation flow inside your container element.

  1. Add the script tag

    Load the BookDinePlay SDK from the BookDinePlay CDN. The major-line alias below updates automatically; pin an exact version with its integrity hash if your security posture requires byte-level pinning.

  2. Add a container element

    Place an empty element with an id where you want the widget to render.

  3. Call renderBookingWidget

    Pass your venue slug, your publishable key, the API base URL and the resource types you want to expose.

<div id="bookdineplay-widget"></div>
<script src="https://cdn.bookdineplay.com/sdk/v0/bookdineplay.js"></script>
window.BookDinePlay.renderBookingWidget({
  container: '#bookdineplay-widget',
  venueSlug: 'demo-sportsbar',
  apiBaseUrl: 'https://api.bookdineplay.com',
  publishableKey: 'bdp_pk_your_publishable_key',
  resourceTypes: ['RestaurantTable', 'BilliardTable', 'DartBoard']
});

The publishable key is browser-safe by design: it is locked to the origins you allow rather than kept secret, and the widget renders nothing without one. Never put a secret key in page markup — those belong on a server.

The major-line alias above updates automatically but is not byte-pinned. For byte-level pinning, load an exact version and add the integrity value published alongside it as sdk/<version>/sri.txt, also attached to that release on GitHub — pick whichever your security posture requires.

<script
  src="https://cdn.bookdineplay.com/sdk/<version>/bookdineplay.js"
  integrity="<hash from sdk/<version>/sri.txt>"
  crossorigin="anonymous"></script>

Read the full guide →

Theming

Match the widget to your brand.

The widget renders inside a Shadow DOM and reads its accent color, background, surface, text and border colors, corner radius and font from CSS custom properties on the host page or the widget's container element. Every property has a default, so setting none renders exactly as it does today.

Under prefers-color-scheme: dark, six of the nine properties — background, surface, text, muted, border and accent contrast — fall back to the widget's built-in dark palette. Accent, radius and font apply in both light and dark.

/* on your page, or on the widget's container element */
#bookdineplay-widget {
  --bdp-accent: #0f766e;
  --bdp-radius: 4px;
  --bdp-font: Georgia, "Times New Roman", serif;
}
--bdp-accent
--bdp-accent-contrast
--bdp-background
--bdp-surface
--bdp-text
--bdp-muted
--bdp-border
--bdp-radius
--bdp-font

Read the full guide →

WordPress plugin

One shortcode, anywhere on your site.

Install the BookDinePlay plugin, and it enqueues the JavaScript SDK for you. Drop the shortcode into any page, post or block, and set which venue it should render.

  1. Install the plugin

    Download the plugin zip from the latest GitHub release, then install it via Plugins → Add New → Upload Plugin and activate it.

  2. Set your publishable key

    Paste your venue's publishable key under Settings → BookDinePlay. The plugin refuses to render the widget without one, and rejects a secret key outright.

  3. Add the shortcode

    Paste the shortcode into any page, post or widget area.

  4. Set the venue attribute

    Point the shortcode at your venue slug — attributes are sanitized and output is escaped.

[bookdineplay_widget venue="demo-sportsbar"]
// bookdineplay.php (excerpt)
add_shortcode( 'bookdineplay_widget', 'bookdineplay_render_widget_shortcode' );

function bookdineplay_render_widget_shortcode( $atts ) {
    $atts = shortcode_atts(
        [
            'venue' => 'demo-sportsbar',
            'api'   => 'https://api.bookdineplay.com',
            'types' => 'RestaurantTable,BilliardTable,DartBoard,BowlingLane',
            'theme' => 'auto',
            'key'   => '',
        ],
        $atts,
        'bookdineplay_widget'
    );
    // ... sanitize, enqueue the SDK, attach the init payload as an inline script ...
    return sprintf(
        '<div id="%s" class="bookdineplay-widget"></div>',
        esc_attr( $container_id )
    );
}

Read the full guide →

.NET SDK

A typed client for custom applications.

Reach for BookDinePlay.Sdk when you're building a custom web app, an internal operations tool, or a service that needs typed access to venues, menus, availability and reservations.

  1. Install the package

    Add the NuGet package to your project.

  2. Register the client

    Register the typed client with AddBookDinePlayClient, passing your API base URL and a server-side secret key. It sends that key as the API key header on every request.

  3. Call typed methods

    Call the client's methods directly for venues, menus, availability, reservations and payment intents.

  4. Share contracts

    Request and response types come from BookDinePlay.Shared, so your app and the API never drift apart.

# Terminal
dotnet add package BookDinePlay.Sdk
// Program.cs - using BookDinePlay.Sdk;
builder.Services.AddBookDinePlayClient(
    new Uri("https://api.bookdineplay.com"),
    builder.Configuration["BookDinePlay:ApiKey"]!);  // a bdp_sk_ secret key
// IBookDinePlayClient client - injected; BookableResourceType lives in BookDinePlay.Domain
var venue = await client.GetVenueAsync("demo-sportsbar", cancellationToken);

var availability = await client.GetAvailabilityAsync(
    venueSlug: "demo-sportsbar",
    date: DateOnly.FromDateTime(DateTime.Today),
    partySize: 4,
    resourceType: BookableResourceType.RestaurantTable,
    cancellationToken: cancellationToken);

var reservation = await client.CreateReservationAsync(
    venueSlug: "demo-sportsbar",
    request: createReservationRequest,
    cancellationToken: cancellationToken);

Read the full guide →

API reference →

Need help wiring it up?

We'll help you embed BookDinePlay on your stack.