Roll your own theme for Squelch Tabs and Accordions Shortcodes plugin

As of version 0.3.6 it is now possible to upload a custom jQuery UI Theme Roller theme to your installation of Squelch Tabs and Accordions Shortcodes. To keep your theme safe it needs to live outside of the main plugin directory, otherwise it would be overwritten every time a new version of the plugin is released. As such we have created some code that allows you to upload your custom jQuery UI theme to your wp-content/uploads folder for safe keeping.

jQuery UI 1.13.2 (stable) instructions

To roll your own jQuery UI theme you will need to follow these steps:

  • Head over to the jQuery UI theme roller.
  • Select the colours, styles, etc that you want for your new theme.
  • Click the orange “Download theme” button.
  • On the “Download Builder” screen, choose version 1.13.2 from the available options. If you choose the wrong version your theme might not work correctly.
  • Leave all “Components” ticked.
  • At the bottom of the page ensure that “Custom Theme” is selected from the “Theme” dropdown.
  • Ensure that “CSS Scope” is left empty.
  • Click the “Download” button. Your new theme will download.
  • Unzip your new theme into a directory named jquery-ui-1.13.2.custom (it should be named this by default if you chose the correct options above).
  • Upload this directory in its entirety into your wp-content/uploads directory using FTP or whatever service your hosting provider offers. Your theme should therefore end up at wp-content/uploads/jquery-ui-1.13.2.custom/
  • Ensure your permissions are correct so that the directory is readable.
  • Once the theme is in place you can navigate to the Squelch Tabs and Accordions Shortcodes admin options screen. The “Themes” dropdown will now have a new option available: “Custom jQuery theme (jQuery 1.13.2)”. Select this option to enable the new theme.

For older versions of the Squelch Tabs and Accordions Shortcodes plugins you might need/prefer to use an older version of jQuery UI’s themes, in which case please see the next sections:

jQuery UI 1.11.4 (legacy) instructions

To roll your own jQuery UI theme you will need to follow these steps:

  • Head over to the jQuery UI theme roller.
  • Select the colours, styles, etc that you want for your new theme.
  • Click the orange “Download theme” button.
  • On the “Download Builder” screen, choose version 1.11.4 from the available options. If you choose the wrong version your theme might not work correctly.
  • Leave all “Components” ticked.
  • At the bottom of the page ensure that “Custom Theme” is selected from the “Theme” dropdown.
  • Ensure that “CSS Scope” is left empty.
  • Click the “Download” button. Your new theme will download.
  • Unzip your new theme into a directory named jquery-ui-1.11.4.custom (it should be named this by default if you chose the correct options above).
  • Upload this directory in its entirety into your wp-content/uploads directory using FTP or whatever service your hosting provider offers. Your theme should therefore end up at wp-content/uploads/jquery-ui-1.11.4.custom/
  • Ensure your permissions are correct so that the directory is readable.
  • Once the theme is in place you can navigate to the Squelch Tabs and Accordions Shortcodes admin options screen. The “Themes” dropdown will now have a new option available: “Custom jQuery theme (jQuery 1.11.4)”. Select this option to enable the new theme.

For older versions of the Squelch Tabs and Accordions Shortcodes plugins you might need/prefer to use an older version of jQuery UI’s themes, in which case please see the next section:

jQuery UI 1.9.2 (legacy, deprecated) instructions

To roll your own jQuery UI theme you will need to follow these steps:

  • Head over to the jQuery UI theme roller.
  • Select the colours, styles, etc that you want for your new theme.
  • Click the orange “Download theme” button.
  • On the “Download Builder” screen, choose version 1.9.2 from the available options. If you choose the wrong version your theme will NOT work correctly.
  • Leave all “Components” ticked.
  • At the bottom of the page ensure that “Custom Theme” is selected from the “Theme” dropdown.
  • Ensure that “CSS Scope” is left empty.
  • Click the “Download” button. Your new theme will download.
  • Unzip your new theme into a directory named jquery-ui-1.9.2.custom (it should be named this by default if you chose the correct options above).
  • Upload this directory in its entirety into your wp-content/uploads directory using FTP or whatever service your hosting provider offers. Your theme should therefore end up at wp-content/uploads/jquery-ui-1.9.2.custom/
  • Ensure your permissions are correct so that the directory is readable.
  • Once the theme is in place you can navigate to the Squelch Tabs and Accordions Shortcodes admin options screen. The “Themes” dropdown will now have a new option available: “Custom jQuery theme (jQuery 1.9.2)”. Select this option to enable the new theme.

About Matt Lowe

Matt Lowe is a WordPress web designer / developer based in Newbury, Berkshire. After 8 years of doing the nine-to-five for other companies and watching them make the same mistakes over and over he set out in business on his own, forming Squelch Design to help businesses get online and make money.

Sorry, comments are currently closed, pending a redesign of the website.