CMS Development

krislim
Participant | Elite Partner
Participant | Elite Partner

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

We are migrating the company website  to hubspot, we duplicated eveything and manage to have most of the module setup, however we are stuck in the Timeline module, tried several method even some example online with the same feature but the Timeline slider just doesn't work at all, it just maintains a frozen screen then being able to move left and right. We suspect if it is because of the jQuery, however we still weren't able to find the solution.

 

please find here our test page: http://freseniusmedicalcare-5937210.hs-sites.com/testing

 

Example that we have taken a look from the internet and also tried on the site but also didn't work as expected: 

http://www.shindiristudio.com/timeline/index.html

https://codepen.io/abhishekraj/pen/WZZKKw

 

We have tried for few days and it just doesn't work, hope someone will be able to help. Thanks in advance!

0 Upvotes
2 Accepted solutions
krislim
Solution
Participant | Elite Partner
Participant | Elite Partner

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Hi @dennisedson, we have finally managed to solve the issue, it was due to the <div> in the template that is missing and causes the issue. Thank you so much!

 

On the other hand, we have came across another issue of which we embedd client's Js file from it's external url path, the slider works, but when we copy the whole Js file and create the new Js fileit in HubSpot (store in File or in the CMS Js Folder), the slider shifted in the page and failed to function. Would you please help to take a look what's happening to the script? We have no ideas why this method sometime works on other pages when the file is 100% mirror from the original one, but not for this slider in this case.

Template File: Template embedded with Client's External Js Script  Line: 95

 

Client's source Js file (External Path): https://www.freseniusmedicalcare.asia/typo3temp/assets/compressed/merged-25c9dc30dab5f9453acb83469f5... 

Slider Works: Preview Slider (Working)

 

 

Template File: Template embedded with our Js Script (Copy from Client's Js file URL) Line: 95 

 

When we copied Client's Js file and created our Js file in this link https://app.hubspot.com/design-manager/5937210/code/41332637637?tfid=37046143508

Slider do not work: Preview Slider (Not working)

 

Thank you in advance Dennis!

View solution in original post

piersg
Solution
Key Advisor

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE
9 Replies 9
dennisedson
HubSpot Product Team
HubSpot Product Team

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Hello @krislim 

Looking at the link you sent, looks like a function is not being declared properly. 🤔

@piersg , @Anton , do you all have any advice?

0 Upvotes
krislim
Participant | Elite Partner
Participant | Elite Partner

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Thank you for your reply @dennisedson .We are confused and not sure what's happening in there and our team has been stuck at this for quite a period of time.. we even set it 100% similar to the client's site but it's still not working as expected.

0 Upvotes
dennisedson
HubSpot Product Team
HubSpot Product Team

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Hey @krislim

Looks like you are loading the slick js library (twice actually.  might want to remove one), but I don't see where you are invokinig it.  Check out this page to see how it works

It will look something like this

$('.your-class').slick({
  setting-name: setting-value
});
krislim
Solution
Participant | Elite Partner
Participant | Elite Partner

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Hi @dennisedson, we have finally managed to solve the issue, it was due to the <div> in the template that is missing and causes the issue. Thank you so much!

 

On the other hand, we have came across another issue of which we embedd client's Js file from it's external url path, the slider works, but when we copy the whole Js file and create the new Js fileit in HubSpot (store in File or in the CMS Js Folder), the slider shifted in the page and failed to function. Would you please help to take a look what's happening to the script? We have no ideas why this method sometime works on other pages when the file is 100% mirror from the original one, but not for this slider in this case.

Template File: Template embedded with Client's External Js Script  Line: 95

 

Client's source Js file (External Path): https://www.freseniusmedicalcare.asia/typo3temp/assets/compressed/merged-25c9dc30dab5f9453acb83469f5... 

Slider Works: Preview Slider (Working)

 

 

Template File: Template embedded with our Js Script (Copy from Client's Js file URL) Line: 95 

 

When we copied Client's Js file and created our Js file in this link https://app.hubspot.com/design-manager/5937210/code/41332637637?tfid=37046143508

Slider do not work: Preview Slider (Not working)

 

Thank you in advance Dennis!

dennisedson
HubSpot Product Team
HubSpot Product Team

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

@krislim 

Comparing the two pages, looks like the one that is not displaying properly is missing content in a div with a class of "trusted".  If you add that content, everything shifts back into order.  You will either need to make sure you have content there or account for the possibility of not having content there

@piersg , what do you think?

krislim
Participant | Elite Partner
Participant | Elite Partner

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Dear Dennis,

 

Thank you so much for your headsup! The slider works now!! 

piersg
Key Advisor

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

Hi @dennisedson, looks like it's working now 👍

dennisedson
HubSpot Product Team
HubSpot Product Team

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE
It just needed your eyes to coax it 😉
piersg
Solution
Key Advisor

Migrating a Timeline slider from original site, but the the slider doesn't work at all

SOLVE

giphy