/PHP/Slick slider and ACF Pro in WordPress

Slick slider and ACF Pro in WordPress

/**  
 * Plugin your ACF here
*/
<?php 

if( have_rows('slick_slider') ):
echo'<div class="slider-nav">';
 	// loop through the rows of data
    while ( have_rows('slick_slider') ) : the_row();
    // display a sub field value
    //vars
    $icon = get_sub_field('icon'); 
    ?>
    <div class="icon-wrapper" data-tooltip="<?php if ( $icon_title = get_sub_field( 'icon_title' ) ) : ?><?php echo esc_html( $icon_title ); ?><?php endif; ?>">
	    <img class="icon-image" src="<?php echo esc_url( $icon['url'] ); ?>" alt="<?php echo esc_attr( $icon['alt'] ); ?>" />
    </div>
    <?php      
    endwhile;
echo '</div>';

else :

    // no rows found

endif;

Source: wpbeaches.com

Slick slider and ACF Pro in WordPress

function child_enqueue_styles() {
	// Slick slider files enqueue
	wp_enqueue_script( 'slickjs', get_stylesheet_directory_uri() . '/assets/js/slick.min.js', array( 'jquery' ), '1.8.1', true );
	wp_enqueue_script( 'slickjs-init', get_stylesheet_directory_uri(). '/assets/js/slick-init.js', array( 'slickjs' ), '1.8.1', true );
	wp_enqueue_style( 'slickcss', get_stylesheet_directory_uri() . '/assets/css/slick.css', '1.8.1', 'all');
	wp_enqueue_style( 'slickcsstheme', get_stylesheet_directory_uri(). '/assets/css/slick-theme.css', '1.8.1', 'all');
}
add_action( 'wp_enqueue_scripts', 'child_enqueue_styles', 15 );

Source: wpbeaches.com

Slick slider and ACF Pro in WordPress

/* Slick slider */
.slick-track > div {
    margin-right: -20px !important;
}
.slick-prev, .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: teal !important;
    border: none;
    outline: none;
    background: transparent !important;
}
.slick-prev:hover, .slick-next:hover {
    color: teal !important;
}
.slick-prev:before, .slick-next:before {
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;
    opacity: .95 !important;
    color: teal !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

Source: wpbeaches.com

Similar codes

2 votes202 views3 answers
Ajax post json data handle in php
PHP
0 vote196 views1 answer
Redirect with compact laravel
PHP Laravel
0 vote226 views1 answer
White labeling wordpress divi
PHP Wordpress
24 votes218 views5 answers
Laravel seed specific file
PHP Laravel
5 votes187 views2 answers
Route() and with() in laravel
PHP
1 vote195 views2 answers
Php echo number with decimal
PHP
1 vote260 views1 answer
Undefined type auth
PHP
0 vote218 views1 answer
Builder Pattern Method Chaining 2
PHP
1 vote204 views1 answer
Php pdo get database name
PHP
0 vote209 views4 answers
Python to php
PHP