How to embed Tables and Charts in Softr

Learn how to embed your spreadsheet Tables and Charts in Softr.

Intro

Use embed to add your Rows table, charts, forms and calculators inside Softr. You can embed any element from a spreadsheet - a Table, Chart, or Form - and have a live connection between your Softr.io application and Rows spreadsheet.

Embedding data from a spreadsheet

To embed any element from your spreadsheet, follow these steps:

  1. Choose Embed in settings menu located in the right-hand corner of the element you want to embed.
  2. Click the Share privately toggle.
  3. Click Copy code

Softr calculator

  1. In Softr, add a Custom code Block to your app.
  2. Replace the html code "Embed your custom code here" with the embed url copied from Rows

That's it. Use the Preview option to see the embed before Publishing the app

Adjust it to your style

Calculator embed code

After adding the embed to your Softr application, you can customize it to blend into your website experience perfectly. These are the most common adjustments:

Border: Add a border around your calculator by turning the border element to 1px. To customize the color of the border, replace the default hex code of the border (#EAEAEA) with your own color.

Width: By default the width of your embed will adapt to the width of the screen. To set a maximum width, simply replace width = 100% with the pixel length of want -  width = 820

Height: Same goes for adjusting the height. The standard height is 450px.


Embeds of spreadsheets that are Published to the world will have an Open full version option that allows viewers to use and duplicate the spreadsheet to their Rows accounts.

If you want to stop the embed, remove simply remove the Block from the Softr doc or remove the sharing permissions of the spreadsheet.