Hey guys, I've just released my completely new and updated "HTML Email Mastery Course" for 2024 with the latest HTML Email concepts. I'm excited to release it, this is the best course I've ever made. Check it out here: ➢ responsivehtmlemail.com/email-course/ (coupon link for Udemy)
@mustang7ist8 ай бұрын
Almost done coding along with this video. I have to say I'm pretty excited. I wasn't even aware this was a potential job opportunity. I have been attempting to make a career change for a while now. I think I found a niche I could potentially excel at. Thanks a lot for this video. I have so many questions, but I feel that most will be answered in your online course. I just purchased it! Looking forward to working towards becoming a Email/Marketing Campaign Dev. BTW, thanks for the discount on your course!! You Rock!
@htmlemail3 жыл бұрын
Like and subscribe for more HTML Email Tutorials :) Watch the preview video for the course mentioned here on my HTML Email website: responsivehtmlemail.com/course/
@imranexd279 Жыл бұрын
You got way more than 400 likes and it was deserved
@imranexd279 Жыл бұрын
I hate using tables when making email templates i just don't understand them well i perfer using flex box is it ok ?
@toxicjingle Жыл бұрын
@@imranexd279 same here, but most flex grid is not supported in emails I believe
@pankajsharma98018 ай бұрын
Can anyone help me in understand in what is the condition to use table tag inside tr > td?
@Camxlare Жыл бұрын
This tutorial was setup nicely, straight to the point, and I was able to understand how to break up responsive columns. I'm aware this is a preview to the course but this video pretty gives a good foundation. Now we are moving towards more templating, using MJML or the new React html email.
@williamadil2 ай бұрын
why were you looking at this if you had something like MJML? I saw your comment and then found out about MJML. Curious why you were on this video if you already had a good tool. 🤔
@Camxlare2 ай бұрын
@@williamadil Good question! This was only to get my hands dirty and see what methods others are using. MJML and other templating frameworks such as Foundation Framework is the way to go!
@tripsmarketinggroup2 жыл бұрын
17:00 30 * 5 is 150 . Great tutorial overall thank you!
@jwbnscacpt Жыл бұрын
I have been designing an email for a nice calculated fields plug-in auto email, including conditional “if_not_empty” tags, and this was most helpful to make the top and bottom look really nice! Thanks for the thorough walk through.
@MrJrce2 жыл бұрын
Great tutorial! I'm just curious why you put all your styling in with your HTML instead of creating a separate style sheet? Is it the norm when making email templates?
@LifeOfJowl2 жыл бұрын
yes
@htmlemail2 жыл бұрын
Yes, some external CSS works for modern email clients but for best rendering we need the CSS inlined, separate style sheets will not work.
@RockstahRolln2 жыл бұрын
@@htmlemail Brilliant!! Thank you! This makes logical sense because the templates are embedded into an email and external stylesheets will not render when embedded in this case.
@SergioInToronto4 ай бұрын
THANK YOU for making this!! I don't enjoy writing HTML emails but this really helped me.
@oswhytecodes12 жыл бұрын
Im actually really impressed by how you choose the pixel sizes. Im assuming over time, these numbers get easier to decide on.
@111nation Жыл бұрын
yes
@avinashyadav-dg5mh Жыл бұрын
I have an doubt html5 under tag not is supported Then why you mention in template?
@VivekKumar-nv7hi2 жыл бұрын
you are so helfull man god bless you love from india
@dnlbellfield2 жыл бұрын
I really like your html email udemy course! This video is a great resource too. Thanks!
@Agustin-jo8mv Жыл бұрын
Mannnn these videos are amazing. I am loving this and the way you're explaining everything.
@irfanakatkn14572 жыл бұрын
THANK YOU SIR, YOU ARE FANTASTIC!!
@saravolf37532 жыл бұрын
The way you've set your containing tables are awesome. I've noticed that, after adding a custom Google Font, the layout goes wonky for iOS Desktops whenever I use other main container setup methods--but not this! I wonder what's going on behind the scenes behind this magic. xD Officially a fan of this method now. Thank you for sharing!
@htmlemail2 жыл бұрын
Thanks :). I spent a bunch of time in Email on Acid stripping down code to as little as possible while still working.. and this was the result (aside from Outlook stuff not in the youtube videos).
@JuanVasquez-ou1mf Жыл бұрын
check a framework > normalize
@mozzie41312 жыл бұрын
Incredibly knowledgeable and we'll-spoken teacher. Nice tutorials comfortableness with the subject makes starting soft real exciting!!
@vangmvp072 жыл бұрын
Just curious of why you use instead of tag
@htmlemail2 жыл бұрын
You have to use tables for best rendering in email clients.
@007lisaalvarez8 ай бұрын
What are you building the original email imagery on and are you now uploading the design to this code building app. Where is the email imagery coming from? Is it one image or sliced? what format?
@pjsbeat Жыл бұрын
tag doesn't work anymore, I loved the content and was following the tutorial but my page is not responsive. Please advice what can I use instead of tag
@sergiol.37552 жыл бұрын
just finished this tutorial and I just went and bought your course . thank you
@lastspoil55478 ай бұрын
Update on your journey?
@sergiol.37558 ай бұрын
@@lastspoil5547 I ended up getting a job in IT just left there in dec and on jan 2nd got my first job in software development working with C# and javascript.
@groovecat Жыл бұрын
Great info. To be a freelance email developer do you need to pay for something like Email On Acid to test your work?
@muhammetruuz51852 жыл бұрын
Great video and really helpful! I couldn't get a grasp on how the setuper works but it's all clear now.
@rique5434 Жыл бұрын
great videos brother!
@KeyAndLock77 Жыл бұрын
Curious what is the advantage of wrapping img inside element. Does that keep image in place or soemthing?
@edgarmolina6222 Жыл бұрын
A tag links the image. Otherwise it’s just an image.
@KeyAndLock77 Жыл бұрын
@@edgarmolina6222 it is not clear why he is using A with no link in href. I believe there is some advantage not clarified
@edgarmolina6222 Жыл бұрын
@@KeyAndLock77 the only time he did that was when he set up the social media buttons and put a hashtag in the place of the link, which essentially is just a placeholder for a link since this was just a dev version of a real email.
@mosesnjoroge5639 Жыл бұрын
Proficient in HTML and CSS and have been having a tougher time with JS so I just began googling if the two languages can get me a job and just learnt about HTML Email jobs and look forward to applying for them as I continue learning about JS and later react. Thanks for this.
@JesusAndDev Жыл бұрын
I’ve been a email dev for about 5 years and if you can find a job that teaches you Adobe or Salesforce it’ll boost your salary
@mosesnjoroge5639 Жыл бұрын
@@JesusAndDev Can you help act as a guide and help me navigate through this to help me save time? I have found that Email development is not as popular as web development and find material has been challenging to have a system to follow. Thank you for the response. I hope to hear from you. Regards, Moses Njoroge.
@drviagrin379811 ай бұрын
Why not use grid or flexbox instead of tables?
@karroteu500010 ай бұрын
@@drviagrin3798 i think its because some users use old web clients which do not have support for flexbox or grid
@zrtwisted10972 жыл бұрын
Awesome, great video!
@cityonthemoon362 жыл бұрын
I have a question: say I design an html email for a client then what? do I send them the index.html file or I send it to myself through puts mail and forward it to the client? can you explain the process for working as a freelance developer or refer me to one of your videos/courses that explains the process I loved the video ... thank you very much
@htmlemail2 жыл бұрын
You'd have to check with the client. Your best bet is to learn an ESP along with the coding, you might need to add the code to an email campaign for them, get elements needed in the design from the ESP, or simply send the HTML file.
@ranashahin82342 жыл бұрын
Thanks for the video, that’s exactly what I was looking to learn, but it’s really hard to understand all the details for beginners! What do you mean by tr and td??
@htmlemail2 жыл бұрын
Thanks for watching! I'm releasing a new course on HTML & CSS in the next week that I will add a link to in the description. I recommend basic HTML and CSS skills before learning HTML Email to know these tags for tables. (tr table row and td table data).
@weepotty2 жыл бұрын
Hi, thank you for this. I coded along and it looks perfect in chrome and seems responsive. However when I sent it to myself in gmail the white font next to the keyboard image has turned to black, and the 3 column section is now 1 column wide (which is ok) but the subtitle header text (e commerce, web design, html email) is now aligned left instead of centered. Help!
@onestepbeyondinc.3315 Жыл бұрын
This was incredibly helpful, thank you! This was my first HTML email, ever! I had a blast, but can not get the CSS to do exactly what it is supposed to, my email doe not look like the final outcome should! Any direction you can share? Thanks again.
@kritikajamwal67184 ай бұрын
Hey!! Even for me its not working as intended. Two columns aren't stacking one below another althought it looks good on live server. Were you able to find out a solution?
@hawaououbaidaАй бұрын
Thanks very much
@gulshannaz48284 ай бұрын
Best Tutorials
@pentainamerica Жыл бұрын
Thankyou so much. I learnt something new with this one.
@imranexd279 Жыл бұрын
I hate using tables when making email templates i just don't understand them well i perfer using flex box is it ok ?
@crazykindor64395 ай бұрын
Your question is my question. I would use flex, grid and media queries to make it easier. Do you know if it works?
@mreider2143Ай бұрын
@@crazykindor6439it won't work in email clients
@FZCreatives2 жыл бұрын
A Big Thanks for the tutorial. I am having little trouble the whole stuff is not coming in center and not responsive according to the size of screen i followed each step of yours please guide me thanks.
@htmlemail2 жыл бұрын
It's tough to tell what could be happening here based on this, I would double check that your code matches the tutorial.
@1Chitus Жыл бұрын
Mannnn these videos are amazing.
@carlosl-f2433 Жыл бұрын
Great tutorial...however, at 25:00 the layout does not go as expected...I get the two blocks in a row and 1 underneath...something with the spacing and padding is clashing. I checked the code, repåeated the tutorial to the same point with the very same issue. I tried Flexbox but still couldn't quite get it right.. ok so Three column section td class"three-columns" is where the issue is
@alfiehensman3799Ай бұрын
Did you manage to make it work, as I have got to this point and having the same error?
@carlosl-f2433Ай бұрын
@@alfiehensman3799 unfortunately no.
@carlosl-f2433Ай бұрын
@@alfiehensman3799 nope
@ipk79483 жыл бұрын
Great tutorial, please post more videos Sir
@thedigitalgurutech Жыл бұрын
I've completed this lesson but outlook does not show the same as live server does. Live server shows exactly what you have but outlook doesn't but blocks on the same line for the first row third and fourth row - and there are lines across each row section - how to fix this - I am sending all of the code through putsemail - not just the html portion - also - the main image and the footer leave a tiny bit of white spacing on the sides. The main issue here is the lines segregating rows and the blocks not being shown inline
@This_is_new_Bangladesh7 ай бұрын
can we use tailwind css for this?
@htmlemail5 ай бұрын
No you can't, check out this video for the difference between html email and web development: kzbin.info9DwAaA90wVQ
@miker.592610 ай бұрын
So, like, is there a place to find the final code to all of this? Basically, starting at 13:41, I'm stuck trying to get the logo and social media icons to align the way they do in the video and I'd like to be able to compare and contrast the code to figure out where I'm going wrong. unfortunately, I can't see the entirety of your code in the video.
@BobBob-du3so8 ай бұрын
Hi, I got the same problem :( did you fix it !?
@fabiopimentel69812 жыл бұрын
Thank you for this tutorial. I have a problem displaying the template on Gmail (It looks perfect on the browser using Live Server). The images don't show up and the text goes from the left all the way to the right. I don't have this problem on Apple Mail, it look perfect. I would appreciate your help!!
@htmlemail2 жыл бұрын
That is odd, if there aren't any typos I have never seen an issue in Gmail in my testing or in the support questions in the HTML email course. Was this resolved with double checking the HTML and if not, where is your Gmail? (operating system, browser)
@Gaskeunbeb7 ай бұрын
where do i get the html email template
@htmlemail5 ай бұрын
The full, tested template is including in my course as one of the bonus templates so I don't give it out on Github.
@kritikajamwal67184 ай бұрын
Hey, Thanks for the tutorial , its really helpful. I'm trying the same code for the two sections last but its not responsive at all for me. It simply aligns it vertically for all the screen-sizes. Can you help me on that?
@htmlemail4 ай бұрын
Thanks I appreciate it! Double check the CSS for the two columns section, then the three column section but start here matching your code to the video: 9:22 - Header Two Column Table HTML & CSS ...it may be the "font-size: 0;" CSS.
@summercodes77502 жыл бұрын
Great tutorial.... Wow May ALLAH bless you..
@htmlemail2 жыл бұрын
Thanks and for you also.
@bitokay1472 жыл бұрын
I will definitely be purchasing thsi course on udemy ! Great job!
@htmlemail2 жыл бұрын
Awesome, thank you!
@codewithsoni Жыл бұрын
Thank you for this amazing content.
@sabuein2 жыл бұрын
Great tutorial, thank you.
@ciyaarahadunidaoffical54742 жыл бұрын
Thank you sooo mch
@007lisaalvarez8 ай бұрын
I am working with slices that I export for web from Photoshop and when I upload the HTML to Klaviyo I'm left justified. I added in your center coding and it works but only centers the top image slice but not the entire email - Any suggestions?
@joyjamsocial Жыл бұрын
Thanks a lot!
@pucky9002 жыл бұрын
Responsively App is much better at checking viewport sizes on different devices than Google. I use it all the time
@htmlemail2 жыл бұрын
Thanks for this reference.
@josephh8117 Жыл бұрын
When does "width=X" refer to pixels and when to percentage? It seems to alternate here. Is it assumed to be percentage with tables? Thanks!
@MehndiBySoukayna2 жыл бұрын
aren't style tags stripped out by many email providers? i was under the impression inline styling on elements is best for maximum compatibility...?
@greedydabull83562 жыл бұрын
Same
@htmlemail2 жыл бұрын
We inline it at the end when sending for time saving, in my course we design it with the styling inline as well as adding Outlook support.
@codykurth96313 жыл бұрын
Awesome tutorial, it was very helpful! one question tho, i dont seem to have a "Go Live" button on my vsc. do you know how to add that?
@htmlemail3 жыл бұрын
Thanks! This is with the Live Server extension. I have a lesson on VS Code here: responsivehtmlemail.com/html-email-template-resources/
@sergiol.37552 жыл бұрын
Does your html email developer course cover everything I need to know or is there any additional courses I should get that you recommend? Thanks
@htmlemail2 жыл бұрын
Hi there, I recommend asking other students for recommendations or on the Litmus forum.
@KevinESchwartz Жыл бұрын
42:04 You mention "although are we not designing for Outlook" - can you elaborate on this? Why does this not work for Outlook?
@MrPsychosis Жыл бұрын
It's because of the way he coded it. Outlook is notorious for being annoying to code for but structuring it with a table-based structure, you'll almost be always fine. For the pesky sections, you can always use mso-conditionals and use ghost tables. If you have any questions let me know.
@siervodamian2 жыл бұрын
I follow this tutorial to create a simpler version for my own newsletter, it looks amazing on pc/laptop (using gmail) but in smartphones the fonts are super tiny at 16px so I added a @media css rule, is that safe to do or should I use another workaround? This video is 🔥 🙌. I'll get your course soon, if this is the free content I want the paid honey 😎.
@htmlemail2 жыл бұрын
Changing the font size in the media queries will work for modern email clients and most if not all late model smart phones I believe.
@susanwojcickiisalonelyrath7311 Жыл бұрын
Great video -- thanks!
@antboiunleashed2 жыл бұрын
Ugh...great tutorial. I was doing so well until 24:46. Tried copying the .three columns .column with corresponding attributes and it centers everything. Do you happen to have a link to the direct source code so I can double check the code? I'm new to coding so I don't yet have complete comprehension of the html validator. (Besides simple errors like closing tags.) Thanks!
@htmlemail2 жыл бұрын
I would double check the CSS for the class but please see the HTML Email Template article post on my website which will give similar code throughout the article for a two column approach.
@nateislate55512 жыл бұрын
I'm having the same problem did you figure it out?
@nateislate55512 жыл бұрын
I left it for a while and came back and i'm still stuck did you find a solution yet?
@nateislate55512 жыл бұрын
This is absolute fing bs doesn't work at all f this
@MyndeMemory Жыл бұрын
@@nateislate5551 For me worked, when I removed tables for padding and column, then changed content table class to column. ;)
@morestead4 ай бұрын
great video, can you show us the way to make text center center above image ?
@htmlemail4 ай бұрын
The the three column section you can simply change the order of the content so the title is above the image section. I hope this helps.
@morestead4 ай бұрын
@@htmlemail thanks for the replay, what I mean is I have an image taking full width and have specific height, inside the image I want to add text that actually be on the top of the image and be center center. using position absolute, flex, grid didn't work for me because of the client restriction. any idea how to solve that?
@aliwaliyyu2982 Жыл бұрын
which is the best platform to send your designed newsletter to your mailing list i.e mail chimp, aweber, klayvio, get response etc? how can the platforms unsubscribe button be intergrated to the custom designed email?
@nataliavergara62902 жыл бұрын
you are literally the best
@yafetbefkadu31942 жыл бұрын
Hi love your video and learning from it currently and it looks super organized and more professional than most HTML Email tutorials iv seen I like your method the best cause theirs a sense cleanness to it. What I don't get and hopefully you would be able to answer is the structure of when to add a tr and td elements I get what their supposed to do but i don't know why your adding them the place your adding them hopefully you can clear that up for me? :D thank you so much
@htmlemail2 жыл бұрын
The layering is necessary for the content to have padding and different sections/columns in email clients though we don't include statements specifically for Outlook. The class names in the tutorial and explanation for the layers (columns / padding / content) should help with understanding the layers.
@BobBob-du3so8 ай бұрын
Hi, something with the spacing and padding is clashing. I checked the code, repeated the tutorial to the same point with the very same issue, can you pls share the html code ?! many many thanks in advance!!!
@mdmozzaffor Жыл бұрын
The video is really amazing. But I have a problem that is when I use "display:inline-block " it do not work. Is there any suggestion? plz.
@barukidsmodainfantil72172 жыл бұрын
Thanks for the help.
@RiaanOliver2 жыл бұрын
Great tutorial, does this template display correctly in windows office 365 desktop?
@htmlemail2 жыл бұрын
It requires Outlook MSO conditional statements, you can learn about them in my course linked in the description or on the page of my website about them.
@JAM_88810 ай бұрын
has the udemy course been updated ? saw the email referring to that .
@htmlemail9 ай бұрын
Yes, the course has been rebuilt from scratch and released. It went from 3.5 hours to 16 hours long so there is a lot of more in-depth and advanced content.
@mohamedhussein96792 жыл бұрын
great content, thank you.
@narcos1024 Жыл бұрын
Very helpful. Thank you. :)
@SergejShishkin3 жыл бұрын
great tutuorial! thank you
@htmlemail3 жыл бұрын
Thanks for watching!
@alphabeta2515Ай бұрын
Just one thing. When I used style tags in the head to write CSS, the email that was generated was fine but once I forwarded the mail to myself, all the css was gone. I had to then make all the styles inline.
@htmlemailАй бұрын
We have little control over forwarding HTML emails but when using an ESP they sometimes have a feature where you can add a forwarding feature or link so style isn't lost or imposed on by the email client doing the forwarding.
@SkyNetCCTV Жыл бұрын
So i was struggling with the three column section not resizing as i resized my window. I started over from the beginning, as I couldn't see any missed tags, and I believe it was a simple indentation error from the beginning of the three column section that threw the rest of it off. As for where that was i'm not sure. Im brand new lol, but it works properly now.
@topshelfmusicgroup58992 жыл бұрын
Someone please lend me a hand? I followed along with both this and an extremely similar tutorial of his, but starting with the three-columns section everything is stuck centered/displaying vertically in a row without the ability to align it horizontally. Everything above it works great though, and at this point I'm sure I'm not missing any code from the tutorials so it's driving me nuts
@htmlemail2 жыл бұрын
Sounds like there might be a simple typo if you followed along all the way. If the two columns in the header are responsive then the CSS for the three column section with "display: inline-block;" and "vertical-align: top;" should make them work the same going inline then stacking for the responsiveness.
@topshelfmusicgroup58992 жыл бұрын
@@htmlemail thanks for the response! I posted it for Stack Overflow and they haven’t figured it out quite yet, besides originally misunderstanding that it was an email template and telling me there was no reason to use tables/to use divs + flexbox. But yeah I followed all the way along with both of your videos and paused throughout to take extensive notes during the first one… I’m sure it’s something small I’m missing haha. Unfortunately I have a time crunch trying to learn how to build email templates for the first time or I’d just buy your course right off the bat and start working through that to troubleshoot.
@Aerix452 жыл бұрын
I’m having the same issue here and I can’t figure out why everything is just centering on top of each other when the css for the two columns works perfectly but the three columns messes everything up. EDIT: So I did some intense troubleshooting and found that in the html portion of the three sections code there was a closing /table tag missing which was causing everything to be selected. Hope this helps!
@SkyFluffyHusky2 жыл бұрын
@@topshelfmusicgroup5899 I have the same problem.. Did you find the solution ?
@topshelfmusicgroup58992 жыл бұрын
@@SkyFluffyHusky I did not, would be really nice if someone could chime in! I did find another workaround method I can send you but I wasn’t able to fix this actual tutorial or his other tutorial. My guess is missing or somewhere or an extra or and it is taking the centering from a previous element. But I combed this and did not find anything missing/extra
@bienenlapera8 ай бұрын
Thanks a lot!
@camilamendoza40272 жыл бұрын
Really Helpful. Thanks
@letiesperon Жыл бұрын
Any reason why you’re not putting aria role presentation to all tables to make sure screen readers read the content smoothly?
@cicho5096 Жыл бұрын
great video!
@chaya.official2 жыл бұрын
It didn't work for me I followed the video exactly and couldn't line up the Modern logo with social media icons, help please
@htmlemail2 жыл бұрын
Hi there, thanks for watching! Typically it's a simple CSS error or unclosed HTML tag. So long as the code matches you will get the same result.
@ADOWMK2 жыл бұрын
@@htmlemail Hi I had the same issue, there probably has been some updates on the side of how tables are used if I'm correct? (I redid the tutorial 3times to check if I made some typos but I didn't) using a display: flex; on top of the two-columns class gives a solution, but used on mobile it just stays horizontal aligned & will not flip to vertical 'top & bottom' view. hope this helps mate.
@harleyray8977 Жыл бұрын
my logo and social media icon can not display in row, if i use this code, can you tell me what's problem
@geost77 Жыл бұрын
Just wonder... I saw top header image was set width=600px and max-width=100%. Why not just width=100%? Is that something emails not like/work and need to be set that extended way? As for normal page just width:100% should make image responsive and full width perfectly fine.
@jeankoudossou2592 жыл бұрын
thanks it was really usefull
@3ajalat2 жыл бұрын
hi, im a beginner, and ive been learning from your videos, but when i look at the code of other email developers(for learning purposes), i find them using divs, whats your comment on that ? is it enough to use tables, because i find your method much easier.
@htmlemail2 жыл бұрын
Thanks for watching! Divs only work in modern browsers and phones. For compatibility across all email clients tables are still used and recommended.
@NoelBenavente2 жыл бұрын
@@htmlemail That's what i've been wondering for years. I believe since a LOT of people still use MS Outlook (and not in the most recent version) it's more recommendable to use tables.
@AxxionMarketPlace-iu6ri11 ай бұрын
Thank you
@DevoutJourney Жыл бұрын
The stuff at the top, not the reset styling. Is that boiler plate? My emmet auto fills html 5 but not the other stuff specifically for email I think. What’s the command for that?
@itterashaiKoro3 ай бұрын
Is there available tutorial on how this template be release to user/clients who asked you to create. 💜
@htmlemail3 ай бұрын
Hi, for the multi-column layouts to render across all email clients and meet your customer expectations it would need MSO conditional statements for Windows Outlook. I teach this in my course and there is a page on my website about it. This makes the HTML email columns render properly in Outlook while still being mobile friendly.
@itterashaiKoro3 ай бұрын
@@htmlemail thank you for the information 🙇♂️ glad I found this channel 😀
@sepeira2 жыл бұрын
I'm new to Visual Studio Code and can't find how to "go live" 4:33. Is it an extension? If so, which one? Thank you.
@htmlemail2 жыл бұрын
Hi there, yes it's simply called "Live Server" and will be the most used one I believe in extensions.
@growwithdesign2 жыл бұрын
I wish to learn from you - Why did you nest table tags? OR Why did you embed a table tag within another table tag? Couldn't the result be achieved without doing so?
@htmlemail2 жыл бұрын
The layering is necessary for the content to have padding and different sections in email clients though we don't include statements specifically for Outlook.
@growwithdesign2 жыл бұрын
@@htmlemail thankyou. I learnt a lot from your video. I made my own html email.
@preciouskpalukwu37702 жыл бұрын
please where did you see those social media images ive been looking forem
@htmlemail2 жыл бұрын
Sir, they are in the img folder in the starter files download for the tutorial.
@sagihaviv56753 жыл бұрын
i wonder if this going to work across email platforms without any broken layouts?
@htmlemail3 жыл бұрын
Thanks for watching and asking. This structure will work in almost all (certainly all modern or cell phones) except for the layout to work with Outlook and some quite old clients as such you need 'html email conditional statements' so the tables adjust to device width. There is a lesson on this on the Responsive HTML Email website about this and it's included in the course. This is the same structure used as with conditional statements, but to code this design for all clients with them and inline styling instead of internal it takes maybe 2.5-3 hours.
@nationalflocation Жыл бұрын
hello, how to use imgBB and place the images to our HTML code?
@KhalidSajuOfficial2 жыл бұрын
Hi Drew Ryan. Thank you very much for your Awesome Tutorial. I'm Saju From Bangladesh. I've got your tutorials while I was searching for HTML Email Template tutorial. I need an Advice from you. That is, Is it possible to Completely Learn building HTML Email Template by watching your Free KZbin Tutorials? (Note: I know very well HTML5 & all most 80% of CSS3 with Responsive CSS. )
@htmlemail2 жыл бұрын
Thanks! You will learn the basics from my content on youtube but you can also check out my website at responsivehtmlemail.com to learn more.
@harshaldhone758 Жыл бұрын
Hello Can we send image as attachment ?
@oliverkelly21342 ай бұрын
Why do you use the table tag and not a normal div?
@htmlemail2 ай бұрын
Tables are required for proper rendering in email. Please see the short I did on my channel comparing email development to web development.
@olavictor6286 Жыл бұрын
Can we use flexbox/ gridbox instead of tables?
@marginZer0 Жыл бұрын
Nope. Not really, unless you really don’t care about MS Outlook users. If you want compatibility across all clients then tables are unfortunately the only way to do that. You have to code emails like it’s still 1999.
@olavictor6286 Жыл бұрын
@@marginZer0 Thanks I hope email template development is still hot selling.
@pilotaskar2 жыл бұрын
Thanks a lot
@KeyAndLock77 Жыл бұрын
The problem with this two column approach is that it very quickly turns from two column to 1 column. Actually it remains two column only if the email is 600+px wide. Also another problem is when column flow into single column, it does not occupy entire 100% width but only the max-width, thus making column looks pretty much empty. Not a good solution except for corner scenarios like Logo
@mayankbehl2511 Жыл бұрын
A grid or a flex box would be better in this case?
@naykoom Жыл бұрын
@@mayankbehl2511 no, flex or grid are not implemented in all email clients. A solution is to use @media query and set the width to 100%. max-width: 100% !important; width: 100% !important;
@ishmaelsunday62383 жыл бұрын
The tutorial is great. the only thing is on mobile, the three columns remain 200px in width instead of displaying block and changing with to 600px in media query. I tried that but it didn't work for me.
@htmlemail3 жыл бұрын
I'm not sure I follow your comment completely, but certain email clients won't respond to the media queries. Aside from using HTML email conditional statements like in the full course this is the optimal way to have the most clients display the responsive tables though. You could try something like this and test if you like: @media screen and (max-width: 600px) { .three-columns .column { max-width: 400px!important; } }