11.04.13, 10:54
0 комментарий
  DLE Хаки

Меняем стиль галереи HighSlide DLE 9.*

1. Скачайте архив:

Этот архив содержит файлы библиотеки HighSlide версии 4.1.13 (а именно highslide-with-gallery.min.js, который переименован в highslide.js, и highslide.css).

Загрузите файлы в папку "engine/classes/highslide".

2. В "index.php" найдите

<script type="text/javascript">  
<!--  
    hs.graphicsDir = '{$config['http_home_url']}engine/classes/highslide/graphics/';
    {$type}
    hs.numberOfImagesToPreload = 0;
    hs.showCredits = false;
    {$dimming}
    hs.lang = {
        loadingText :     '{$lang['loading']}',
        playTitle :       '{$lang['thumb_playtitle']}',
        pauseTitle:       '{$lang['thumb_pausetitle']}',
        previousTitle :   '{$lang['thumb_previoustitle']}',
        nextTitle :       '{$lang['thumb_nexttitle']}',
        moveTitle :       '{$lang['thumb_movetitle']}',
        closeTitle :      '{$lang['thumb_closetitle']}',
        fullExpandTitle : '{$lang['thumb_expandtitle']}',
        restoreTitle :    '{$lang['thumb_restore']}',
        focusTitle :      '{$lang['thumb_focustitle']}',
        loadingTitle :    '{$lang['thumb_cancel']}'
    };
    {$gallery}
//-->
</script>


и замените на

<script type="text/javascript">  
<!--  
    hs.graphicsDir = '{$config['http_home_url']}engine/classes/highslide/graphics/';
    hs.align = 'center';
    hs.transitions = ['expand', 'crossfade'];
    hs.fadeInOut = true;
    hs.dimmingOpacity = 0.8;
    hs.wrapperClassName = 'borderless floating-caption';
    hs.captionEval = 'this.thumb.alt';
    hs.marginLeft = 100; // make room for the thumbstrip
    hs.marginBottom = 80 // make room for the controls and the floating caption
    hs.numberPosition = 'caption';
hs.lang = {
        cssDirection: 'ltr',
        loadingText: 'Загружается...',
        loadingTitle: 'Нажмите для отмены',
        focusTitle: 'Нажмите чтобы поместить на передний план',
        fullExpandTitle: 'Развернуть до оригинального размера',
        creditsText: 'Использует <i>Highslide JS</i>',
        creditsTitle: 'Перейти на домашнюю страницу Highslide JS',
        previousText: 'Предыдущее',
        nextText: 'Следующее',
        moveText: 'Переместить',
        closeText: 'Закрыть',
        closeTitle: 'Закрыть (esc)',
        resizeTitle: 'Изменить размер',
        playText: 'Слайдшоу',
        playTitle: 'Начать слайдшоу (пробел)',
        pauseText: 'Пауза',
        pauseTitle: 'Приостановить слайдшоу (пробел)',
        previousTitle: 'Предыдущее (стрелка влево)',
        nextTitle: 'Следующее (стрелка вправо)',
        moveTitle: 'Переместить',
        fullExpandText: 'Оригинальный размер',
        number: 'Изображение %1 из %2',
        restoreTitle: 'Нажмите чтобы закрыть изображение, нажмите и перетащите для изменения местоположения. Для просмотра изображений используйте стрелки.'
};
    {$gallery}
//-->
</script>



найдите

    $gallery = "
    hs.align = 'center';
    hs.transitions = ['expand', 'crossfade'];
    hs.addSlideshow({
        interval: 4000,
        repeat: false,
        useControls: true,
        fixedControls: 'fit',
        overlayOptions: {
            opacity: .75,
            position: 'bottom center',
            hideonmouseout: true
        }
    });";



и замените на

   $gallery = "
    // Add the slideshow providing the controlbar and the thumbstrip
    hs.addSlideshow({
        //slideshowGroup: 'group1',
        interval: 5000,
        repeat: false,
        useControls: true,
        overlayOptions: {
            className: 'text-controls',
            position: 'bottom center',
            relativeTo: 'viewport',
            offsetX: 50,
            offsetY: -5
        },
        thumbstrip: {
            position: 'middle left',
            mode: 'vertical',
            relativeTo: 'viewport'
        }
    });
    // Add the simple close button
    hs.registerOverlay({
        html: '<div class="closebutton" onclick="return hs.close(this)" title="Close"></div>',
        position: 'top right',
        fade: 2 // fading the semi-transparent overlay looks bad in IE
    });";



Если хотите, что бы галерея HighSlide работала на всех страницах, найдите:

if ($config['thumb_gallery'] AND ($dle_module == "showfull" OR $dle_module == "static") ) {



замените на

//if ($config['thumb_gallery'] AND ($dle_module == "showfull" OR $dle_module == "static") ) {



найдите так же

    } else {

        $gallery = "";

    }



и замените на

/*    } else {

        $gallery = "";

    }*/



3. В главном файле шаблона "main.tpl" перед

</head>



вставьте

<link media="screen" href="/engine/classes/highslide/highslide.css" rel="stylesheet" />



4. В стилях шаблона вставьте, обычно это файл "templates/*/styles/style.css"

/* Center the text in the caption */
.highslide-caption {
    width: 100%;
    text-align: center;
}
/* Remove the close button from the controls since we already have one in the corner of the image */
.highslide-close {
    display: none !important;
}
/* Put the image number in front of the caption */
.highslide-number {
    display: inline;
    padding-right: 1em;
    color: white;
}



Разработчик: admin-club.ru

СКАЧАТЬ

Вес файла
19.99 Kb

Напишите своё мнение