=== Eazy Image Slider Block ===
Contributors: playwithpixels
Donate link: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=QQMET2BDE8CJC&source=url
Tags: image slider, gutenberg block, easy, block, carousel, gallery, image, slider, simple, tk, easy
Stable tag: 1.0.0
Requires PHP: 7.4
Requires at least: 6.1
Tested up to: 6.5
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Eazy Image Slider Block adds an easy to use and configurable slider block.


== Description ==
The Eazy Image Slider Block plugin adds a simple to use and easy to configure image slider block to the Gutenberg editor based on [Tiny Slider 2](https://github.com/ganlanyuan/tiny-slider).

You can configure following options:

* Slides to show
* Slides to slide by
* Show arrows
* Show dots
* Automatic slide width
* Center the slides
* Restrict the height of the images
* Gutter between the slides
* Edge padding

= Credits =

[Tiny Slider 2](https://github.com/ganlanyuan/tiny-slider)
[Tiny Slider React](https://github.com/jechav/tiny-slider-react)


== Screenshots ==

1. The slider in the Twenty Twenty-Three Theme
2. Slider without arrows
3. Slider without dots
4. Settings in the admin editor
5. And the result on the page
6. Unrestricted height of the slides


== Installation ==

1. Install Plugin through the WordPress Admin Interface 'Plugins > Add new'
1. Activate the plugin
1. Done!

OR

1. Upload `eazy-image-slider-block` to the `/wp-content/plugins/` directory
1. Activate the plugin through the 'Plugins' menu in WordPress
1. Done!


== Frequently Asked Questions ==

= Can I change the dots color? =

Yes, currently only via CSS. The selectors for the buttons are:

`.eazy-image-slider .tns-nav button`

and for the active state:

`.eazy-image-slider .tns-nav button.tns-nav-active`

**Example** you can put in your themes `style.css`:

`
.eazy-image-slider .tns-nav button {
	background-color: #fcc;
}
.eazy-image-slider .tns-nav button.tns-nav-active {
	background-color: #e22;
}
`

= Can I change the arrows color? =

Yes, same applies as for the dots, currently only via CSS.

`.eazy-image-slider .tns-controls button:before`

and for the hover state:

`.eazy-image-slider .tns-controls button:hover:before`

**Example** you can put in your themes `style.css`:

`
.eazy-image-slider .tns-controls button:before {
	background-color: #fcc;
}
.eazy-image-slider .tns-controls button:hover:before {
	background-color: #e22;
}
`

= Can I disable the style / script loading entirely? =

Yes, to do so, simply add following lines to your themes `functions.php`:

**For the styles:**
`
function eazyimageslider_remove_style() {
	wp_dequeue_style( 'eazy-image-slider-style' );
}
add_action( 'wp_enqueue_scripts', 'eazyimageslider_remove_style', 99 );
`

**For the script:**
`
function eazyimageslider_remove_script() {
	wp_dequeue_script( 'eazy-image-slider-view-script' );
}
add_action( 'wp_enqueue_scripts', 'eazyimageslider_remove_script', 99 );
`

= What does vh mean in the restrict slides height setting? =

`VH` is a unit relative to the viewport. Which means if you set your slides height to be restricted to 50vh, the slides will have the height of 50% of the viewport.


== Changelog ==

= 1.0.0 =
* Initial Eazy Image Slider Block release. 🚀


== Upgrade Notice ==

= 1.0.0 =
* Initial Eazy Image Slider Block release. 🚀