Hello Shingt,

Thank you for your question!

If you didn’t modify the file all.js, you can download the latest version of the template and replace the whole file in folder “js”. If you made some modifications to the file all.js, the best way to update it is to use a code comparison web service, for example, https://www.w3docs.com/tools/code-diff/ , and compare your current file all.js and the file all.js from the latest template version. After that, you need to make modifications based on the files comparison.

If you still need to identify the version of your file all.js, please create a support request, and we will help you with it.

Feel free to contact us if you have any questions.

Hello qdworlddesigns2tudio,

Thank you for your question!

1. To add an autoplay option to content slider in Rhythm Original please open the file /js/all.js (line 717) and change this code fragment:

// Fullwidth slider
$(".fullwidth-slider").owlCarousel({
    slideSpeed: 350,
    singleItem: true,
    autoHeight: true,
    navigation: true,
    lazyLoad: true,
    addClassActive : true,
    navigationText: ["<span class="sr-only">Previous Slide</span><i class="fa fa-angle-left" aria-hidden="true" />", "<span class="sr-only">Next Slide</span><i class="fa fa-angle-right" aria-hidden="true" />"],
    afterInit: owl_keynav,
    afterAction: owl_update
});

to this code:

// Fullwidth slider
$(".fullwidth-slider").owlCarousel({
    autoPlay: 3500,
    slideSpeed: 350,
    singleItem: true,
    autoHeight: true,
    navigation: true,
    lazyLoad: true,
    addClassActive : true,
    navigationText: ["<span class="sr-only">Previous Slide</span><i class="fa fa-angle-left" aria-hidden="true" />", "<span class="sr-only">Next Slide</span><i class="fa fa-angle-right" aria-hidden="true" />"],
    afterInit: owl_keynav,
    afterAction: owl_update
});

2. To add an autoplay option to content slider in Rhythm Evolution please open the file /js/all.js (line 754) and change this code fragment:

// Fullwidth slider
$(".fullwidth-slider").owlCarousel({
    slideSpeed: 350,
    singleItem: true,
    autoHeight: true,
    navigation: true,
    lazyLoad: true,
    addClassActive : true,
    navigationText: ['<span class="sr-only">Previous Slide</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27px" height="57px" viewBox="0 0 27 57" fill="currentColor" aria-hidden="true" focusable="false"><path d="M5.005,28.500 L27.000,54.494 L24.000,56.994 L0.005,28.500 L24.000,0.006 L27.000,2.506 L5.005,28.500 Z"/></svg>', '<span class="sr-only">Next Slide</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27px" height="57px" viewBox="0 0 27 57" fill="currentColor" aria-hidden="true" focusable="false"><path d="M21.995,28.500 L-0.000,54.494 L3.000,56.994 L26.995,28.500 L3.000,0.006 L-0.000,2.506 L21.995,28.500 Z"/></svg>'],
    afterInit: owl_keynav,
    afterAction: owl_update
});

to this code:

// Fullwidth slider
$(".fullwidth-slider").owlCarousel({
    autoPlay: 3500,
    slideSpeed: 350,
    singleItem: true,
    autoHeight: true,
    navigation: true,
    lazyLoad: true,
    addClassActive : true,
    navigationText: ['<span class="sr-only">Previous Slide</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27px" height="57px" viewBox="0 0 27 57" fill="currentColor" aria-hidden="true" focusable="false"><path d="M5.005,28.500 L27.000,54.494 L24.000,56.994 L0.005,28.500 L24.000,0.006 L27.000,2.506 L5.005,28.500 Z"/></svg>', '<span class="sr-only">Next Slide</span><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27px" height="57px" viewBox="0 0 27 57" fill="currentColor" aria-hidden="true" focusable="false"><path d="M21.995,28.500 L-0.000,54.494 L3.000,56.994 L26.995,28.500 L3.000,0.006 L-0.000,2.506 L21.995,28.500 Z"/></svg>'],
    afterInit: owl_keynav,
    afterAction: owl_update
});

The value autoPlay: 3500, is a time of a slide delay in milliseconds.

Feel free to contact us if you have any questions.

Hello flintdigitalco,

Thank you for your question!

It is possible to randomly launch different YouTube videos in the section background from a list. Please do the following steps to implement this solution:

1. Open your HTML file and change this code fragment:

<!-- Video BG Init -->
<div class="player" data-property="{videoURL:'https://www.youtube.com/watch?v=Magk43brnjA',containment:'#home',autoPlay:true, showControls:false, showYTLogo: false, mute:true, startAt:0, opacity:1}">
</div>
 <!-- End Video BG Init -->

