I’ve a html bootstrap slider which works tremendous with captions and every part.I wish to combine it into my Wp theme (my forst one, so complete beginner).I discovered a code, which appears to helo, nevertheless it solely reveals the three photos and nothing slides…if I laborious code the slider, it really works.I perceive I can simply go away it laborious coded, however then it is not likely WP 😉 THANKS.
Right here is the code:
capabilities.php – now full file.
operate load_stylesheets()
{
wp_register_style('model', get_template_directory_uri() . '/model.css', array(), 1,'all');
wp_enqueue_style('model');
wp_register_style('bootstrap', get_template_directory_uri() . '/bootstrap-4.1.3-dist/css/bootstrap.min.css', array(), 1,'all');
wp_enqueue_style('bootstrap');
wp_register_style('fixedcss', get_template_directory_uri() . '/css/fastened.css', array(), 1,'all');
wp_enqueue_style('fixedcss');
wp_register_style('customized', get_template_directory_uri() . '/customized.css', array(), 1,'all');
wp_enqueue_style('customized');
}
add_action('wp_enqueue_scripts', 'load_stylesheets');
//load scripts
operate load_javascript()
{
wp_register_script('customized', get_template_directory_uri() . '/js/customized.js', 'jquery', 1, true);
wp_enqueue_script('customized');
wp_register_script('bootstrapjs', get_template_directory_uri() . '/bootstrap-4.1.3-dist/js/bootstrap.min.js',array('jquery'), 1 , true);
wp_enqueue_script('bootstrapjs');
}
add_action('wp_enqueue_scripts', 'load_javascript');
// regular menue theme assist
add_theme_support('menus');
// register menus, =>__ is improtant for tansaltions!
register_nav_menus
(
array('top-menu' =>__('Prime Menu', 'theme')
)
);
//woocommerce theme suport
operate customtheme_add_woocommerce_support()
{
add_theme_support( 'woocommerce' );
}
add_action( 'after_setup_theme', 'customtheme_add_woocommerce_support' );
//Photos Slider
operate themename_slider_home_images_setup($wp_customize)
{
$wp_customize->add_section('home-slider-images', array(
'title' => 'Dwelling Slider',
));
$wp_customize->add_setting('home-slider-first-image');
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'home-slider-first-image',
array(
'label' => __( 'First Picture', 'theme_name' ),
'part' => 'home-slider-images',
'settings' => 'home-slider-first-image'
)
)
);
$wp_customize->add_setting('home-slider-second-image');
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'home-slider-second-image',
array(
'label' => __( 'Second Picture', 'theme_name' ),
'part' => 'home-slider-images',
'settings' => 'home-slider-second-image'
)
)
);
$wp_customize->add_setting('home-slider-third-image');
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'home-slider-third-image',
array(
'label' => __( 'Third Picture', 'theme_name' ),
'part' => 'home-slider-images',
'settings' => 'home-slider-third-image'
)
)
);
}
add_action('customize_register', 'themename_slider_home_images_setup');`
front-page.php:
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="energetic"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="merchandise energetic">
<img src="<?php echo get_theme_mod('home-slider-first-image');?>" alt="caption3!" >
</div>
<div class="merchandise header-image"
<img src="<?php echo get_theme_mod('home-slider-second-image');?>" alt="caption2" >
</div>
<div class="merchandise header-image">
<img src="<?php echo get_theme_mod('home-slider-third-image');?>" alt="I'm a caption"
</div>
</div>