Streaming live at 10am (PST)

Cargo Collective effect


#1

Hey guys, I'm Aren and I'm new to Webflow.

I'd like to know how can I achieve the Cargo Collective (javascript?) effect in Webflow?

Example: http://cargocollective.com/sirius

The effect I'm referring to is the navigation through pages. When you click a link and it goes to another page without reloading it.

There are other several examples in their "designs" page -> http://cargocollective.com/designs/

🤞
Thank you,
Aren


#2

Hi @aren,

Amazing, right? Many frameworks already suggest splitting the application content from its logic, which makes for a very straighforward architecture. This is done by using an App Shell. Basically it works like this: Once the App Shell (in this case, the navigation) is loaded, only the necessary content will be loaded from the network. So the App Shell is cached and will never load again. Only your dynamic content will populate the screen.

Your App Shell generally will only contain what it takes to take your website off the ground, like UI elements and the core components necessary, but will not contain your content. It makes the most sense when you have static elements like a navbar with relatively unchanging behaviour but constantly changing content.

Totally doable in webflow!

Get started here. Or use a framework like Ionic if you are lame :joy:

Best,
Karl-Heinrich


#3

Hi Karl, thanks for the quick reply.

Is there any tutorial/guide on how to do this in Webflow though? I'm terrible at coding :see_no_evil:
Hence, using Webflow :blush:


#4

Hi aren,

Unfortunately, I am not aware of any way you could sneakily skip a little bit of coding haha :joy:
Im curious, would you be willing to pay for a service that does this for you?

Best,
Karl-Heinrich


#5

You can do it in Webflow by using different layers / custom overlay in dynamic items, then use custom JS to change the history item when an action is performed to show/hide the overlay.