HubSpot Ideas

bryan_m

Changing bullet color to match font in new drag & drop email editor

I used to be able to change the bullet colors to match the color of the fonts in the email editor, but the new drag & drop editor has removed that feature. I've checked with support and was told that you can't do that. So my suggestion is if it's impossible to change the styling, at least make it so that you can add another style to your fonts (in the design tab). That way, I could have a white font with white bullets (when I used dark-colored boxes) and a black font with black bullets (when the background is lighter). Thanks!

20 Comentarios
atownsend
Miembro

This is a NEED!

KDelargy
Miembro

This is so fustrating!

MReed8
Miembro

This is definitely a need! I would also love to have the option to change what the bullet point looks like as well as spacing.

Anyone still frustrated by this, there is a workaround that isn't great but at least it works.
You can go to the design tab, go to "Text styles" and change the "Paragraph" color to the color that you'd like for your bullet points. Then you can manually go through the text in the rest of the email and change the font color back to what it was previously.

jscianna
Participante

Such a basic, needed feature!

MWatson6
Miembro

Can you provide a visual on how to do this?

lukedringoli
Miembro

+1! Very surprised that this isn't built into the drag-and-drop editor.

midnitexsonata
Miembro

Yes, please! Why doesn't hubspot listen to user feedback?

TerBak
Miembro

Hi Bryan_m,  I was looking for a solution and also didn't have any joy so I did some hunting. It is fairly straightforward to add a line to the source code. Even for users with limited coding experience it should be simple enough. Just Edit the Element containing your bullets and select the text with the Bullets.

Screen Shot 2022-10-11 at 11.05.51 AM.png

 

 I want white bullets as mine are currently black. With the text selected, at the top Style menu, click on the More Dropdown menu  and click Source Code

Screen Shot 2022-10-11 at 10.35.39 AM.png

This will take you to the html code for that element. We need to assign a hexcode Style color to the <ul>

Screen Shot 2022-10-11 at 10.47.50 AM.png

 

 This is the code I added to <ul> - it should read <ul style="color: #ffffff;">

Screen Shot 2022-10-11 at 10.56.59 AM.png

For different colors, you would change the #ffffff to the Hexcode color you want for your bullets.

Screen Shot 2022-10-11 at 10.48.12 AM.png

If you want to use the other types of bullets, your <ul> will already have style attributes assigned to it. You can just add the  colour: #ffffff; (or whatever your hexcode is)

This is the code for the empty circle bullet:

Screen Shot 2022-10-11 at 10.48.56 AM.png

This is the code for the square bullet:

Screen Shot 2022-10-11 at 10.49.14 AM.png

Click Save Changes when you are done.

 

I agree it would be nice if this was WYSIWYG and built into the Drag & Drop mail editor!

MMills1
Miembro

Agreed! This is a much needed feature.

RV6
Participante

Yes please

m_rosario
Miembro

Agreed - would love to see this feature updated.

LHill
Miembro

This should be a basic feature.  Very frustrating.

KSettlemire
Miembro

I'm very surprised that this has still not been added over the years. 

RBowse3
Miembro
  • <- Look at that text in red but bullet is in black. Please create the ablity to match the bullet to the font color. 🙂
TerBak
Miembro

@RBowse3, this is fairly straight forward (until HubSpot develops a fix).

 

1. Select the text with your bullets.

 

2. With the text selected, at the top Style menu, click on the More Dropdown menu  and click Source Code

TerBak_0-1701996963100.png

 

This will take you to the html code for that element. You need to assign a hexcode Style color to the <ul>

TerBak_1-1701996962854.png

3. Change <ul> to read <ul style="color: #FF0000;">

 

4. Click Save Changes.

 

Voila! Red bullets

RBowse3
Miembro

Screenshot 2023-12-07 at 5.23.14 PM.png

That is reallyinteresting. I do not have that in my edit menu. The </> does nothing when I click it. You want to know something funny. I tried following your instructions in this mark up window. I can actually make the change but the system will not save it. Says invalid format. It previews the change but will not let me save it. SOOOOOOOO

Still.....  

  • <- No red dot.....

     
RBowse3
Miembro

Plot thickens. I tried getting to the source code a different way. I found out that the landing page I am using might have been created from a template. 

 

Screenshot 2023-12-07 at 5.31.49 PM.png

TerBak
Miembro

Oh no, that is disappointing @RBowse3 .

 

It worked for me for the drag & drop email editor. I tried on a landing page from a theme and it seems like it works.

 

1. Under Theme Rich Text, click Edit in Expanded View

Screenshot 2023-12-07 at 8.51.37 PM.png

2. Click Advanced and then Source Code

Screenshot 2023-12-07 at 8.52.25 PM.png

Screenshot 2023-12-07 at 8.58.36 PM.png

 

3. Change <ul> to <ul style="color: #FF0000;">

 

4. Save changes.

Hope this helps! 

RBowse3
Miembro

TerBak thanks for all the suggestions. That is how I get the message about the page is based of a template and cannot get to the source. Not a big deal but thanks for all the suggestions....

 

Ryan

TerBak
Miembro

You're welcome, Ryan. Sorry the work-around wasn't in your instance.

 

Cheers