Support » Plugins » [Plugin: NextGEN Gallery] Highslide JS effect – how to make it work with Nextgen

Viewing 5 replies - 1 through 5 (of 5 total)
  • forget to mention:
    i also copied highslide.js to /wp-content/plugins/nextgen-gallery/js/highslide.js

    Follow this tutorial, worked for me:

    Updated Highslide w/ NextGen Gallery tutorial

    here’s what i downloaded after using editor – http://x-files.net.ua/files/highslide.zip

    i used – Gallery: vertical thumbstrip (no border) and a few not important changes in other tabs.

    in header.php:

    <!-- Highslide Plugin -->
    
    <link rel="stylesheet" type="text/css" href="wp-content/plugins/highslide/highslide.css" />
    <script src="wp-content/plugins/highslide/highslide-full.js" type="text/javascript"></script>
    <script src="wp-content/plugins/highslide/highslide.config.js" type="text/javascript"></script>
    </head>

    in highslide.config.js (of course before i uploaded it into WP):

    /**
    *	Site-specific configuration settings for Highslide JS
    */
    hs.graphicsDir = 'highslide/graphics/';
    hs.outlineType = 'custom';
    hs.dimmingOpacity = 0.75;
    hs.fadeInOut = true;
    hs.align = 'center';
    hs.marginBottom = 70;
    hs.marginLeft = 100;
    hs.captionEval = 'this.thumb.title';
    hs.captionOverlay.position = 'below';
    hs.registerOverlay({
    	html: '<div class="close-simple-white" onclick="return hs.close(this)" title="Закрити"></div>',
    	position: 'top right',
    	useOnHtml: true,
    	fade: 2 // fading the semi-transparent overlay looks bad in IE
    });
    hs.numberPosition = 'heading';
    hs.transitions = ['expand', 'crossfade'];
    
    // Add the slideshow controller
    hs.addSlideshow({
    	// slideshowGroup: 'group1',
    	interval: 5000,
    	repeat: false,
    	useControls: true,
    	fixedControls: false,
    	overlayOptions: {
    		className: 'text-controls',
    		opacity: '1',
    		position: 'bottom center',
    		offsetX: '50',
    		offsetY: '-10',
    		relativeTo: 'viewport',
    		hideOnMouseOut: true
    	},
    	thumbstrip: {
    		mode: 'vertical',
    		position: 'middle left',
    		relativeTo: 'viewport'
    	}
    
    });
    
    // Ukrainian language strings
    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 config object
    var config1 = {
    	slideshowGroup: 'group1',
    	numberPosition: 'heading',
    	transitions: ['expand', 'crossfade']
    };

    http://x-files.net.ua/?p=3043
    now, when I click on any thumbnail – it show – LOADING for eternal life. 🙁

    please, help..

    Have you cleared your browser’s cache? Because i tried your link and the highslide worked well.

    Updated Highslide w/ NextGen Gallery tutorial

    after having a conversaition with Travis – i got it worked. 🙂

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Plugin: NextGEN Gallery] Highslide JS effect – how to make it work with Nextgen’ is closed to new replies.