سلام بهترین روش برای اسلایدر کردن اسلایدر از چه آبجکتی و چگونه میتوان اکتیو اسلایدر را مشخص کرد؟

برای اسلایدر من که شامل دو قسمت هست (یکی خود عکس اسلایدر و دیگری عدد زیرآن) چگونه باید طراحی اش کنم؟

    <!-- Slider -->
    <div id="home_carousel" class="carousel slide" data-ride="carousel">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li data-target="#home_carousel" data-slide-to="0" class="active"></li>
            <li data-target="#home_carousel" data-slide-to="1"></li>
        </ol>

        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active">
                <img src="PetCarre/images/2.png" alt="" />
                <div class="carousel-caption">
                    <h2>متن یک</h2>
                    <p>توضیحات</p>
                </div>
            </div>

            <div class="item">
                <img src="PetCarre/images/3.png" alt="" />
                <div class="carousel-caption">
                    <h2>متن دو</h2>
                    <p>توضیحات</p>

                </div>
            </div>
        </div>