Hi,

On the Home Split Classic page, when I create and publish a module in the masshead or section-top positions they don't appear under the Hero content?

Not sure what I'm doing wrong

Thanks,

    Hi greendome

    It due to the layout of that page specific, it has one screen layout in which each section will slide when you scroll the mouse.

    If you want to show the masthead also, you can edit this file:

    /templates/ja_aiga/tpls/default.php

    Look for this code:

    $oneScreen = '';
if($this->countModules('hero')) {
  $oneScreen = 'one-screen';
}

    change it to:

    $oneScreen = '';
if($this->countModules('hero')) {
  $oneScreen = 'one-screen-1';
}

      I tried the suggested code but it messes up the slides when scrolling. I think I can do without the masthead part. However, is there anyway I can add an additional button to the slides, next to the 'Find Out More'?

      Thanks

        greendome

        Yes, you can customize ACM - Hero style-1 module a little bit in these 2 files:

        [root]/templates/ja_aiga/acm/hero/tmpl/style-1.php
        [root]/templates/ja_aiga/acm/hero/tmpl/style-1.xml

        I already modified these 2 files and attach here so you can use:

        style-1.zip
        3kB

        Here is how it will look like in backend:

        On frontend, you can add below custom css so 2 buttons can display side by side:

        .hero-item .btn-action {
	display: inline-block;
}

        add into the file: /templates/ja_aiga/css/custom.css (Create this file if it doesn't exist)

          Thank you - I will give this a go.

          On mobile devices, the slider doesn't scroll unless the up/down arrow buttons are used. Is there a way to make it auto scroll on both the desktop and mobile devices, please? This would be an excellent feature for this template.

          Thanks

          Yes, you can.

          In the same file: [root]/templates/ja_aiga/acm/hero/tmpl/style-1.php

          Look for the script at the end of file and change to this:

          <script>
(function($){
	$(document).ready(function() {
		$('#acm-hero-<?php echo $module->id; ?> .slide-wrapper').multiscroll({
			scrollingSpeed: 700,
			easing: 'linear',
			navigation: <?php echo ($count > 1) ? 'true' : 'false' ;?>,
			navigationPosition:'right',
			navigationColor: '#fff',
			moveSectionUp: '.control-top',
      loopTop: true,
      loopBottom: true
		});

		//Remove Effect on mobile
		if($(window).width() < 1200) {
			$.fn.multiscroll.destroy();
		};
	});

	<?php if($count > 1) :?>
		//adding the action to the button
		$(document).on('click', '.control-top', function(){
		  $.fn.multiscroll.moveSectionUp();
		});

		$(document).on('click', '.control-bottom', function(){
		  $.fn.multiscroll.moveSectionDown();
		});
	<?php endif ;?>

	// Add Class Style To HTML
	$('body').addClass('style-<?php echo $helper->get('hero-style') ?>');
	function scrollMe() {
    $.fn.multiscroll.moveSectionDown(); 
	}
	setInterval(scrollMe, 2000);
})(jQuery);
</script>

          You can change interval time between each slide by editing the miliseconds value here: setInterval(scrollMe, 2000);

          Write a Reply...
          You need to Login to view replies.