Decorate the output HTML file with Bootstrap

AppSheet Tips & Tricks
, ,
1

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
KonoWM App ļ¼ˆĪ²ļ¼‰.png701Ɨ793 44.9 KB

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 Likes
2

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

2 Likes
3

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.

4

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

1 Like
5

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

1 Like
6

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

1 Like