to this code:

<!-- Video BG Init -->
<div class="player-1" />
 <!-- End Video BG Init -->

2. Open the file /js/jquery.mb.YTPlayer.js and change this code fragment:

// Video Init
$(document).ready(function(){
    $(".player").mb_YTPlayer();
});

to this code:

// Video Init
$(document).ready(function(){
    $(".player").mb_YTPlayer();
});

let videos = [
    {videoURL:'https://www.youtube.com/watch?v=Magk43brnjA',containment:'#home',autoPlay:true, showControls:false, showYTLogo: false, mute:true, startAt:0, opacity:1},
    {videoURL:'https://www.youtube.com/watch?v=irGHr6wcY5k',containment:'#home',autoPlay:true, showControls:false, showYTLogo: false, mute:true, startAt:0, opacity:1},
    {videoURL:'https://www.youtube.com/watch?v=jTea_8Fk5Ns',containment:'#home',autoPlay:true, showControls:false, showYTLogo: false, mute:true, startAt:0, opacity:1}
];

$(document).ready(function(){
    $(".player-1").YTPlaylist(videos, true);
});

If you want to add one more video to the list add new line to the “videos” array:

{videoURL:'https://www.youtube.com/watch?v=jTea_8Fk5Ns',containment:'#home',autoPlay:true, showControls:false, showYTLogo: false, mute:true, startAt:0, opacity:1}

Feel free to contact us if you have any questions.

Oh wow, amazing. Thanks so much!

You are lways welcome!

Hi Oscar,

Thank you for your question!

Could you please create a support request and provide to us your website URL? You can create a support request here - https://themeforest.net/item/rhythm-multipurpose-onemulti-page-template/10140354/support .

Hi there 23desarrollos!

Thanks for reaching out to us. We specialize in developing and selling HTML templates, but we’re not experts in CMS. However, we’re happy to share these helpful resources with you: https://www.experte.com/website/cms-software https://www.wpbeginner.com/showcase/best-cms-platforms-compared/

Thank you!

You are always welcome!

Hello Winnibischoff,

Please create a support request via this form – https://themeforest.net/item/rhythm-multipurpose-onemulti-page-template/10140354/support and send us your website URL. We will do our best to help you with this issue.

Many thanks for your extensive help.

If I buy the theme, can it be bundled with the preview images?

Hi there!

Just to clarify, the template package doesn’t come with the photos you see in the demo. Those photos are just meant to give you an idea of what the template looks like and are the property of their respective owners. However, you can find some of these photos on unsplash.com.

Regarding your question about CAPTCHA, I’m not sure I fully understand what you’re asking. Could you please provide a little more detail so I can better assist you? Thank you!

Hello Usmanzam,

Thank you for your question! 

All the sections have the same vertical paddings by default. If you want to change the vertical paddings for all the sections open the file /css/style.css (line 2402) and find this code:

.page-section,
.small-section{
   width: 100%;
   display: block;    
   position: relative;
   overflow: hidden;
   background-attachment: fixed;
   background-repeat: no-repeat;
   background-position: center center;

   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;

   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;

   padding: 140px 0;
}

You need to change the value in the line “padding: 140px 0;”.

If you want to change the vertical paddings only for this one section add classes “pt-80 pb-80” to the section tag:

<section class="page-section pt-80 pb-80">
</section>

You can find detailed information about the padding classes in the template documentation, section “Vertical rhythm utility”. 

Figured it out – “hidden-xs” and “visible-xs” is old css. Bootstrap now uses “d-none d-xs-block” to hide & “d-none” to show. Hope this helps others. thanks

Sorry – spoke too soon. the correct css is: Hidden only on xs: .d-none .d-sm-block Visible only on xs: .d-block .d-sm-none

Hello Shingt,

Please use the following code to make the element hidden on mobile phones and visible on tablets and desktops:

<div class="d-none d-sm-block">hide on screens smaller than sm</div>

You can find the detailed display utility documentation here – https://getbootstrap.com/docs/5.0/utilities/display/ .

Feel free to contact us if you have any questions.

Hello Roxxy,

Thank you for contacting us!

I’ve just tested the demo with an HTML5 background video on iOS (iPhone), and it works correctly for me. Could you please create support ticket here – https://themeforest.net/item/rhythm-multipurpose-onemulti-page-template/10140354/support and provide the following details:

1. The version of your iOS.

2. The URL of the page with this issue.

Hello Ramses,

