Spreadsheet as CMS

1. Format your Spreadsheet

First, head over to Google Sheets or Excel Online and create a new empty spreadsheet.

The first row (1) should only contain column names. All the other rows may contain data, in whatever format you'd like (symbols, numbers, dates, words, etc).

For example:

	A	B	C	D	E
1	Name	Favourite Thing	Image
2	Bugs Bunny	Carrots	Bugs.png
3	Elmer Fudd	Chasing Rabbits	Elmer.png
4

Once you're happy with the format of your spreadsheet proceed to the next step.

2. Sharing your Spreadsheet with sheet2api

In order to connect your Google/Excel spreadsheet to sheet2api, you'll need to give sheet2api access to it, here's how to do that.

Private Google Sheets

Use this method if your spreadsheet is private and you would like to keep it that way.

1. Navigate to your Google Sheet in your web browser.
2. Click "Share" in the top right.
3. In the "Add people and groups" input box, type [email protected].
4. Un-tick "Notify people" and click "Share".
5. Finally, click "Share" at the top right again, then click "Copy link".

You'll then use that copied link when you Create Spreadsheet API.

Public Google Sheets

Use this method if your spreadsheet is public.

1. Navigate to your Google Sheet in your web browser.
2. Click "Share" in the top right.
3. At the bottom right of the popup window click "Copy link".

You'll then use that copied link when you Create Spreadsheet API.

Excel Online

1. Navigate to your Excel Online Spreadsheet in your web browser.
2. Right click on the address bar and select "Copy".

You'll then use that copied link when you Create Spreadsheet API.

2. Create Spreadsheet API

Create your Spreadsheet API by pasting your spreadsheet link from the previous step into the form.

Click Create 🚀. Your new Spreadsheet API will be listed on the next page.

Great, that's the hard work done, on to the final step.

3. Populate your website

Place the following HTML code in your website to display the information from your Google or Excel Sheet.

HTML:

<div data-spreadsheet-api="https://sheet2api.com/v1/FgI6zV8qT121/characters/">
        <div>
            <span>Name: <b>{{ Name }}</b></span>
            <span>Favourite Thing: <b>{{ Favourite Thing }}</b></span>
            <span>Image: <b>{{ Image }}</b></span>
        </div>
</div>
<script src="https://sheet2api.com/v1/template.js"></script>
                    

Remember to replace https://sheet2api.com/v1/FgI6zV8qT121/characters/ with your own API URL.

Example output: