You are here

README.txt in Style Switcher 8.2

Same filename and directory in other branches
  1. 6.2 README.txt
  2. 7.2 README.txt
  3. 3.0.x README.txt
--------------------------------------------------------------------------------
                                Style Switcher 2
--------------------------------------------------------------------------------

The module allows website visitors to choose which stylesheet they would like to
view the site with.

--------------------------------------------------------------------------------
INTRODUCTION
--------------------------------------------------------------------------------

This module takes the fuss out of creating themes or building sites with
alternate stylesheets. Themer can provide a theme with alternate stylesheets.
Site builder can add alternate stylesheets found in the internet right in the
admin section. And this module presents all those styles to site visitors as a
list of links in a block. So any site visitor is able to choose the style of
the site they prefer. The module uses cookies so that when people return to the
site or visit a different page they still get their chosen style.

There are many commonly known JavaScript techniques to switch CSS stylesheets
"live", without reloading the page. Some examples of them and relevant
JavaScript files can be found here:
 * https://alistapart.com/article/alternate/
 * http://2008.kelvinluck.com/2006/05/switch-stylesheets-with-jquery.html
 * https://www.immortalwolf.com/code-repository/javascript-components/

This module uses a slightly different and more powerful mechanism. But the logic
is the same: click a link » get the new look of the site.

Works in all major browsers.

For more information about the module, visit the documentation guide:
 * https://www.drupal.org/docs/8/modules/style-switcher
To submit bug reports and feature suggestions, or to track changes:
 * https://www.drupal.org/project/issues/styleswitcher

--------------------------------------------------------------------------------
INSTALLATION
--------------------------------------------------------------------------------

Install as you would normally install a contributed Drupal module. For more
information refer:
 * https://www.drupal.org/docs/8/extending-drupal-8/installing-drupal-8-modules

--------------------------------------------------------------------------------
UPDATE
--------------------------------------------------------------------------------

If you're updating from a previous minor version don't forget to run DB updates.
For more information refer:
 * https://www.drupal.org/docs/8/update/update-modules

--------------------------------------------------------------------------------
MIGRATION
--------------------------------------------------------------------------------

It's possible to migrate this module from Drupal 7 to 8.

It's important to migrate only from the latest stable 7.x-2 version of the
module. Refer to a list of releases to find out which is the latest one:
 * https://www.drupal.org/project/styleswitcher/releases?version=7.x-2
If you're using an earlier version, you first need to update to the latest one.

It's also possible to migrate from the styleswitcher 7.x-1.x-dev directly. If it
doesn't work for you, then you first need to update to the latest stable 7.x-2
release.

Migrating from Drupal 6 is not and will not be supported, as Drupal 6 reached
the end of its life.

For further migration instructions see:
 * https://www.drupal.org/docs/8/upgrade

--------------------------------------------------------------------------------
CONFIGURATION
--------------------------------------------------------------------------------

There are 2 ways to configure the list of styles for switching. And they can be
combined.

 * One way is for site admins:

   1. Create CSS files in site's public directory, for example: in the
      sites/default/files, or anywhere in the internet. Just remember that these
      locations along with the CSS files must be publicly accessible.

   2. Go to Administration » Configuration » User interface » Style Switcher.
      There you'll find a module's configuration form and a link to add
      stylesheets for switching. Add all your styles providing their labels and
      paths.

 * Another way is mostly for themers. For site builders it is appropriate only
   if you use a custom theme that you are able to edit:

   1. In your theme's directory or subdirectory create CSS files for each
      different style.

      Note that each stylesheet when switched is being added to the existing set
      of other site's stylesheets.

   2. In your theme's .info.yml file add a section like the following, replacing
      labels and paths with yours:

        styleswitcher:
          css:
            Light Blue: css/blue.css
            All Black: css/black.css
          default: All Black

      where "All Black" is the label of the style, and css/black.css is the
      location of the stylesheet file, relative to theme's root. A line with
      Default is optional - it is for new site visitors. If it is not set then
      none of alternatives will be visible until user explicitly clicks one.

      NOTE: Do not specify in this section any of other existing CSS loaded by
      Drupal core, modules or your theme. They are being loaded unconditionally.
      If you want to set some of your theme's stylesheets for switching then
      move them from .libraries.yml file to the "styleswitcher" section of
      .info.yml.

The next steps are for both of previous ways:

 3. In the Style Switcher admin section you can see tabs for each of site's
    enabled themes. There you can reorganize how style links will be displayed
    to visitors: you can reorder them, enable/disable some of them and choose
    another default style for each theme. This means that each of your site's
    themes can have its own set of styles for switching.

    Note that styles added in admin form will be available for all themes, but
    those provided in theme's .info.yml will only be available for that theme
    and its sub-themes, but not for other themes.

 4. Finally, go to Administration » Structure » Block layout, click "Place
    block", find "Style Switcher" block, place it wherever you want and press
    "Save". You can also configure the block as you like.

    If you want the style switching functionality in multiple themes then you
    need to place the block in them too.

That's it. The block will present links for each of the configured styles to the
site visitors.

