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?

How can I set up multiple forms on a landing page in Webflow without creating new columns?

How can I configure the slugs correctly in Webflow to nest my blog articles within the corresponding web page?

Is webflow's default CMS able to keep sensitive information private when using a unique login page and submitting contract details and supporting files?

How can I create a CMS powered wine list with a structure like the example provided using Webflow?

How do I add additional pages to a project in Webflow?

Does anyone know a solution or thread to reference in regards to CMS items not showing properly on Google Chrome in Webflow?

Can Webflow's CMS Collections be used to display alternating full-screen and side-by-side images, with the ability to control the layout per item and per page?

Can I use two different templates on one Webflow plan to set up both a main website and a job board installation on separate folders of the same domain?

Is it possible in Webflow to filter CMS items based on the URL parameters?

Are there any website building platforms, like Webflow, that allow visitors to register, create a company within their account, and have it displayed in a company directory with customizable profile pages and additional features like rating and watchlist options?