CSV - Table Connect

Setup

Basic Setup

• Drop the widget into Muse Design mode. Place the widget where you would like the table to appear.
• If you're using multiple Table Connect widgets on the same page, be sure to use unique names in the Unique ID field.
• Select a CSV Source:
  • Google Spreadsheet - Allows for linking to spreadsheets in the Google Sheets app. This is our suggestion in most all cases since it allows for instant updates without having to open Muse.
  • Local CSV File - This option uses local CSV files uploaded from your computer. This option may be best if you are given table content in .CSV file format. Requires opening your Muse project.

Google Sheets Setup

Detailed instructions for working with Google spreadsheets can be found in the "Editing the web-based Google Spreadsheet templates" below.

• Open the Google spreadsheet template links found in the bottom of the widget option panel.
• If you are not already signed into your Google account, do that before proceeding.
• The content and presets sample spreadsheets cannot be directly edited. Make a copy of each: File > Make a copy.
• Name your copies.
• Publish the copies: File > Publish to the web. Make sure to publish the documents as .CSV files.
• Grab the Google spreadsheet keys and paste into the content and presets spreadsheet key fields in the widget option panel in Muse.
• Your spreadsheets are now linked to the widget, and may be previewed in browser if you wish. If no edits have been made, you will see the sample table.

Content Spreadsheet

• You may rename all of the column names.
• Update all table data as desired.
• To use links or images, use pure HTML. Place the HTML directly in the desired cell. If you're not familiar with creating links or images using HTML, use an online generator such as: http://scriptgenerator.net/html-text-and-image-link-generator/

Link Example: <a href="http://www.musethemes.com">MuseThemes</a>

Image Example: <img src="http://regalideas.com/wp-content/uploads/2016/08/tkk-test-icon-circle.png" alt="MuseThemes Logo"></a>

Presets Spreadsheet

• There are numerous options in the presets spreadsheet. Descriptions of each can be found in the notes column.

Widget Option Panel Like the other Connect widgets, the widget option panels are rather simple since the majority of settings are found in the presets sheet. Some key options can be found in the Settings section:

• Preloader Type: A preloader is displayed on the page while the table is loading. The Preloader Type setting offers several preloader types. Some preloader options allow for both preloader and preloader background colors, which can be set below.
• Local Storage: This setting is offered to aid the designer during the setup and testing of the table. Since web browsers cache data as you preview your table, it can be difficult to see changes as they're made with caching on. We've built in a local storage system that can be enabled, disabled, or set to a custom refresh interval. Our strong suggestion is to use the "Do Not Store" setting while you're setting up your table. When your table is complete, change this setting to "Permanent".
• Enable CSV Download Button: This cool little button allows for website visitors to instantly download the table data as a .CSV file if you desire. Line 7 in the presets sheet allows you to customize the text for the button.

When viewing a large table on a mobile device, you can scroll left and right by swiping anywhere on the table (version 2.0 and up)

Editing the web-based Google Spreadsheet templates

• You will need a Google account and access to the free Sheets web app in order to edit the template (no Google account is required for viewing the template).
• Follow the link in the bottom of the widget panel to open the templates.
• The template is view-only and cannot be edited as-is. Make a copy of the template: File > Make A Copy.
• Name the new copy.
• The new copy can now be edited.
• When ready, you will need to publish the spreadsheet in order to use it with Sidebar Menu. Go to File > Publish to the web...
• Click the "Web Page" dropdown and select comma-separated values (.csv).
• Click “Publish".
• Copy the long set of random characters in the browser's URL field, or in the link shown in the Publish To Web pop-up.
• Paste this Google Spreadsheet Key into the Widget option panel in Muse (you will need keys for both the Content and the Presets spreadsheets).

Tips for editing CSV files

• Once you've published your Google Spreadsheet, ANY change made to the spreadsheet will be updated on your website. This is handy and quick, though you will want to be careful to make sure that your changes are exactly what you want.
• The data within the CSV must be entered carefully:
  • Spaces are not supported in most entries
  • Be careful if you're cutting and pasting (be sure not to include extra characters or spaces)
  • Do not create empty rows
• In the Presets Spreadsheets, the only fields that need to be updated are the cells in the "option_value" column. Values in this column may be numbers or letter text. For basic enable/disable options, 1=enable, 0=disabled. We've built in dropdowns wherever possible for common variables.
• Check your progress often while editing CSV files. Small errors such as spaces or typos can make it so that your sidebar menu does not appear. If you’re working with a local file, save and load the file into the widget, then publish to check for functionality. If you’re working in Google Sheets, simply preview your sidebar and refresh the browser to see ongoing updates. If you do have an issue, use the “undo” function in your spreadsheet editor to back up to a point where the widget was working.

Commonly Asked Questions

What is a .csv file?

A .csv file is a basic spreadsheet file that can be edited in Excel, Numbers, Google Sheets, or similar.

Should I use the web-based template, or the local file? What's the difference?

Ultimately, there's no difference in the functionality of the sidebar menu, whether you use the web template or the local template. Local files allow for traditional editing and backup in your favorite spreadsheet editor. The web template option allows for immediate remote updates for you or your client.

Known Issues/Conflicts

No known issues or conflicts

Additional Info Links

• Forum Link: http://forum.musethemes.com/forums/connect-csv-widgets.30/
• Update Log: http://www.muse-themes.com/pages/release-log.html