Home Forums Premium WordPress Themes Help Soma Pro Theme Help change slider effect?

This topic contains 3 replies, has 1 voice, and was last updated by  Spiracle Themes 1 year, 3 months ago.

  • Author
    Posts
  • #1045 Reply

    Rich Dixon

    I’d like to change the front slider to a less harsh transition, perhaps a fade. I found the link below and thought maybe I could translate the advice to my theme, but I can’t find corresponding code.

    Sorry to be a pest.

    Slider Transitions & Timing

  • #1047 Reply

    Spiracle Themes

    Hi Rich

    You need to edit js file to achieve this. Follow the steps below

    Step 1) Go to theme root folder ie somapro (wp-content/themes/somapro)

    Step 2) Go to js folder

    Step 3) find soma-main.js and open this in any text editor

    Step 4) Go to line number 106 and add animateIn: ‘animation name’, after this and save

    ie
    /*– owl carousel –*/
    var owl = $(‘.slider-carousel’);
    owl.owlCarousel({
    autoplay:true,
    loop:true,
    margin:0,
    navSpeed:500,
    nav:false,
    items:1,
    animateIn: ‘fadeInLeft’,

    });

    You can find animations from here
    https://daneden.github.io/animate.css/

    Best Regards

  • #1049 Reply

    Rich Dixon

    Thanks for the clear instructions. Problem: I’m using a child theme and the js folder of the child theme is empty. Can I still make changes?

    • #1054 Reply

      Spiracle Themes

      Hi Rich,

      Yes, you can make these changes in child theme also. The procedure for this is a bit different. I am listing some steps here

      Step 1) First of all copy your soma-main.js file from parent js folder to the child theme js folder. We will now edit the child version of soma-main.js

      Step 2) Do the changes as I mentioned in above post reply i.e. you have to add animateIn property to the slider function

      Step 3) Open Child’s theme functions.php and add these two lines just after this line this comment

      /*— Adding a js file demo. Paste your js file inside the child theme js folder and add it like the example below —*/

      wp_dequeue_script( 'soma-script');
      wp_enqueue_script( 'soma-child-script', trailingslashit(get_stylesheet_directory_uri()) . 'js/soma-main.js', array('jquery'), '', true );

      View Screenshot

      Best Regards

Reply To: change slider effect?
Your information: