I was able to add html directly to email body and it works. However it will not show the actual value of the column that was added. It is not a virtual column.
Without html it shows the value. After I added the html, even with the column name html encoded, it does not work.
Here is my html code in a google doc.
https://docs.google.com/document/d/1LyuFNWyQEvraDAfaL4KXqfdfU10bJKZRHBs5naNa8hI/edit?usp=sharing (This is prior to removing line breaks in code.)
Account: 662927
App: Login - AppSheet
As far as I know, you can have a google doc or an html code as body, not html inside the doc, but Iām not sure.
I was going to check your doc but we have no access.
Can you post an image?
Hi thanks for your help SkrOYC!
Here is the code:
RGeneral3 @import url('[https://fonts.googleapis.com/css?family=Montserrat:400,700|](https://fonts.googleapis.com/css?family=Montserrat:400,700|)Open+Sans:400,700'); @media only screen { .column, th, td, div, p {font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI","Roboto",Helvetica,Arial,sans-serif;} .serif {font-family: "Montserrat",-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI","Roboto",Helvetica,Arial,sans-serif;} .sans-serif {font-family: "Open Sans",-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI","Roboto",Helvetica,Arial,sans-serif;} } a {text-decoration: none;} img {border: 0; line-height: 100%; max-width: 100%; vertical-align: middle;} .wrapper {min-width: 700px;} .row {margin: 0 auto; width: 700px;} .row .row, th .row {width: 100%;} .column {font-size: 13px; line-height: 23px;} .tm-menu-item {display: inline-block;} .hover-shrink:hover {transform: scale(0.7);} .video { display: block !important; height: auto; object-fit: cover; } @media only screen and (max-width: 699px) { .wrapper {min-width: 100% !important;} .row {width: 90% !important;} .row .row {width: 100% !important;} .column { box-sizing: border-box; display: inline-block !important; line-height: inherit !important; width: 100% !important; word-break: break-word; -webkit-text-size-adjust: 100%; } .mobile-1 {max-width: 8.33333%;} .mobile-2 {max-width: 16.66667%;} .mobile-3 {max-width: 25%;} .mobile-4 {max-width: 33.33333%;} .mobile-5 {max-width: 41.66667%;} .mobile-6 {max-width: 50%;} .mobile-7 {max-width: 58.33333%;} .mobile-8 {max-width: 66.66667%;} .mobile-9 {max-width: 75%;} .mobile-10 {max-width: 83.33333%;} .mobile-11 {max-width: 91.66667%;} .mobile-12 { padding-right: 30px !important; padding-left: 30px !important; } .mobile-offset-1 {margin-left: 8.33333% !important;} .mobile-offset-2 {margin-left: 16.66667% !important;} .mobile-offset-3 {margin-left: 25% !important;} .mobile-offset-4 {margin-left: 33.33333% !important;} .mobile-offset-5 {margin-left: 41.66667% !important;} .mobile-offset-6 {margin-left: 50% !important;} .mobile-offset-7 {margin-left: 58.33333% !important;} .mobile-offset-8 {margin-left: 66.66667% !important;} .mobile-offset-9 {margin-left: 75% !important;} .mobile-offset-10 {margin-left: 83.33333% !important;} .mobile-offset-11 {margin-left: 91.66667% !important;} .has-columns { padding-right: 20px !important; padding-left: 20px !important; } .has-columns .column { padding-right: 10px !important; padding-left: 10px !important; } .mobile-collapsed .column { padding-left: 0 !important; padding-right: 0 !important; } .mobile-center { display: table !important; float: none; margin-left: auto !important; margin-right: auto !important; } .mobile-left { float: none; margin: 0 !important; } .mobile-text-center {text-align: center !important;} .mobile-text-left {text-align: left !important;} .mobile-text-right {text-align: right !important;} .show-on-mobile { display: table !important; overflow: visible !important; line-height: inherit !important; } .hide-on-mobile { display: none !important; width: 0; overflow: hidden; } .mobile-full-width { display: table; width: 100% !important; } .mobile-first {display: table-header-group !important;} .mobile-intermediate {display: table-row !important;} .mobile-last {display: table-footer-group !important;} .mobile-first th, .mobile-intermediate th, .mobile-last th { padding-left: 30px !important; padding-right: 30px !important; } .tm-menu[align="center"], .tm-menu.mobile-center { width: auto !important; } .tm-menu-item { width: auto !important; display: inline-block !important; padding: 0 10px 0 !important; } .tm-menu.mobile-vertical .tm-menu-item { display: block !important; padding: 0 0 15px 0 !important; } .hamburger-menu, .accordion-content { max-height: 0; overflow: hidden; position: relative; -ms-transition: max-height .25s ease-in-out; -webkit-transition: max-height .25s ease-in-out; transition: max-height .25s ease-in-out; } .tm-menu-trigger img { display: block; margin: 0 auto !important; float: none !important; max-height: none !important; } .tm-menu-trigger:hover + .hamburger-menu, .hamburger-menu:hover {max-height: 300px;} .accordion-item:hover .accordion-content {max-height: 999px;} u ~ div .wrapper .tm-menu-trigger img {display: none;} u ~ div .wrapper .hamburger-menu, u ~ div .wrapper .accordion-content {max-height: none;} u ~ div .wrapper .tm-menu .tm-menu-item {display: inline-block !important; padding: 0 10px !important;} u ~ div .wrapper .tm-menu.mobile-vertical .tm-menu-item {display: block !important;} .h1 {font-size: 42px !important;} .h2 {font-size: 28px !important;} .h3 {font-size: 16px !important;} .spacer {height: 30px; line-height: 100% !important; font-size: 100% !important;} .divider th {height: 60px;} .mobile-padding-top {padding-top: 30px !important;} .mobile-padding-top-mini {padding-top: 10px !important;} .mobile-padding-bottom {padding-bottom: 30px !important;} .mobile-padding-bottom-mini {padding-bottom: 10px !important;} .mobile-margin-top {margin-top: 30px !important;} .mobile-margin-top-mini {margin-top: 10px !important;} .mobile-margin-bottom {margin-bottom: 30px !important;} .mobile-margin-bottom-mini {margin-bottom: 10px !important;} .no-border-on-mobile {border: none !important;} .overlay-bg {background-image: url('images/overlay-dark.png');} }
|
|
