CMS Development

mbrackett
Contributor

Gmail app challenges on design of my weekly email

SOLVE

I have 5 images in a rich text block aligned right with title type text aligned left alongside in my weekly email newsletter (design by a previous employee but I am no designer so I just go with it). Looks great on horizontal formats but then there's mobile. In Safari on gmail itself, these images resize and get much smaller though the text not as much. But on the Gmail app, neither resizes. This results in longer titles breaking and sometimes leaving large white spaces due to word length because of the 10px padding to the left of my images. I would love for the images to scale down just a bit to allow more room for the titles but ONLY on the Gmail app. Anyone had any experience with this? I am a novice but learning a bit of html now. So an html person might be the best option to advise here.

0 Upvotes
1 Accepted solution
dennisedson
Solution
HubSpot Product Team
HubSpot Product Team

Gmail app challenges on design of my weekly email

SOLVE

@mbrackett, could you provide the code for the template?

View solution in original post

0 Upvotes
7 Replies 7
dennisedson
Solution
HubSpot Product Team
HubSpot Product Team

Gmail app challenges on design of my weekly email

SOLVE

@mbrackett, could you provide the code for the template?

0 Upvotes
mbrackett
Contributor

Gmail app challenges on design of my weekly email

SOLVE

Well I hit the wrong button, but Dennis we found the answer! Instead of using 120px for the images, we inserted a percentage and it works beautifully...at least for now! Thanks for your response!

0 Upvotes
mbrackett
Contributor

Gmail app challenges on design of my weekly email

SOLVE

Sorry just learning how to use the forum and thought images might help. The first two are on the Gmail app...you can see the large images (virtually as large as on the desktop) and the white spaces. The second two are the way it looks when you go through Safari. I'm afraid to simply reduce the image size as these images would then be SUPER small.Screen Shot 2018-09-14 at 9.09.21 PM.pngScreen Shot 2018-09-14 at 9.09.34 PM.pngScreen Shot 2018-09-14 at 9.09.47 PM.pngScreen Shot 2018-09-14 at 9.09.58 PM.png

0 Upvotes
jennysowyrda
Community Manager
Community Manager

Gmail app challenges on design of my weekly email

SOLVE

Hi @mbrackett,

 

Do you have any links to preview images for the weekly email so that we can take a look? Please make sure the link isn't within your portal, but is a public preview link so we can look.

 

Thanks,
Jenny

0 Upvotes
mbrackett
Contributor

Gmail app challenges on design of my weekly email

SOLVE

Hey Jenny! We actually finally worked this out...to my great excitement! The style of the images was set to 120px but we changed it to a percentage so it scales with the frame of the device used to view the email. I just sent myself a test on my new email to fly on Tuesday and it looks awesome! Thanks for your willingness to help! If you can tell me how to do the kind of preview link you needed so I have that for future use, that would be great. I had hoped screenshots would be enough but if the link provides interaction where you can move through the whole email, that WOULD be so much better!

jennysowyrda
Community Manager
Community Manager

Gmail app challenges on design of my weekly email

SOLVE

Hi @mbrackett,

 

Such great news! Thanks for coming back with the update.

 

For future reference if you are in the email editor, you can get the preview link by going from the edit screen to preview>get sharable link (that will copy it to your clipboard so that you can paste it and share it). 

 

1. click preview in top right1. click preview in top right2. click 'get shareable link' to copy the preview link2. click 'get shareable link' to copy the preview link

 

Thanks,
Jenny

0 Upvotes
mbrackett
Contributor

Gmail app challenges on design of my weekly email

SOLVE

Awesome! Thanks jenny! I will keep that on file for the next question I have...I know I'll have one!