12 posts
  • Has been part of the Envato Community for over 5 years
  • Has collected 100+ items on Envato Market
  • Located in United States
enpstudios says

How can I implement a Style Changer like Avada does? http://theme-fusion.com/avada/

I would like to be able to change my themes colors like Avada has.

Thank you. Eric

1034 posts
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
  • Sells items exclusively on Envato Market
+2 more
BenSheppard says

jQuery probably, on click change classes or change classes color

324 posts
  • Has been part of the Envato Community for over 3 years
  • Has sold $10,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 10+ items on Envato Market
+2 more
NikolaSusa says

Write a simple script that will change the name(or include new css file) of the css file.

12 posts
  • Has been part of the Envato Community for over 5 years
  • Has collected 100+ items on Envato Market
  • Located in United States
enpstudios says

I have successfully captured the jQuery click and it sets the name of a variable called name, then I have this:

if(name 'lightblue') { alert('lightblue'); <?php wp_enqueue_style('lightblue', get_template_directory_uri() . '/css/skins/lightblue.css', 'style'); ?> }

If I use just this the alert works fine:

if(name ‘lightblue’) { alert(‘lightblue’); }

When I use this it ignores the if statement and enqueue’s the css:

if(name == ‘lightblue’) { alert(‘lightblue’); <?php wp_enqueue_style(‘lightblue’, get_template_directory_uri() . ’/css/skins/lightblue.css’, ‘style’); ?> }

1034 posts
  • Has sold $100+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
  • Sells items exclusively on Envato Market
+2 more
BenSheppard says

I’d suggest just doing

$(”#something”).click(function(){
$(”.button”).css({background: ”#333333”, color: ”#ffffff”})
}

493 posts
  • Has referred 10+ members
  • Has sold $40,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Sells items exclusively on Envato Market
+1 more
wopethemes says

Session or $_GET is solution to work. change color by post , save setting , jquery change css can’t work for many visitors and other same options pages

136 posts
  • Has referred 50+ members
  • Has sold $40,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
+2 more
ThemeShaper says

Here’s a site with links to a bunch of style changers: http://www.jquery4u.com/page-layout/10-simple-easy-jquery-style-switchers/

Had a little look through them, they work in roughly the same way I think.

I have one on my earlier theme here (dunno if i can give the name, so I won’t ;)) – you can find it from my profile tho.. feel free to view the source and use the code on that. The js is inside the js/script.js file, at the bottom. Uses pretty much the same method as most of the scripts, stores the path of the file to a cookie, and on page load it checks the cookie and rewrites the style string.

<link rel='stylesheet' id='overridecolor-css' href='http://luxuos.meshaper.com/wp-content/themes/luxuos1.7.3/css/default.css?ver=screen' type='text/css' media='all' />

Gives the stylesheet an id

jQuery("#overridecolor-css").attr("href",jQuery.cookie("cssback"));

Overwrites the href with the value of a cookie.

This is over a year old now tho, so there might be a neater way to do it now ;)

12 posts
  • Has been part of the Envato Community for over 5 years
  • Has collected 100+ items on Envato Market
  • Located in United States
enpstudios says

Thanks for your posts guys, I really appreciate the help!! I got it to work somewhat with:

JQuery: if(name == ‘pink’) { window.open(“http://www.mydomain.com/themes/themename/stretched/index.php?color=darkblue”, “_self”); }

PHP: $color_scheme = $_GET[“color”];

if($color_scheme == ‘pink’) { wp_enqueue_style(‘pink’, get_template_directory_uri() . ’/css/skins/pink.css’, ‘style’); }

It captures a click on any color and changes the color of my theme, but when you click to go to a new page it reverts back to the default color. I see that karma keeps it’s color: http://themes.truethemes.net/Karma/

How can I do that?

Thank you again!! :)

12 posts
  • Has been part of the Envato Community for over 5 years
  • Has collected 100+ items on Envato Market
  • Located in United States
enpstudios says

Can I set a cookie in the my header.php file like this?

setcookie(‘color’, $color_scheme, time()+(606024*7));

493 posts
  • Has referred 10+ members
  • Has sold $40,000+ on Envato Market
  • Has collected 50+ items on Envato Market
  • Sells items exclusively on Envato Market
+1 more
wopethemes says

cookie will save the date into visitor browser. The best way is just save the session. then check and load file , create new color css file (for unlimited color) and it still keep when moving around the sites.

by
by
by
by
by
by