How to Create HTML Email in Gmail
Vložit
- čas přidán 21. 07. 2024
- Create HTML emails in Gmail with CSS, insert tables, responsive images, buttons, social icons, and brand logos. You can design HTML email newsletters and signatures in Gmail without installing any extensions.
If you are using email template builders like MailChimp or Google Docs, export the template as an HTML file, inline the CSS styles with Juice and embed the inline HTML directly in Gmail using Chrome Dev Tools.
You can use the font-family CSS style to use different Google Fonts with your emails.
To embed CZcams videos and Google Maps in your HTML emails, upload the thumbnail image of the video (or capture a screenshot) and link it to the actual video or maps website. IFrame Tags and JavaScript cannot be added to HTML emails. - Věda a technologie
Create beautiful HTML emails in Gmail and send them with Mail Merge
🌟 gsuite.google.com/marketplace/app/mail_merge_with_attachments/223404411203
For email newsletters exported from MailChimp and Google Docs, use the Juice tool to inline CSS before sending with Gmail.
🐢 automattic.github.io/juice/
This is the only channel that matters. Thanks Amit!
Great explanation ... Amit helped me a lot ... after 4 hours of research I was finally able to help myself with the video. Thanks very much
Thank you, I was struggling to send an advanced HTML message (with beta64 image) with the other tutorials online, this is the only one that worked!
@amit you have been a personal tutor for me for over a decade. thanks :)
You answered a question that I've been trying to figure out all day! Thank you!!! I'll subscribe to your channel for more content.
This was super-useful. Thank you so much for creating such great content.
Excellent video! Loved that you went through multiple methods :)
Amazingly useful. Thank you so much. You really are the best.
Thank you so much for this! great job!
Thank you, Amit. Great explanation.
Very cool! Just wish the button appeared as a button in all email clients (i.e., Outlook and Microsoft Mail), but still...great tutorial!
@
Amit Agarwal
A big big thanks to you brother for making this video. It took me almost three days to find this type of video, and then I came across yours. Thanks again :)
That's such a brilliant tip, Amit !
How would these emails show up when received within Outlook or other email services?
I assume it depends on whether they have HTML enabled. If not, will the email content still be legible?
Many thanks
Awesome Tut.. Simply explained and very useful..
Amazing! ...just what I was needing.
Awesome. Did the first one, it worked. Have a good night. You're are doing a great job.
Great video, great explanation…and nice music. I'm subscribed...
The first method worked for me, thanks a lot.
Incredible! Thank you for sharing.
Much thanks for your guidance greatly appreciated Amit :)
Thank you, Amit, very helpful.
THANK YOU!!! you are the best!
Thanks. I found a lot of your source on your site but I still stuffing my issues. Can you help to do “make copy” for a shared google drive file on the internet to my root folder?
saw about your life and love what is your history. You are IRL inspiration sir
You are good Amit, perfect time
wow .... currently i am using canva. now i learned from u how to use html with out canva.
Thank you creative dude Amit.
Hi Amit -- I have a question: What do YOU read, where do YOU go, what do YOU watch for learning or learning ABOUT new tech, or the code of coding tips that you talk about in your own videos? Thanks very much!
awesome, man, thanks a lot for this hint!!
Always better 👌👌
Can't thank you enough!
Sorry couldn’t hear you. Did you say use CSS Lite to create css inline? Ok, you said CSS In-line tool made from the company Automatic. So far I did your first two examples. They came out great thank you. Now for the third. Some people are paying $50 and hour and you can work remotely. Hate to cut my pay in half, but I like the remote aspect of a job. Oh, I found the CSS in liner tool, on line. Thank you.
This is exactly the video I've been looking for! Thank you so much man, keep it up! Just one question, how is it possible that the last HTML email you sent from mailchimp could keep the images if they weren't attached. I mean, just through the HTML code images are contained somehow?
Hi Guillermo, the reason the images were kept is that it is a template on the Mailchimp newsletter. so the template html itself is what was uploaded.
you have to deploy it, mdb does and hosts it for free
Great content !
Keep it up 👍
FANTASTIC! THANKS!
awesome information
3:43 - Genius
Thanks, Its very help full.
I learnt something new thank you
100th comment ,thanks for great information
Hi how are you getting the “Inspect” on your drop-down list? Please could you clarify which OS and browser you are using? Thank you for a very clear presentation.
He's using macos. I am not sure about the browser, but chrome and edge has the inspect button on both windows and macos
This channel is awesome, everyone should visit here.🙂
Thanks, It was nice.
Amazing! Love It
when i paste the html, i see only the shape of the newsletter but nothing else, i tried few times... any advice?
Is there a way that i can make gmail like mailchimp? Do you have a video for that?
Thank you so much!
Awesome, I'm guessing this can be used to create a draft for mail merge??? Wish you would do a video about that. 🤔
You are correct. Any Gmail draft you create with HTML email can be used as a draft template in Mail Merge.
Thanks for making this video.
Thank you Amit!!
Hey Amit, Really useful I was scratching my head since morning, This video was really helpful. But the same content is not rendered on mobile. Any suggestion.
Niiiiiiiiiiice! Tysm!
Fantastic! Tks.
Thank you!
Thanks a lot sir! I’m wondering if there is a way to automatic this process or every time should I need to do it? Thanks again
(1) Settings > Advanced > enable Templates (refresh the website).
(2) Compose > More > Templates
Now you can make the inspect element changes and save them as a template and reuse infinite no. of times :)
@@haripras.d that is amazing! Thanks sir ✌🏻
Just works with Gmail!
Hi Amit. How about personalized data from excel with this rich html?
çok çok çok çok çok çok çok çok teşekkürler
Thank you sooo much)
What should I do if the HTML and css files are seperate
Thanks, sir my issue resolve
Thank you so much
thank you very much
So can't that sample template made responsive? Like having CTA links
GOAT!
While I am sending the HTML email to anyone using the MailChimp Template, it's showing *|MC_PREVIEW_TEXT|* in before the subject line. Do you have any solution for that?
Do we have a solution for that?
Subscribed 🙏
I put in my inline html and it appears in the email but when I send it, I still get the emoji. Can anyone help me with that?
Thanks
Thank you Amit for this informative video! I followed the steps you outlined in your video and had tried to paste HTML code from an invitation I had built using Canva. But unfortunately, Gmail is saying that the content is blocked. Any idea why that is and how I can fix this?
I am using canva. so thought to reply u. If u use canva u can download it as JPG or PNG and insert the document u downloaded as JPG or PNG in the email.
Thank You
Hey Amit! Thanks for posting such great content out! I tried the same thing, edited the HTML but the moment when i send the email out, on the receiving end, I'm receiving the emoji :(
Please advice!
@Amit Agarwal same problem here It did show after pasting the code in the window But when I am sending the mail it returns an empty email.
Even without the body tags ! is there a Gmail setting that has to be
off or on?
I have the same problem...
I have the same problem.
I am your big fan sir
thank you!
me too
Hi how to send fold unfold and html code in email
I can't get this to work. I copy the html formatting and I can preview the change, but then when I save the email it does not save it. Sends only the emoji even though I deleted it and copied the html to replace it. Why?
same, did you find any solution?
@@SpaceRanger21 Yes. You need to be very specific about where you click and copy. It needs to be on the correct side of a small line that's hard to see. That's all I can remember from 4 months ago.
@@matthewmyers7075 yes, I figured it shortly after commenting. Thanks for your reply thought.
Sir I tried I inserting the HTML code using the method but the image which I am inserting is not visible in the email. Sir can you please guide me what could be the reason
pUT YOUR IMAGE ON AWS BUCKET AND COPY THE URL IN YOUR CODE INSTEAD LOCALLY SOLVED !!!
Where can I copy this HTML format?
I'm unable to get the button!
how about to adding image/icon??
this doesnt work anymore
JS,CSS DOESN'T WORK
too long method just open your design in your browser select all the templet by pressing Ctrl + A AND PASTE IN YOUR MAIL SIMPLE
I tried but definitely not the same result!