Step 1: Initial Code

Paste the script below inside your codebase at the end of the body section.

The below code will not work until you have replaced the API key with your own

<script>
(function (w, d, s, o, f, js, fjs) {
w['Scribeless-Widget'] = o; w[o] = w[o] || function () { (w[o].q = w[o].q || []).push(arguments) };
js = d.createElement(s), fjs = d.getElementsByTagName(s)[0];
js.id = o; js.src = f; js.async = 1; fjs.parentNode.insertBefore(js, fjs);
}(window, document, 'script', 'mw', 'https://scribeless-widget.web.app/widget.js'));
mw('init', { client_name: 'Sample Name', api_key: '1qmtqwpmUpWN2BBF7JfT0dt9AD3$MVRuDkr4b74Ebcxt84W9', stationeryConfigurations: {country: "USA", page_size:"half_letter_landscape", product: { product_type:"Full Service", delivery_type:"Ship for me" } , mode: "testing", features: {
colors: {
selector: true,
specific: []
},
styles: {
selector: true,
specific: []
},
sizes: {
selector: true,
specific: []
}
},
layout_and_colorscheme: {
stationery_customizer: {
primary: '',
secondary: '',
text: ''
}
}
},
recipients: [],
element: document.getElementById('scribeless-widget') });
var scribeless_instance;
</script>
<script src="https://scribeless-widget.web.app/scribeless-widget-helper.js"></script>

Step 2: Inputting Required Fields

Providing values for these fields is necessary for the widget to work. These fields cannot be omitted or left blank. Please contact the Scribeless Team if you are unsure about some of these configuration options.

  • api_key

    Your API Key can be found in your account settings. Log in to the Scribeless platform, click Settings in the dashboard and you should see your API Key.

  • mode

    Mode: stationeryConfigurations: {mode: "testing"}

    Current Available options: 'testing' or 'production'

    testing: this mode is only for testing purposes while integrating the widget inside your platform/codebase. All the campaigns/stationeries created in this mode won't be sent out.

    production: this mode is to be used when you are done with the integration process and want to make the widget live for your customers to use. All the campaigns/stationeries created in this mode will actually be sent out. (depends on your subscription)

    Note: Providing the mode is essential for the widget to run. When the widget is in Testing Mode a message reflecting the same will be displayed at the bottom of the widget.

  • product

    stationeryConfigurations: product: { product_type:"Full Service", delivery_type:"Ship to self" }

    Currently, only 'Full Service' value is supported by Scribeless Widget. Contact the Scribeless team for more information regarding 'On Demand' and 'Full Service' products.

    Product and Delivery Information

    Full Service:

    1. "Ship for me": We will print the notes and post the notes to your recipients.

    2. "Ship to self" (Currently Available only on Platform): We will print the notes and send them to you.

    On Demand (Not Available Currently):

    1. "Print on Request": Notes will be sent for printing upon a separate trigger or API request.

    2. "Print Now": Notes will be sent for printing when they are created.

    Note: If full product type Full Service is selected then a First Name Placeholder is auto injected in the stationery and it can't be removed from the stationery.

    Whereas in product type On Demand the First Name Placeholder is not injected and is not Required.

    Full Service - (With First Name Placeholder Auto-Injected)

    On Demand - (Without First Name Placeholder)

  • country

    stationeryConfigurations: {country: "USA"}

    Current Available options: 'USA' or 'UK'

  • page_size

    page_size:"half_letter_landscape"

    Page size property is dependent on the Country field.

    Page Sizes Available when - country: "UK"

    "A5_landscape" (210x148mm - 8.3x5.8 inches) "A5" (148x210mm - 5.8x8.3 inches) "A6_landscape" (148x105mm - 5.8x4.1 inches) "A6" (105x148mm - 4.1x5.8 inches) "A4" (210x297mm - 8.3x11.7 inches)

    Page Sizes Available when - country: "USA"

    "half_letter_landscape" (177.8x127mm - 7x5 inches) "half_letter" (127x177.8mm - 5x7 inches) "letter" (177.8x254mm - 7x10 inches) "postcard_landscape" (152.4x101.6mm - 6x4 inches) "postcard" (101.6x152.4mm - 4x6 inches)

    Note: Filling the country and page_size fields are necessary. Refer the sample Above

    Sample Recipient: The recipients can be added as an Array of Javascript objects with all the fields mentioned in the sample below. However, if you don't want to add the recipients upfront, they can be added later on using the API or you can also use the scribelessSetRecipients(value) function to add the recipients at RUN time programmatically. However, the structure of the recipients array passed to the function must be exactly similar to the one mentioned below. Both the API and function call methods are explained below in the "Features and Accessibility" section.

    Step 3: Placement

    Create a div tag with the id=“scribless-widget” and place it in your codebase at the desired location. This will be the place where the widget will be inserted.

    Copy and Paste the code below at the desired location:

    <div id="scribeless-widget"> </div>

    Note: This div tag will be the placeholder for the widget.

    Step 4: Loading Campaign (Optional)

    A previously created campaign can easily be re-rendered on the widget by making a call to the following function:

    scribelessGetCampaign(campaign_id)

    campaign_id : it refers to the id you receive in the response when a campaign/stationery has been created via making a call to scribelessCreateCampaign() as explained above.

    Note: By re-rendering a campaign, editing it and then using the scribelessCreateCampaign() function would create a new campaign/stationery and not edit the previously created one whose id was passed while calling scribelessGetCampaign(campaign_id).

Did this answer your question?