functions.php
if (class_exists( 'Attachments' ) ) {
require_once "lib/attachments.php";
}
function alpha_assets(){
wp_enqueue_style("tns-style", "//cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.3/tiny-slider.css");
wp_enqueue_script( "tns-js", "//cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.9.2/min/tiny-slider.js", null, "0.0.1", true);
wp_enqueue_script( "alpha-main", get_theme_file_uri("/assets/js/main.js"),array("jquery", "featherlight-js"), VERSION, true ); // Min wordpress version need 4.7
}
add_action("wp_enqueue_scripts", "alpha_assets");
lib/attachments.php
<?php
define( 'ATTACHMENTS_SETTINGS_SCREEN', false ); // disable the Settings screen
add_filter( 'attachments_default_instance', '__return_false' ); // disable the default instance
function alpha_attachments($attachments){
$fields = array(
array(
'name' => 'title',
'type' => 'text',
'label' => __( 'Title', 'alpha' ),
),
);
$args = array(
'label' => 'My Attachments',
'post_type' => array( 'post'),
'filetype' => array("image"),
'note' => 'Attach files here!',
'button_text' => __( 'Attach Files', 'alpha' ),
'fields' => $fields,
);
$attachments->register('slider', $args);
}
add_action( 'attachments_register', 'alpha_attachments' );
main.js
(function($){
$(document).ready(function(){
var slider = tns({
container: '.slider',
speed: 300,
items: 1,
autoplay: true,
autoHeight: true,
controls: false,
nav: false,
autoplayButtonOutput: false
});
});
})(jQuery);
I am using slider for my single post:
<?php if (class_exists( 'Attachments' ) ): ?>
<div class="col-md-12">
<div class="slider">
<?php
$attachments = new Attachments('slider');
if ($attachments->exist()) {
while ($attachment = $attachments->get()) {
?>
<div>
<?php echo $attachments->image('large'); ?>
</div>
<?php
}
}
?>
</div>
</div>
<?php endif ?>