Rich-text Reply

Changing Multiple Buttons with 1 Edit

akkocha 07-12-16

Changing Multiple Buttons with 1 Edit

[ Edited ]

Hi Everyone,

 

We work with a number of car dealer sites and they have a huge number of cars in inventory. I'm trying to edit something on all vehicles in stock - a call to action button. Please see the image attached - we're trying to edit the same button in one step for about 300 cars. Is there a way to do this?

 

 

Screen Shot 2016-07-12 at 3.28.33 PM.png
Level 2

JasonDahlin 07-13-16
 

Re: Changing Multiple Buttons with 1 Edit

Hi @akkocha,

Each of these buttons is likely identical to one another from a code perspective and can be referenced using a jQuery selector that looks for a "class" that exists on each of them, something like this:

 

$('.ePrice')

Depending on what you are trying to do and the structure of your HTML, you can do a variety of things to them...

 

Perhaps you want to change the background color to a burnt orange?  Inserting some CSS might work

/* _optimizely_evaluate=force */
$('head').prepend('<style>.ePrice { background:#BD5703 !important; }</style>');
/* _optimizely_evaluate=safe */

You may want to talk with your developers/web master to determine the best way to target each of those buttons so that you don't affect other buttons accidentally.

--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
robertchan 07-13-16
 

Re: Changing Multiple Buttons with 1 Edit

I'm assuming you're one of the Audi car dealerships as a number seem to have similar sites. I randomly selected http://www.cherryhillaudi.com/all-inventory/ and can give you a run through in JavaScript of what your solution might look like:

 

/*
You can copy and paste this code into console to see it work: http://www.cherryhillaudi.com/all-inventory/
*/

//Stores all the buttons into a variable
var btns = document.getElementsByClassName('ddc-btn-primary');

//Runs a loop that sets the color of each button to red
for(var i=0; i<btns.length; i++){
  btns[i].style.backgroundColor = 'red';
}

You can copy and paste that code into the console of http://www.cherryhillaudi.com/all-inventory/. To reach console, open Google Chrome and paste http://www.cherryhillaudi.com/all-inventory/ into your browser to go to the site. Once you're on the site, if you're on a Mac, hit the command button, option, and i buttons at the same time (on a PC, hit F12, control, shift, and i buttons at the same time). You will see the console pop open with some tabs (Elements, Console, Sources, Network, Timeline, Profiles, Resources, etc.). Click on the Console tab then copy and paste the code I provided. You should now see all the buttons change color. If you are satisfied with the change, you can copy and paste the code into a variation for your experiment though you must make sure the class I used in this example, ddc-btn-primary, exists for your site. It looks like the Audi dealership sites I've seen all use the same classes so the code should work on your site as well unless you've customized the classes.

Robert Chan

Experimentation Hero
akkocha 07-14-16
 

Re: Changing Multiple Buttons with 1 Edit

Thanks Robert, we'll test it out!

Level 2
akkocha 07-14-16
 

Re: Changing Multiple Buttons with 1 Edit

Much appreciated, Jason. I think I'll pass this one on to our developers!
Level 2