--------------------------------------------------------------------------------
AUTHORS & MAINTAINERS
--------------------------------------------------------------------------------

 * Mike Shiyan [https://www.drupal.org/u/pingwin4eg]
 * Alan Burke [https://www.drupal.org/u/alanburke]
 * Roger López [https://www.drupal.org/u/zroger]
 * Kristjan Jansen [https://www.drupal.org/u/kika]

File

README.txt
View source
  1. --------------------------------------------------------------------------------
  2. Style Switcher 2
  3. --------------------------------------------------------------------------------
  4. The module allows website visitors to choose which stylesheet they would like to
  5. view the site with.
  6. --------------------------------------------------------------------------------
  7. INTRODUCTION
  8. --------------------------------------------------------------------------------
  9. This module takes the fuss out of creating themes or building sites with
  10. alternate stylesheets. Themer can provide a theme with alternate stylesheets.
  11. Site builder can add alternate stylesheets found in the internet right in the
  12. admin section. And this module presents all those styles to site visitors as a
  13. list of links in a block. So any site visitor is able to choose the style of
  14. the site they prefer. The module uses cookies so that when people return to the
  15. site or visit a different page they still get their chosen style.
  16. There are many commonly known JavaScript techniques to switch CSS stylesheets
  17. "live", without reloading the page. Some examples of them and relevant
  18. JavaScript files can be found here:
  19. * https://alistapart.com/article/alternate/
  20. * http://2008.kelvinluck.com/2006/05/switch-stylesheets-with-jquery.html
  21. * https://www.immortalwolf.com/code-repository/javascript-components/
  22. This module uses a slightly different and more powerful mechanism. But the logic
  23. is the same: click a link » get the new look of the site.
  24. Works in all major browsers.
  25. For more information about the module, visit the documentation guide:
  26. * https://www.drupal.org/docs/8/modules/style-switcher
  27. To submit bug reports and feature suggestions, or to track changes:
  28. * https://www.drupal.org/project/issues/styleswitcher
  29. --------------------------------------------------------------------------------
  30. INSTALLATION
  31. --------------------------------------------------------------------------------
  32. Install as you would normally install a contributed Drupal module. For more
  33. information refer:
  34. * https://www.drupal.org/docs/8/extending-drupal-8/installing-drupal-8-modules
  35. --------------------------------------------------------------------------------
  36. UPDATE
  37. --------------------------------------------------------------------------------
  38. If you're updating from a previous minor version don't forget to run DB updates.
  39. For more information refer:
  40. * https://www.drupal.org/docs/8/update/update-modules
  41. --------------------------------------------------------------------------------
  42. MIGRATION
  43. --------------------------------------------------------------------------------
  44. It's possible to migrate this module from Drupal 7 to 8.
  45. It's important to migrate only from the latest stable 7.x-2 version of the
  46. module. Refer to a list of releases to find out which is the latest one:
  47. * https://www.drupal.org/project/styleswitcher/releases?version=7.x-2
  48. If you're using an earlier version, you first need to update to the latest one.
  49. It's also possible to migrate from the styleswitcher 7.x-1.x-dev directly. If it
  50. doesn't work for you, then you first need to update to the latest stable 7.x-2
  51. release.
  52. Migrating from Drupal 6 is not and will not be supported, as Drupal 6 reached
  53. the end of its life.
  54. For further migration instructions see:
  55. * https://www.drupal.org/docs/8/upgrade
  56. --------------------------------------------------------------------------------
  57. CONFIGURATION
  58. --------------------------------------------------------------------------------
  59. There are 2 ways to configure the list of styles for switching. And they can be
  60. combined.
  61. * One way is for site admins:
  62. 1. Create CSS files in site's public directory, for example: in the
  63. sites/default/files, or anywhere in the internet. Just remember that these
  64. locations along with the CSS files must be publicly accessible.
  65. 2. Go to Administration » Configuration » User interface » Style Switcher.
  66. There you'll find a module's configuration form and a link to add
  67. stylesheets for switching. Add all your styles providing their labels and
  68. paths.
  69. * Another way is mostly for themers. For site builders it is appropriate only
  70. if you use a custom theme that you are able to edit:
  71. 1. In your theme's directory or subdirectory create CSS files for each
  72. different style.
  73. Note that each stylesheet when switched is being added to the existing set
  74. of other site's stylesheets.
  75. 2. In your theme's .info.yml file add a section like the following, replacing
  76. labels and paths with yours:
  77. styleswitcher:
  78. css:
  79. Light Blue: css/blue.css
  80. All Black: css/black.css
  81. default: All Black
  82. where "All Black" is the label of the style, and css/black.css is the
  83. location of the stylesheet file, relative to theme's root. A line with
  84. Default is optional - it is for new site visitors. If it is not set then
  85. none of alternatives will be visible until user explicitly clicks one.
  86. NOTE: Do not specify in this section any of other existing CSS loaded by
  87. Drupal core, modules or your theme. They are being loaded unconditionally.
  88. If you want to set some of your theme's stylesheets for switching then
  89. move them from .libraries.yml file to the "styleswitcher" section of
  90. .info.yml.
  91. The next steps are for both of previous ways:
  92. 3. In the Style Switcher admin section you can see tabs for each of site's
  93. enabled themes. There you can reorganize how style links will be displayed
  94. to visitors: you can reorder them, enable/disable some of them and choose
  95. another default style for each theme. This means that each of your site's
  96. themes can have its own set of styles for switching.
  97. Note that styles added in admin form will be available for all themes, but
  98. those provided in theme's .info.yml will only be available for that theme
  99. and its sub-themes, but not for other themes.
  100. 4. Finally, go to Administration » Structure » Block layout, click "Place
  101. block", find "Style Switcher" block, place it wherever you want and press
  102. "Save". You can also configure the block as you like.
  103. If you want the style switching functionality in multiple themes then you
  104. need to place the block in them too.
  105. That's it. The block will present links for each of the configured styles to the
  106. site visitors.
  107. --------------------------------------------------------------------------------
  108. AUTHORS & MAINTAINERS
  109. --------------------------------------------------------------------------------
  110. * Mike Shiyan [https://www.drupal.org/u/pingwin4eg]
  111. * Alan Burke [https://www.drupal.org/u/alanburke]
  112. * Roger López [https://www.drupal.org/u/zroger]
  113. * Kristjan Jansen [https://www.drupal.org/u/kika]