Dropdown not opening in deployed site

Note: I am not a developer, so please be kind.

Site reference: https://amberahmed.netlify.app/
Problem: the button ‘projects’ doesn’t work after deployment
Details: I have built a static html site in R markdown. All pages are created locally, I am deploying from github. When I examine index.html locally, the Projects dropdown works fine. If I inspect the html, I see the dropdown class toggling to ‘dropdown open’ after a mouse click.
After deployment, (I have tried multiple browsers), no matter how many mouse clicks on the Projects tabs, nothing happens, Inspection of html shows no toggling.
I tried manually editing the html in the browser changing
class="dropdown" to class="dropdown open" , and that opened the dropdown menu


This is making me think that my html is coded properly but some feature gets changed after deployment, which results in mouse click not working properly on the dropdown class. I hope someone is able to help.

Thanks
Amber.

Hello Amber (@AHM), looks like you are using Bootstrap 3.3.5.
Kindly visit the Bootstrap v3.3.5 getting started guide below and crosscheck how you are importing Bootstrap in your project.

The link tags should be inside the head tag and the script tag should be before the closing body tag.

Thanks.

Thanks for the answer. I have no idea about bootstrap. I am not a developer. I built the site using rmarkdown. I generated the site using rmarkdown::render_site(). This takes care of all the html stuff in the background. There are many sources out there saying that rmarkdown sites can be hosted on netlify, and this worked for me initially in 2020. But now, I have run into the dropdown menu problem. I don’t know what is different in the system now, from then. I did not change anything in the bootstrap folder, it is still the default from rmarkdown. I’ll appreciate if someone could take a deeper look to tell me what exactly needs to be changed.

Hi @AHM, thanks for sharing the extra infromation.
I cloned your portfolio site repository on GitHub which I found using the footer links in the site URL you shared.
After I cloned the portfolio site, I successfully deployed to Netlify and the drop-down link seems to be working fine.

Screencast from 03-03-2023 09_34_39 AM

I suggest you delete your current deployment and then deploy a fresh copy of your site repository from GitHub to see if it works.

Let me know the outcome.

Thanks.

HI @AHM, I checked the site URL you shared again and it seems the dropdown is working now.
Kindly confirm if it is working at your end as well.

Thanks.

It is working because I created an entirely new project from scratch, and built everything again. The project that you have linked in the screenshot above is this new project, and I agree it works. The previous project, is in a different github repository, and still has the issue. The deployed link is this one, and still has the issue: index.knit

1 Like

I will call this resolved though, since I have what I need for now. I still don’t know why the issue happened in the first place. And if it will reoccur in the future.

Hi @AHM, thanks for sharing that the problem has been resolved now.