You can feed this HTML file into Juice to inline the CSS styles and then insert the transformed HTML into Gmail using the emoji trick. The only requirement is that the tool should have an option to download the designs as an HTML file. You can use MailChimp or any other email template designer to create the newsletter. So if someone is viewing the email on a mobile phone, they would see a different layout than a person who has opened your email on a desktop computer. If you are new, the term responsive essentially means that the styles change automatically based on the device of the user. Until now we have seen examples of adding basic HTML blocks inside Gmail but wouldn’t it be nice if we could send professional and responsive email newsletters through Gmail? This can be easily done through Juice - simply paste the HTML and CSS in the input box and it will inline all the CSS styles in the HTML tags that is compatible with Gmail. Therefore, prior to pasting the pasting the table HTML into Gmail, we need to “inline” the styles else the formatting will be ignored by Gmail. Unlike our button above that had all styles inlined, the CSS of the table is contained in a separate stylesheet. In the next example, we will embed an HTML table in the Gmail editor.
Watch the video for a more detailed tutorial. You’ll now see a beautiful HTML button rendered in your email message with all the CSS styles and formatting. Replace the selected content with the button HTML and click anywhere outside the dev tools window.
Select the tag that contains the emoji, right-click and choose Editor HTML. This opens the Developer tools in the bottom half of the browser. Right-click the emoji in the Gmail editor and choose Inspect. Add an emoji in the message body to be replaced with the HTML button. We cannot copy-paste this HTML directly into the email editor of Gmail but with the magic of Chrome Dev Tools, we can.
0 kommentar(er)
