Blocs Export not Functioning Properly

I Need Help
1

TLDR: Project’s jQuery (Isotope) functions fine in Blocsapp and when previewing in Chrome/Safari, but upon export the jQuery (Isotope) does not work.

Hello everyone!
I have been attempting to integrate Isotope into our Blocsapp website and everything functions fine in Blocsapp, but when I export Isotope does not function, it doesn’t filter. I can click the buttons and they respond by taking me back to the top of the page, but none of the images sort. As far as I know and can see, everything is formatted correctly in Blocsapp. It is showing that the button is selected, but no response from the .item elements. Not too sure about the code though. This has been extremely frustrating and I am just trying to figure out how to get this to work.

I know I could just write the code outside of Blocs and put it in after export but I am trying to avoid doing more than I need to as I am a designer, not a developer. Any help would be greatly appreciated!!!

I dropped the code into CodePen if anyone is able to take a look at it, sorry it’s a mess and obviously files are missing: https://codepen.io/jsk5/pen/NPKRmGZ

2

Blocs sites don’t typically use jQuery so you need to enable that for export. You can do that in project settings.

3

Thanks for the response, Norm! I have that selected, no luck.

4

Nice looking design for a website! :smiley:

5

Have you tried uploading the export to hosting. The functionality may require a host in order to function. I’m not sure if you tried that or you are just opening html files in the browser.

6

jQuery appears included in the all.js

In my opinion it looks more like a setup / configuration issue. Because if what you posted on Codepen is what was in Blocs then it could not have worked.

At quick glance: One of the things I notice immediately is there seems to be nothing assigned to the items to be found for filtering in correlation to the buttons.

There might be other issues also, I stopped there — consult the Isotope Documentation as it will walk you through the setup. Or consult the multitude of existing samples that can be found for this library.

Also the scrolling to the top is caused by all the buttons having: <a href=“#”

1 Like
7

@jsK5 Nice job reconfiguring the implementation and getting it working correctly, congrats on your new job, looking good. https://www.k5company.com/work/

Edit: whoops new url, you changed to clean urls now :–)

8

Haha thank you! Wish the UI design was…nicer… just followed boss’ template. Hoping to do a true refresh sometime this year with better UI design : )