Как присвоить заголовки слайдеру и коду bjqs?

Question

Привет, я не совсем айтишник, но в те дни я немного освоил кодирование HTMl.Я разрабатываю дизайн нашего блога (о фильмах) и использую данный шаблон.Я хочу добавить слайдер к этому миксу, который выглядит следующим образом ...

в CSS:

/* SLIDER */

#slider {
background: #a71b1b;
width: 720px;
height: 410px;
margin: 0 0 20px;
padding: 0px;
border-radius: 0px;
}

#slider:hover .article-data {
    height: auto;
    overflow: visible;
}

#slider:hover img {
    opacity: 0.7;
}

#slider .article-infos,
#slider .lead {
display: none;
}

#slider .bjqs {
display: block;
position: relative;
width: 720px;
height: 410px;
overflow: visible;
margin: 0;
padding: 0;
}

#slider .bjqs li {
    display: block;
    position: absolute;
  background-color: #a71b1b;
    top: 0;
    left: 0;
    width: 770px;
    height: 410px;
}

#slider .article-image {
display: block;
background: #e9ebeb;
position: relative;
width: 720px;
height: 410px;
}

#slider img {
position: absolute;
bottom: 0;
height: auto;
left: 0;
margin: auto;
right: 0;
top: 0;
width: auto;
        transition: all 0.2s ease-in 0s;
-webkit-transition: all 0.2s ease-in 0s;
}

#slider .article-data {
background: black;
position: absolute;
bottom: 0;
left: 0;
font-size: 20px;
width: 735px;
padding: 0;
height: auto;
}

#slider .article-data h1 {
    padding: 15px 15px 15px;
    font-size: 25px;
    line-height: 20px;
    text-align: left;
    overflow-wrap: break-word;
    word-break: break-all;
    word-break: break-word;
    width: auto;
    height: 40px;
}

#slider .article-data h1 a {
    display: block;
    color: auto;
}

#slider .bjqs-markers {
display: block;
position: relative;
top: -390px;
right: -694px;
width: 370px;
z-index: 5;
}

#slider .bjqs-markers li {
    background: #cfcfcf;
    font-family: 'Arial';
    font-size: 20px;
    line-height: 42px;
    margin: 0 0 2px;
}

#slider .bjqs-markers li + li + li + li + li {
    display: none;
}

    #slider .bjqs-markers li.active-marker {
        background: #a71b1b;
    }

#slider .bjqs-markers a {
    background: rgba(0, 0, 0, 0.12);
    position: relative;
    display: block;
    padding: 15px;
    z-index: 2;
}

    #slider .bjqs-markers a:hover {
        background: #b7b5b5;
        color: #fff;
    }

    #slider .bjqs-markers .active-marker a {
        background: #a71b1b;
        color: #fff;
    }

#slider .bjqs-markers .active-marker {
    position: relative;
}

#slider .bjqs-markers .active-marker:after {
    position: absolute;
    content: "";
    right: 100%;
    top: 50%;
    border: solid transparent;
    height: 0;
    width: 0;
    pointer-events: none;
    border-color: transparent;
    border-right-color: #a71b1b;
    border-width: 28px;
    margin-top: -28px;
}

И в HTML:

<blhc:if key="pageType" value="blogcimlap" operator="eq">
            <blh:starred width="720" height="410" limit="4" bjqs_showcontrols="false"              bjqs_showmarkers="true" bjqs_centermarkers="false" />
        </blhc:if>

Это выглядиткак это на поверхности: PIC

Вы можете видеть, что название фильма появляется на слайдере, но не на маркерах BJQS, где появляются только цифры, и у меня нет идей, какпокажите название там тоже.Однако этот код работает в другом встроенном шаблоне, как этот: PIC

Можете ли вы помочь мне с этой проблемой?