2 Comments

Ultimo – 'Related products' owl Carousel

what is the factory for url rewrites?
Issue when SpecialPriceFromDate is equal with SpecialPriceToDate

I am using Ultimo theme.

Does anybody know how to change the scrolling direction of the ‘related products’ slider? The slider is based on the popular Owl Carousel.

I would assume the code for this is inside: ‘js/infortis/jquery/plugins/jquery.owlcarousel.min.js‘ but I am not 100% sure because I think it is a minified version of the original script which can be found on the Owl Carousel developer’s site.

All I want to do is change the slider from scrolling horizontally to vertically if possible.

Any help would be most welcome, thank you.

Related Posts

  • jquery not defined error in magento 2 (1)
    I am trying to bring banner scroll in magento2. I am using owl carousel for this purpose. Everything have done and implemented and is showing in firefox without any errors. But when checked in chrome, i found jquery not defined error. After some diggings, i found we need to use call […]
  • Horizontal menu scroll by dragging or clicking on next/prev button (0)
    I am trying to design a vertical navigation bar where if menu items length increases than container width, the next/prev button or dragging effect will be activated. Next/prev buttons are working fine. But I can't fix the dragging event to starting or ending position of listing […]
  • Display all the sub-categories in multiple <ul> tag (2)
    I have one main Category (View All Inventory) under which I have around 76 sub-categories. Right now it prints out all the 76 sub-categories in a single <ul> tag. <?php $_menu = $this->getHtml('level-top') ?> <?php if($_menu): ?> <div […]
  • How to edit gallery images more view slider in product page? (5)
    My custom theme extend form magento-black. I had try edit gallery images slider in product page. but I can't change number items to show and slider working not correct with items carousel is normal. I had found code in file […]
  • How to edit gallery images more view slider in product page? (5)
    My custom theme extend form magento-black. I had try edit gallery images slider in product page. but I can't change number items to show and slider working not correct with items carousel is normal. I had found code in file […]
  • How to do vertical navigation between images in product page? (0)
    I'm working on my website and I would like to implement a vertical navigation between images in the product page. The objectif is to have only the left side scrolling the right one doesn't move. Here is an example : […]
  • How to call Owl Slider in Magento2 (2)
    If we want to add Owl Slider in Magento 1.X then we follow below steps. 1). Copy owl.carousel.min.js and owl.carousel.js and paste into skin/frontend/pakage_name/theme_name/js 2). copy owl.carousel.css and paste into skin/frontend/pakage_name/theme_name/css 3). goto […]
  • Add vertical slider to product page (view more images) (1)
    I am searching for a vertical slider for my product page. I tried http://codepen.io/thirdender/pen/aOYyGb but it doesn't work. Any other solution?
  • One Page Checkout begin at top of screen on next (1)
    I use a vertical one page checkout methode, so that the steps are taken vertical. When the first billing page is filled in, I want to begin all next steps at the top of the page. I edit skin/frontend/base/default/js/opcheckout.js and replaced the gotoSection as […]
  • Magento2 : How to disable product image slider on detail page (1)
    I want to disable product image slider on product detail page, only in desktop and tablet view. also all product images visible in same. other all images functionality must working like images open in full screen. Display All images vertically at the same time. show all images […]
what is the factory for url rewrites?
Issue when SpecialPriceFromDate is equal with SpecialPriceToDate

2 Comments on this article

  • User October 26, 2016
    1. Add animate.css

    I haven’t seen the ultimo theme but maybe you can find the owl js under skinfrontendtemplate_nametemplate_namejs folder and edit it like this. Hope this helps.

    $(".owl-carousel").owlCarousel({
      loop: true,
      autoplay: true,
      items: 1,
      nav: true,
      autoplayHoverPause: true,
      animateOut: 'slideOutUp',
      animateIn: 'slideInUp'
    });
    

    Reply

  • User October 26, 2016

    Don’t touch jquery.owlcarousel.min.js,
    The script for each slider is inline in the phtml file as example
    list_featured_slider.phtml you can find the script in line 242.

    related_multi.phtml line 110

    One more thing owlcarousel is not great with vertical scroll.

    Reply

Add a comment

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax