Switch Background Color как реализовать переключение style css…

Switch Background Color – как реализовать переключение style.css в своей теме? например как в теме Renova. У меня тема для которой я разработал 2 стиля, 1 белый и соответственно контрастный – чёрный, но как сделать что бы пользователи могли сами переключать?

15 Комментарии

  1. кнопки переключения:

    Red
    Blue
    Green
    

    JQuery скрипт который прописывает в head.

    
    $(document).ready(function() {
    // red
    $("#css-red").click(function() {
    $("link[rel=stylesheet]").attr({href : "red.css"});
    });
    
    // blue
    $("#css-blue").click(function() {
    $("link[rel=stylesheet]").attr({href : "blue.css"});
    });
    
    // green
    $("#css-green").click(function() {
    $("link[rel=stylesheet]").attr({href : "green.css"});
    });
    });
    
    • спасибо за совет. я сделал так: создал файл в папке js

      switcher.js

      далее прописал код:

      $(document).ready(function() {
      // black
      $("#css-black").click(function() {
      $("link[rel=stylesheet]").attr({href : "/wp-content/themes/Kin/css/screen.css"});
      });
       
      // white
      $("#css-white").click(function() {
      $("link[rel=stylesheet]").attr({href : "/wp-content/themes/Kin/css/skins/white.css"});
      });
      });

      Вставил в header.php

      <script type="text/javascript" src="/js/switcher.js">

      далее в шаблон

      black 
      
      white 

      , но ничего не выходит, где ошибка?

  2. Подключены такие:

    <script type="text/javascript" src="/js/jquery.js">
    <script type="text/javascript" src="/js/jquery.ui.js">
    <script type="text/javascript" src="/js/fancybox/jquery.fancybox-1.3.0.js">
    <script type="text/javascript" src="/js/jquery.validate.js">
    <script type="text/javascript" src="/js/custom.js">

    но самое интересное что я прописывал и таким образом:

    $(document).ready(function() {
    // screen
    $("#css-screen").click(function() {
    $("link[rel=stylesheet]").attr({href= "/css/screen.css"});
    });
     
    // white
    $("#css-white").click(function() {
    $("link[rel=stylesheet]").attr({href= "/css/skins/white.css"});
    });
    });
    

    Тоже ничего не вышло :(

Оставить комментарий

Ваш электронный адрес не будет опубликован.


*