Decorate the output HTML file with Bootstrap

Hello
This time, it is a tip using the Create HTML function of Automation.

The current card view is very fashionable, but I have one complaint.

The text cannot be line broken.

KonoWM App ๏ผˆฮฒ๏ผ‰.png

However, if you enable line breaks, your view may look messy.

So I searched for a way to look beautiful outside.
I discovered that Bootstrap can be used with the function using Create for HTML!

The following video is an example.

KonoWM-App-๏ผˆฮฒ๏ผ‰.gif

The timeline view, which is difficult to see in the card view, can be reproduced in HTML.

And with Bootstrap, you can easily decorate your high-end views.

And to keep it up to date with the latest HTML files, I use the following tricks.

1. Create an HTML file with Automation
2. The save location and file name are fixed (Disable Timestamp is True)
3. "Folder name / file name.html" in the target record

Please enjoy it if you like.

 

2 5 462
5 REPLIES 5

Thanks for letting us know your use case.
BTW, when you say "Create for HTML" do you refer the Task "Create a new file" using HTTP Content Type as HTML? Because it was very confusing on your post.

Also I don't see why (but haven't tested) you couldn't use any other CSS framework. I'm thinking of start using Tailwind but haven't had the time.

PS: Your html looks good, maybe a tip on how to create .html reports using bootstrap could be useful to step up our scheduled reports

Yes, as you say Create a new file" using HTTP Content Type.

Thank you๏ผ

Also, a CDN is required.

I tried "UIkit" as another framework, but I got an error.

Depending on how you write it, you will get an error, so further research is needed.

Make sense, since AppSheet can not be aware of any other file rather than the actual .html
So TailwindCSS would work with the Play CDN script

This is now more work as compared to creating a data studio dashboard using AppSheet as data source. 

Maybe, personally all of the AppScript as well as Data Studio features are out of my range because:
1. We are Microsoft clients/users
2. I don't like Google services

So if there is anyone with a similar case, your tip keeps being useful

Top Labels in this Space