Thank you for your question!

Unfortunately, the Rhythm template doesn’t include a pre-designed solution for Constant Contact form integration. But Constant Contact allows you to integrate the form into any HTML website in a few steps. You can find detailed instructions here – https://knowledgebase.constantcontact.com/articles/KnowledgeBase/18265-Create-a-Sign-Up-Form-with-the-new-sign-up-form-experience?lang=en_US .

Feel free to contact us if you have any questions.

Hello Ebree,

Thank you for your kind words! We are happy to hear that you like the Rhythm template. We will consider it when we work on the new template updates.

Hello Atsiov,

Thank you for your question!

Rhythm HTML template includes two design concepts: Rhythm Original and Rhythm Evolution. Rhythm Original uses two fonts: Dosis for headings and Open Sans for the main text. Unfortunately, Dosis doesn’t support Greek symbols. Open sans supports the Greek symbols. You can check how the Greek symbols look with Open Sans font here – https://fonts.google.com/specimen/Open+Sans . Rhythm Evolution design concept uses HK Grotesk font. Unfortunately, this font doesn’t support Greek symbols. Please consider choosing an alternative font with Greek symbols support on fonts.google.com and use it with the Rhythm template.

Feel free to contact us if you have any questions.

I don’t have the Evolution version online yet.

Could you please send us your website files in a single ZIP? Please create a support request here – https://themeforest.net/item/rhythm-multipurpose-onemulti-page-template/10140354/support . We will do our best to help with adding such a checkbox.

Thank you first. I’ll get back to you as soon as I’ve renewed support.

Dear Sre,

If you want to create a website based on Rhythm template for your client you need to buy a Regular License for this template.

Feel free to contact us if you have any questions.

Hello Sre,

Thank you for your question!

Please do the following steps to make the “link to top” visible on page scrolling:

1. Open the file /css/style.css and add this code at the end:

a.link-to-top{
    position: fixed;
    display: none;
}

2. Open the file /js/all.js and add this code at the end:

(function(){
    $(window).scroll(function(){            
        if ($(window).scrollTop() > 0) {
            $(".link-to-top").fadeIn("fast");
        }
        else if ($(window).scrollTop() === 0){
            $(".link-to-top").fadeOut("fast");
        }  
    });
})();

Feel free to contact us if you have any questions.

Hello Shingt,

Thank you for contacting us!

Please do the following steps to change the logo height before scroll:

1. Open the file /css/style.css (line 1717) and find this code:

.nav-logo-wrap .logo{
    display: flex;
    align-items: center;
    max-width: 188px;
    height: 85px;
    -webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

You need to change the value “height: 85px;” to “height: 120px;”.

2. Open the file /css/style.css (line 1725) and change this code fragment:

.nav-logo-wrap .logo img{
    max-height: 100%;
}

to this code:

.nav-logo-wrap .logo img{
    width: auto;
    max-height: 100%;
}

3. Open the file /css/style.css (line 1744) and find this code:

.main-nav{
    width: 100%;
    height: 85px !important;
    position: relative;
    top: 0;
    left: 0;
    text-align: left;
    background: rgba(255,255,255, .99);
    box-shadow: 0 3px 15px 0 rgba(0, 0, 0, 0.05);
    z-index: 1030;

    -webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

You need to change the value “height: 85px !important;” to “height: 120px !important;”.

The height of the logo after the scroll will have a default value.

Feel free to contact us if you have any questions.

I managed to fix my % in the counter section with changing the html code and js/all.js (like you explained to arc8num in another comment) but now, I do not know for which reason this action moved the half of my top page away (for exemple the 3 pictures of my home page are showing one after the other) and some other parts are missing…

Hello Estrya,

Thank you for contacting us!

Please create a support request at this page – https://themeforest.net/item/rhythm-multipurpose-onemulti-page-template/10140354/support and send us your website URL. We will do our best to help you with this issue.

Hello RamsDigitalMarketing,

Unfortunately we don’t have any WordPress templates. We sell only HTML templates.

Feel free to contact us if you have any questions.

Hello Kselcuk,

Thank you for your question!

This item is an HTML template but not a Worpdress theme. Feel free to use it for creating a multilingual website with a languages menu. You can see an example of such a menu here – https://rhythm.bestlooker.pro/rhythm-evolution/mp-index.html

Feel free to contact us if you have any questions.

any wordpress theme?

Hello Kselcuk,

Unfortunately, we don’t have a WordPress version of the Rhythm template.

Feel free to contact us if you have any questions.