Question 1

Mapping your Sheet data to website elements

Accepted Answer

In this help article we will cover the basics of content management and configuration in SpreadSimple.

What is a card?

Basically, a card is a core element of your content. Each card represents one item of your listing whatever website template you are using.

A card consists of the following elements:

Title
Subtitle
Price
Text (supports Markdown and HTML tags)
Image (or Images)
Specification
Call-to-Action Button (or Action Button)
${color}[#4f4f4f](SKU (not displayed on the site, but used for notifications and automation needs))

These are basic but you don't have to use all of them - just pick the ones you find necessary. That could be easily done on your Content Tab on the left.

If you don't need a certain piece of information to be shown just leave the corresponding field on your Content Tab empty. That will be applied to all the cards.

You may arrange information on your card the way you prefer to. Just choose a necessary column for the element you want it to be. E.g., ${color}#0433ff column information can be mapped to Subtitle, Text or Specification fields.

![](https://storage.crisp.chat/users/helpdesk/website/918f954175

Question 2

Adding images

Accepted Answer

In this help article we will explain how to add images on your website.

First, ensure you have an image column (or multiple columns) on your Google Sheet, and proper column mapping in the SpreadSimple.

You can have one or multiple image columns You can configure image column mapping on the Content tab

To display images on your website, SpreadSimple needs a link to an image file hosted online. E.g: https://images.unsplash.com/photo-1536500152107-01ab1422f932 or https://i.imgur.com/0JSkR76.jpg

The links to images should be put as text to the corresponding cells under the image column in your Google Sheet.

Where do I get image links?

Q: How to use Webhooks for automation

<p>This <strong>Webhooks</strong> feature can be found in <code>Checkout Tab</code>. </p> <h3 id="whatisawebhook">What is a webhook?</h3> <p>Put simply, as soon as something happens, the webhook immediately notifies other applications transferring the data about the event. Just like SMS that you get from your bank whenever there is some activity in your bank account. So basically webhooks provide automatic real-time communication between apps and it's all done quickly and almost effortlessly. </p> <p><img src="https://storage.crisp.chat/users/helpdesk/website/918f9541750fe800/ss-webhooks_bspbg1.gif" alt="" /></p> <h3 id="whatdoineedwebhooksfor">What do I need webhooks for?</h3> <p>Using webhooks can be a great way to automate your business processes like order collection that results in saving lots of time and effort. All you need to do is integrate them with other tools you want to use. </p> <h3 id="howdoisetthewebhooksup">How do I set the webhooks up?</h3> <p>To use webhooks you will need an intermediate automation service like Integromat, Zapier, etc. There you need to add the tool you want to connect with your SpreadSimple website and then create your custom webhook URL. This URL should be pasted into Webhooks URL Field in your <code>Checkout Tab</code> on SpreadSimple. </p> <p><img src="https://storage.crisp.chat/users/helpdesk/website/918f9541750fe800/manage-or-spreadsimple-2020-08_1x99uol.png" alt="Setting up the Webhook URL" /></p> <p>After all the changes have been saved, make sure to have a test run to see that your service catches the webhook which means the connection is working. For that you just need to make a test order in your store. If every</p>

You should either upload images to a hosting service or use a link to an existing image.

|| We do not recommend using Google Drive and Dropbox to host images for SpreadSimple (and any other) websites as they don't work stably for that purpose, which may result in images disappearing.

| You can use our own Image Uploader Extension and install it in your Chrome browser or a dedicated image hosting service.

Let's review several services that help to upload and host images.

Disclaimer: you choose to store your images on these or other image services at your own risk.

||| Please, respect the terms o

Question 3

Add-ons Tab

Accepted Answer

The Add-ons tab contains the list of integrations available on SpreadSimple.

There are various categories of tools and services for you to browse through. Also there is a Search bar on the top of the page.

Each integration card has a badge:

Built-in means that it doesn't need any configuration (in most cases) and there's an instruction on how to use it inside the card.

Follow the instruction to use this built-in integration

Not connected means that you haven't enabled this service/tool. Once you enable it, the badge will change to Connected.

Follow the instructions inside the card to connect the service or the tool

Some integrations are available both on Free and Pro Plans, and some of them are Pro only.

Question 4

Embedding SpreadSimple as a widget into other platforms

Accepted Answer

Embed your catalog or directory built with SpreadSimple as a widget onto another website by following these simple steps:

Configure your widget settings

|| The instructions below apply to the new widget format. The old widget format will remain working, but we recommend updating the widget code on your host website.

Go to the Settings Tab -> Widget settings and open the Widget builder

Select the routing option (if necessary):

By default, all the widgets use routing. In this mode, during the navigation on the widget, a path is added to the website page URL. For example:

Website URL: domain.com Website URL with the widget embedded: domain.com/# A details page on the website: domain.com/#/item/item-one

Usually, this type of routing works best because it allows avoiding conflicts with other pages of the host website.

But sometimes the hash in the URL (#) can conflict with anchor links on the website. For cases like that, there’s the no routing option that you can select on the menu. In no-route (or route-less) mode, the widget navigation won’t change the URL of the host website. This means the details pages won’t have URLs like domain.com/item/item-one.

Set the widget path (if necessary)

Setting the wi

Question 5

How to use Webhooks for automation

Accepted Answer

This Webhooks feature can be found in Checkout Tab.

What is a webhook?

Put simply, as soon as something happens, the webhook immediately notifies other applications transferring the data about the event. Just like SMS that you get from your bank whenever there is some activity in your bank account. So basically webhooks provide automatic real-time communication between apps and it's all done quickly and almost effortlessly.

What do I need webhooks for?

Using webhooks can be a great way to automate your business processes like order collection that results in saving lots of time and effort. All you need to do is integrate them with other tools you want to use.

How do I set the webhooks up?

To use webhooks you will need an intermediate automation service like Integromat, Zapier, etc. There you need to add the tool you want to connect with your SpreadSimple website and then create your custom webhook URL. This URL should be pasted into Webhooks URL Field in your Checkout Tab on SpreadSimple.

Setting up the Webhook URL

After all the changes have been saved, make sure to have a test run to see that your service catches the webhook which means the connection is working. For that you just need to make a test order in your store. If every

Question 6

Adding pages and links and managing navigation

Accepted Answer

Tell more about your project, your product and yourself by:

Adding pages Adding links Configuring website navigation

Adding and editing Pages

To add a page, go to Pages & links Tab, and click Add page

After the page is created, you can start working on its content right away.

We'd recommend you expanding the Editor for a better writing experience. The Editor supports Markdown.

Expand Editor by clicking the button

The expanded Editor

There you can easily edit your content, and add blockquotes, links, images, tables, and insert a code block:

And you can import your Notion pages.

After all the changes are done, close the Editor and save the changes.

In the same Tab, you can also manage your page navigation settings. You can change the page name, page address (the URL), choose the tab where your page will open:

T

Frequently Read Articles

Browse All Categories