I’m trying to include the profile photo of my email recipients in SendGrid emails. I am using the following substitution tag setup in Bubble (it says profile-photo, though it’s truncated in the screenshot here):
In SendGrid, I have used the following code block:
… that the URL is coming through correctly (click here to verify). I have tried using both {{}} and {{{}}}, but it makes no difference. I have also tried to use an image block and entered the substitution tag where it says src= but that just sent a blank space where the image is meant to be.
Is anybody able to tell me what I’m doing wrong here?
There needs to be a : between the https and //. So if your user’s Profile photo only contains everything starting from //s3 and on, you’ll need to write https: before the dynamic expression.
Thanks, @john32. I forgot to mention that the reason I deleted the : was that it didn’t work with that, either. On checking ‘Show original’ in Gmail, I found that the colon resulted in //// (instead of //) appearing in the source URL.
Ahh! I’ve not worked with SendGrid in the way you’re using it, but if there’s a way you can insert additional CSS properties to your image, you’ll be able to round the edges.
You can use the border-radius property to define the radius in pixels, similar to how the width and height are currently being defined.
Do you have the ability to change the code for the inserted image?
Hi again, @john32. I can imagine that adding css would be a way forward, but I have no idea about how to do that. I do see this, but I’m not sure what I might need to add there:
On the point about defining the radius in pixels, I don’t have access to a roundness option, unlike what Bubble gives us for defining how we want images to be displayed. I tried processing with Imgix, as I saw an option there for applying a circle mask, but the email still came through with a square image.