Creating a dynamic directory on Google Sites using spreadsheet data

Hey everyone, I need some help with a project I’m working on. I’ve got a Google Form that feeds into a spreadsheet, and I want to use that data to make a nice-looking directory on a Google Sites webpage. The form is for babysitters to sign up for our community directory. Right now, I can embed the spreadsheet on the page, but it’s not very user-friendly. There’s too much scrolling involved, and it doesn’t look great. What I’m hoping to do is format the data so each babysitter’s info is displayed in a more readable way, maybe over multiple lines instead of just one long row. I’ve tried using QUERY to select specific columns, but it’s still not quite what I’m looking for. Has anyone done something like this before? Is there a way to do it directly in Google Sites, or should I be looking at other options? Any tips or resources would be super helpful. Thanks in advance!

I’ve tackled a similar challenge before by using Google Apps Script to create a custom solution. Instead of embedding the raw spreadsheet data, I wrote a script that fetched the data from the spreadsheet and then dynamically populated an HTML template with the necessary placeholders. By publishing this script as a web app and embedding it in Google Sites through an iframe, I was able to completely control the layout and styling of the directory. This approach may require a bit of coding, but it’s quite manageable once you get the hang of it, and it updates automatically whenever the spreadsheet changes, provided you set the permissions correctly.

hey ethan, i’ve had this issue b4. try using google data studio (now called looker studio). it connects to your spreadsheet and lets u make cool visualizations. u can create cards for each babysitter and customize how it looks. then just embed that on ur site. its pretty easy to figure out and looks way better than a plain spreadsheet!

Having worked on a similar project, I discovered that Google Apps Script offers a practical solution. I built a script to pull data from the spreadsheet and then formatted it into HTML so that each babysitter’s information appeared as a separate card. Using the HTML Service, I created a web app that was embedded into the Google Site via an iframe. This method allows complete control over layout and styling without cluttering the page. Although it requires some coding, plenty of tutorials exist to ease the learning curve.