Is it possible to create a portfolio site in Webflow where clicking on a project loads the CMS page on the right side without affecting the 'work navigation' on the left side?

Published on

September 22, 2023

Note

CommunityFAQ is not affiliated with Webflow. Click here if you'd like to visit Webflow's help resources.

Yes, it is possible to create a portfolio site in Webflow where clicking on a project loads the CMS page on the right side without affecting the 'work navigation' on the left side. You can achieve this by using dynamic content and interactions in Webflow. Here's a step-by-step guide on how to do it:

Set up your CMS collection:

In the Webflow Designer, go to the Collections panel and create a new collection for your portfolio projects.
Add the necessary fields to your collection, such as project name, description, images, etc.

Design the portfolio page:

Create a new page in Webflow for your portfolio.
Design the left side of the page with your 'work navigation' elements, which should remain fixed and unchanged.
Design the right side of the page where the CMS page will be loaded when a project is clicked.

Add CMS elements:

In the Webflow Designer, drag and drop a CMS collection list onto the right side of the page.
Connect the CMS collection list to your portfolio collection.
Design the layout for each CMS item, including any dynamic content fields you want to display for each project.

Create interactions:

Select the CMS collection list on the right side of the page.
Create an interaction triggered by a click event.
Set the action of the interaction to show/hide the CMS page on the right side.

Connect interactions to CMS pages:

Go to the Navigator panel and select the dynamic template page within your CMS collection.
Set the initial state of the CMS page to hidden.
Connect the interaction created in the previous step to the CMS page.

Customize CMS page:

Design the layout and content of the CMS page, making sure to use dynamic fields to display the project details.
You can also add a back button or navigation to return to the portfolio page.

By following these steps, you can create a portfolio site in Webflow where clicking on a project loads the CMS page on the right side without affecting the 'work navigation' on the left side. This will provide a seamless experience for users, allowing them to view project details without leaving the main portfolio page.

Additional questions:

How do I create a CMS collection in Webflow?
Can I customize the design of CMS pages in Webflow?
Is it possible to filter CMS items on a portfolio site in Webflow?

Is there a way to nest a CMS list within another CMS list in Webflow, specifically for creating a venue list with upcoming events for each venue?

How can I make my CMS blog work on Webflow if CMS and forms cannot be exported?

Is it possible to link checkboxes to an event's collection list in Webflow CMS?

How can I facilitate both receiving form info and sending confirmation emails from forms in Webflow?

What are the pros and cons of using the CMS pagination method in Webflow?

How did the author solve the issue of multiple dynamically generated sliders not working properly on their own in Webflow?

What is the issue with the checkboxes on the "Hitta hit" page in Webflow?

What is the recommended way to implement multiple design layouts for a specific collection in Webflow without hiding unwanted layouts on one page, as it negatively affects SEO? Is there a workaround for implementing a repeating section in a collection without running out of collections when using multi-reference collections?

Can someone help me with why Webflow is not showing the multi image field on my site?

What is a key challenge when creating a client dashboard site in Webflow?