Because I am gradually transitioning my existing sites from RW Classic to Elements, and since there aren’t yet components available from third-party developers, I started tinkering myself. Inspired by Dan’s videos and the possibilities of AI, I set out to display live data from a Google Sheet on my site. In my RW Classic version, I used the Live Data Stack from 1LD.
Now, I’ve managed to create a custom component that can fetch any data you want. On top of that, everything can be styled exactly the way you like. I’m happy to share this component with anyone who might find it useful. It was incredibly enjoyable to build something from scratch, especially since I don’t know any coding language (which is precisely why I started with RW 20 years ago).
Anyone who wants to can modify it however they like. I also want to share this because it shows how much extra you can achieve with Elements using the basic components, a bit of determination, and a willingness to experiment.
This is so cool; both that you were able to do it and that folks here are offering their components for the community.
I’m just thinking out loud but I’m wondering if Google Sheets could be editable from within Elements (I don’t use Google Sheets so have no idea how they work). My wild thought is whether Google Sheets could become the repository for a text based CMS. Probably crazy but it certainly crossed my mind.
It’s entirely possible to use Google Sheets as a lightweight CMS for managing text-based content. By leveraging the Google Sheets API, you can fetch and display data dynamically within a framework. Sheets provide a structured and user-friendly way to manage content, while the API handles real-time updates.
This approach has already been implemented in frameworks like Webflow (via third-party tools like Zapier or Integromat) and Gatsby.js (using plugins like gatsby-source-google-sheets). However, we have to keep in mind potential API quota limits and performance considerations for larger datasets. This works well for small to medium projects needing simple CMS functionality.
Something that everyone should be aware of from the beginning when thinking about data - Google Sheets is NOT SECURE and don’t rely on it to be, as they scrape that data in the sheets to facilitate searching, etc - so that data is available to ANYONE, regardless of what they say.
If there is ANYTHING in your data, for instance emails, that anyone in that table would want to keep out of the public domain, then DON’T use Google Sheets.
I agree. Be careful with your data. I use it specifically to fetch numbers from a Google Sheet and display them on the site. More specifically, I created a site for a supporters’ club for people with disabilities of a major Belgian football team. To determine how many people want to join an away match, they fill out a form on the site. The data is stored in a Google Sheet, and this component displays the numbers on a page for the club’s board members. This allows them to easily see how many people are joining, how many wheelchairs there are, how many companions are coming along, and so on.
Additionally, I use it to retrieve match-related details, such as kickoff times, bus departure times, ticket prices, and more, from a Google Sheet. In the past, I had to manually update my RW page each time, but I didn’t always have RW readily available. Now, at the start of the season, I prepare all the pages with links to the appropriate Sheet files and cells. When the match details become available, I simply update the information in my Google Sheet, and it’s automatically reflected on the site.
For certain I wasn’t considering security at all - I was working on the basis this would be ‘public’ data which was going to be published on an open site anyway - much as you’re doing now. Certainly if there was information which needed to be secure I wouldn’t be trusting it to Google’s free offerings.
Ever since there’s been talk of a CMS component I’ve been thinking of how it might store entries. Some sort of cloud based service which didn’t require writing posts to the host servers’ directories would be good.
Thanks Bartje, I have been looking for a more customizable way to add my Google Sheets in Elements. Using RapidWeaver I am using Grid Iron 3 which works great for customizing my sheets. Now to figure out what data to use in your component will probably work out just great! Thanks again…
Great! I’m glad it works and that others can benefit from it as well . I’ve updated the existing version a bit. In terms of functionality, nothing has changed. I’ve only made some cosmetic adjustments and added icons to the inspector to make it look a bit more user-friendly.” Download Google Sheets version 1.1
. I’ve updated the existing version a bit. In terms of functionality, nothing has changed. I’ve only made some cosmetic adjustments and added icons to the inspector to make it look a bit more user-friendly.”