Skip to content
This repository has been archived by the owner on Jan 9, 2023. It is now read-only.

Latest commit

 

History

History
57 lines (32 loc) · 1.94 KB

readme.md

File metadata and controls

57 lines (32 loc) · 1.94 KB
Raw

jQuery UI Datepicker Skins for WordPress

A collection of jQuery UI datepicker skins to match the admin color schemes available in WordPress.

To preview the skins, visit http://xwp.github.io/wp-jquery-ui-datepicker-skins/.

This project includes CSS/LESS/Sass for the following prepackaged WordPress admin color schemes:

  • Default
  • Light
  • Blue
  • Coffee
  • Ectoplasm
  • Midnight
  • Ocean
  • Sunrise

Comparison Image

##Usage

###Initial Setup

Be sure to enqueue WordPress' prepackaged jQuery UI CSS file using wp_enqueue_style( 'jquery-ui' ) and the related javascript files using wp_enqueue_script( 'jquery' ) and wp_enqueue_script( 'jquery-ui-datepicker' ).

Help with configuring jQuery UI's Datepicker can be found at http://jqueryui.com/datepicker/.

###Using the CSS file

To include the WP jQuery Datepicker stylesheet, simply copy the CSS file located at css/datepicker.css to your project and enqueue it using the admin_enqueue_scripts WordPress action hook.

###Generating Custom LESS Styles

  1. Copy and rename one of the .less files in less/schemes/ (e.g., blue.less).

  2. Fill in the variables at the top of the file with your desired class name and colors.

  3. In less/datepicker.less @import your newly-created .less scheme file.

  4. Compile your LESS and enqueue your new CSS file.

###Generating Custom Sass Styles

  1. Copy and rename one of the .scss files in sass/schemes/ (e.g., blue.scss).

  2. Fill in the variables at the top of the file with your desired class name and colors.

  3. In sass/datepicker.scss @import your newly-created .scss scheme file.

  4. Compile your Sass and enqueue your new CSS file.

##Credits

Developed for the WordPress Community by the Superheroes at XWP.