Support » Theme: Bizlight » How should I change carousel indicator dots t a thumbnails image?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hello iacino,

    To replace the carousal indicator (white dot) below your testimonials section with fa-quote class you need to add a custom class to the existing carousal indicator class.

    To do so you need to find and copy function bizlight_home_testimonial() function fromthemes > bizlight > inc > hooks > homepage-testimonial.phpto your child theme’s functions.php

    In your copied function find <ol class="carousel-indicators"> and replace it with <ol class="fa fa-quote-left cust-quote"> (for font awesome quote left icon ).

    Finally, paste in the following custom css for icon alignment :

    ol.fa.fa-quote-left.cust-quote{
    position: absolute;
        bottom: -58px;
        left: 50%;
        z-index: 15;
        width: 60%;
        padding-left: 0;
        margin-left: -30%;
        text-align: center;
        list-style: none;
    }

    Hope this helps you,

    If you want more dedicated and swift support on the theme, please visit the theme’s official support forum where the theme’s official support team are stand by to answer each and every one of your questions.
    http://themepalace.com/forum/bizlight/

    Best Regards.

    Thread Starter iacino

    (@iacino)

    I copied the function, pasted and changed it in my child functions but get the following error: invalid argument supplied for foreach() in /home/mouseove/public_html/wp-content/themes/bizlight-child/functions.php on line 160, that you can see on website: http://www.mouseoverdesigns.com. I haven’t added the css yet. Here is a copy and paste of my child functions page. I have added it towards the bottom. It may be syntax error but I don’t know php.

    <?php
    function theme_enqueue_styles() {
    
        $parent_style = 'parent-style';
    
        wp_enqueue_style($parent_style, get_template_directory_uri() . '/style.css');
        wp_enqueue_style('child-style', get_stylesheet_directory_uri() . '/style.css', array(
            $parent_style
        ));
    }
    add_action('wp_enqueue_scripts', 'theme_enqueue_styles');
    
    /*FREE QUOTE BUTTON*/
    add_filter('gettext', 'translate_text');
    add_filter('ngettext', 'translate_text');
    
    function translate_text($translated) {
    $translated = str_ireplace('Click to start', 'Free Quote', $translated);
    return $translated;
    }
    
    /*SERVICES SECTION*/
    function bizlight_home_service_array( ){
    
    $bizlight_home_service_contents_array = array();
    
    $bizlight_home_service_contents_array[0]['bizlight-home-service-title'] = __('LOVELY DESIGN', 'bizlight');
    $bizlight_home_service_contents_array[0]['bizlight-home-service-content'] = __("The set doesn't moved. Deep don't fru it fowl gathering heaven days moving creeping under from i air. Set it fifth Meat was darkness. every bring in it.", 'bizlight');
    $bizlight_home_service_contents_array[0]['bizlight-home-service-link'] = '#';
    $bizlight_home_service_contents_array[0]['bizlight-home-service-icon'] = 'fa-desktop';
    
    $bizlight_home_service_contents_array[1]['bizlight-home-service-title'] = __('STYLIES PHOTOGRAPY', 'bizlight');
    $bizlight_home_service_contents_array[1]['bizlight-home-service-content'] = __("The set doesn't moved. Deep don't fru it fowl gathering heaven days moving creeping under from i air. Set it fifth Meat was darkness. every bring in it.", 'bizlight');
    $bizlight_home_service_contents_array[1]['bizlight-home-service-link'] = '#';
    $bizlight_home_service_contents_array[1]['bizlight-home-service-icon'] = 'fa-camera-retro';
    
    $bizlight_home_service_contents_array[2]['bizlight-home-service-title'] = __('CREATIVE AGENCY', 'bizlight');
    $bizlight_home_service_contents_array[2]['bizlight-home-service-content'] = __("The set doesn't moved. Deep don't fru it fowl gathering heaven days moving creeping under from i air. Set it fifth Meat was darkness. every bring in it.", 'bizlight');
    $bizlight_home_service_contents_array[2]['bizlight-home-service-link'] = '#';
    $bizlight_home_service_contents_array[2]['bizlight-home-service-icon'] = 'fa-rocket';
    
    $bizlight_icons_arrays = array();
    $bizlight_home_service_args = array();
    
    $repeated = array('bizlight-home-service-page-icon','bizlight-home-service-pages-ids');
    
    $bizlight_home_service_posts = bizlight_get_repeated_all_value(3, $repeated);
    $bizlight_home_service_posts_ids = array();
    if( null != $bizlight_home_service_posts ) {
    foreach( $bizlight_home_service_posts as $bizlight_home_service_post ) {
    if( isset($bizlight_home_service_post['bizlight-home-service-pages-ids']) && 0 != $bizlight_home_service_post['bizlight-home-service-pages-ids'] ){
    $bizlight_home_service_posts_ids[] = $bizlight_home_service_post['bizlight-home-service-pages-ids'];
    if( isset( $bizlight_home_service_post['bizlight-home-service-page-icon'] )){
    $bizlight_home_service_page_icon = $bizlight_home_service_post['bizlight-home-service-page-icon'];
    }
    else{
    $bizlight_home_service_page_icon =' fa-desktop';
    }
    $bizlight_icons_arrays[] = $bizlight_home_service_page_icon;
    }
    }
    if( !empty( $bizlight_home_service_posts_ids )){
    $bizlight_home_service_args = array(
    'post_type' => 'page',
    'post__in' => $bizlight_home_service_posts_ids,
    'posts_per_page' => 3,
    'orderby' => 'post__in'
    );
    }
    }
    // the query
    if( !empty( $bizlight_home_service_args )){
    $bizlight_home_service_contents_array = array(); /*again empty array*/
    $bizlight_home_service_post_query = new WP_Query( $bizlight_home_service_args );
    if ( $bizlight_home_service_post_query->have_posts() ) :
    $i = 0;
    while ( $bizlight_home_service_post_query->have_posts() ) : $bizlight_home_service_post_query->the_post();
    $bizlight_home_service_contents_array[$i]['bizlight-home-service-title'] = get_the_title();
    $bizlight_home_service_contents_array[$i]['bizlight-home-service-content'] = bizlight_words_count( 75 ,get_the_content());
    $bizlight_home_service_contents_array[$i]['bizlight-home-service-link'] = get_permalink();
    if(isset( $bizlight_icons_arrays[$i] )){
    
    $bizlight_home_service_contents_array[$i]['bizlight-home-service-icon'] = $bizlight_icons_arrays[$i];
    }
    else{
    $bizlight_home_service_contents_array[$i]['bizlight-home-service-icon'] = 'fa-desktop';
    }
    $i++;
    endwhile;
    wp_reset_postdata();
    endif;
    }
    return $bizlight_home_service_contents_array;
    }
    
    function bizlight_home_service() {
            global $bizlight_customizer_all_values;
            if( 1 != $bizlight_customizer_all_values['bizlight-home-service-enable'] ){
                return null;
            }
            $bizlight_service_arrays = bizlight_home_service_array(  );
            if( is_array( $bizlight_service_arrays )){
                $bizlight_home_service_title = $bizlight_customizer_all_values['bizlight-home-service-title'];
                ?>
                <section class="evision-wrapper block-section wrap-service">
                    <div class="container">
                <?php if(!empty( $bizlight_home_service_title ) ){
                    ?>
                    <h2 class="evision-animate slideInDown"><?php echo esc_html( $bizlight_home_service_title );?></h2>
                    <span class="title-divider"></span>
                    <?php
                }?>
                        <div class="row block-row overhidden">
                            <?php
                            $i = 1;
                            $data_delay = 0;
                            foreach( $bizlight_service_arrays as $bizlight_service_array ){
                                if( 3 < $i){
                                    break;
                                }
                                $data_wow_delay = 'data-wow-delay='.$data_delay.'s';
                                ?>
                                <div class="col-md-4 box-container evision-animate fadeInUp" <?php echo esc_attr( $data_wow_delay );?>>
                                    <div class="box-inner">
                                                                              <div class="icon-container">
                                                <span><i class="fa <?php echo esc_attr( $bizlight_service_array['bizlight-home-service-icon'] ); ?>"></i></span>
                                            </div>
                                            <div class="box-content">
                                                <h3><?php echo esc_html( $bizlight_service_array['bizlight-home-service-title'] );?></h3>
                                                <div class="box-content-text">
                                                    <p>
                                                        <?php echo wp_kses_post( $bizlight_service_array['bizlight-home-service-content'] );?>
                                                    </p>
                                                </div>
                                            </div>
    
                                    </div>
                                </div>
                                <?php
                                $i++;
                            }
                            ?>
                        </div>
                    </div>
                </section><!-- service section -->
                <?php
            }
            ?>
    
    /*TESTIMONIAL SECTION*/
    <!-- Indicators -->
                                    <ol class="fa fa-quote-left cust-quote">
                                        <?php
                                        $i = 0;
                                        foreach( $bizlight_testimonial_arrays as $bizlight_testimonial_array ){
                                            if (3 < $i) {
                                                break;
                                            }
                                            ?>
                                            <li data-target="#carousel-testimonial" data-slide-to="<?php echo absint($i);?>" class="<?php echo $i == 0 ? 'active' : '';?>">
                                            <?php
                                            $i++;
                                        }
                                        ?>
    
    <?php
    }

    [Moderator Note: Please post code & markup between backticks or use the code button. Your posted code may now have been damaged by the forum’s parser.]

    Hello iacino,

    Please copy the whole function that i have instructed to the child theme’s functions.php. Upon inspection of your code, it is seen that you have only pasted in partial code of the function, and that is causing the error.

    Remove the code you have pasted in and specifically copy all the code from

    function bizlight_home_testimonial() {

    to

    }

    right above endif;

    you need to copy all the code between these lines and then add the custom class like you have done.

    Also, please add the custom CSS for the alignment of icon.

    Hope you understand.
    Best Ragards.

    Thread Starter iacino

    (@iacino)

    I decided to copy the entire functions file to my child folder and change what you said but nothing changed. So, then I just changed the original file and the changed worked. If you check my website, it looks correct except for size and color and spacing up and down. http://www.mouseoverdesigns.com. How do I make it match the quote above?

    Hello iacino,

    Your changes should work from child theme’s functions.php file if you have correctly copied the function as per instructions.Please remember, we Never Recommend making changes to parent theme’s files as you will lose your changes with updates.

    Please check if you have correctly activated your child theme with the changes.

    To make the quote look like the quote above.. just paste in the custom CSS i’ve provided earlier.

    I have recreated your situation locally and everything works good as you can see in this screenshot.

    let me know if you fix the issue,
    Best Regards.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How should I change carousel indicator dots t a thumbnails image?’ is closed to new replies.