Individual Accent Colors

[lpanalyst]

I would like to customize the colors of the ‘gear’ logos below my slider (i.e. want each logo to be a different color). What is the easiest way to do this? They currently all change when I change the accent color.

Site URL (in development): http://www.lpanalyst.com/sitev2
Wordpress Version: 3.9 (most recent)
Dante Version: 2.53 (most recent)

[lpanalyst]

This reply has been marked as private.

[Kyle – SUPPORT]

Hi

You can use the alternate icon colors (set in color customiser)

You can chose which one you want to use in the icon box asset

– Kyle

[lpanalyst]

Hi Kyle,

Sorry, I don’t think I was clear. I need each gear on that front page to be a different color. Is it possible to do this (one green, one blue, one orange, etc…)

Thanks,
Bill

[Kyle – SUPPORT]

Unfortunately not, you can have 4 different icon colors, which you set in the color customiser (see screenshot)

If you want different colors for each icon you will have to make an extra class for each icon box, for e.g. ‘icon-green’ then in your css add

.icon-green .sf-icon-cont {
  background-color: #37ba85;
}

– Kyle

[lpanalyst]

Hi Kyle,

Sorry for this rookie question. I almost understand what you are saying.

I added to Custom CSS in Theme Options:
.icon-blue .sf-icon-cont {
background-color: #37ba85;
}

.icon-green .sf-icon-cont {
background-color: #37ba85;
}

.icon-orange.sf-icon-cont {
background-color: #ff7534;
}

.icon-purple .sf-icon-cont {
background-color: #7c4d9f;
}

.icon-red .sf-icon-cont {
background-color: #fe504f;
}

.icon-yellow .sf-icon-cont {
background-color: #ffd56c;
}

Then, the code I need to change on my home page currently reads as:

[sf_iconbox image=”fa-gears” cont=”icon-green” character=”” type=”left-icon-alt” title=”LP Solutions”]

Could you help me fill in the blanks here?

Thanks!

[Kyle – SUPPORT]

It would be easier to use the new icon box pagebuilder asset rather than the shortcode, it means you can edit it easily using the popup settings.

You need to add the class to the extra class field at the bottom

– Kyle

[lpanalyst]

sorry, again, novice question. i think i can just use the 4 colors in the color customizer but not sure what change i have to make to the code below to get it to change from the current color to Icon One Color and Icon One Alt Color. my code is as follows:

[sf_iconbox image=”fa-gear” character=”” type=”left-icon-alt” title=”Valuation”]

[Kyle – SUPPORT]

Hi

You will need to recreate the shortcode and then you can easily select your options

– Kyle