Create a template for portfolio page with consistent items, while allow customization below

Ask the community
, ,
1

Question:
[How do I create portfolio / project detail pages that have the same design layout on the top with respective hero, title, description to each project; but then underneath add whatever I want in any form of layout?

Product:
[Wix Studio Editor.]

2

As you want different content below then dynamic pages can only be used if you use some code. So the other way is like you say - build a template page and then edit it to suit each project.

3

Who you happen to know of a tutorial video where I can see how to do this?

4

I made a video a while back on doing something like this on dynamic pages by collapsing/expanding pages based on what content you have which allows you some flexibility on how you want to layout content or decide what is/isn’t displayed.

You could extend this to collapse sections and decide which sections you want to display. The code and sites are in the links in the video but the code is here:

$w.onReady(() => {
    $w("#dynamicDataset").onReady(() => {
  // Gets the current item properties and stores them in a variable called item
        const item = $w("#dynamicDataset").getCurrentItem();
        // Checks if the current item has a value in the "video" field
        if (!item.video) {
        // Collapses the video player if there is no value for "video"
            $w("#videoBox1").collapse();
        }
        if (!item.photo) {
        // Collapses the image if there is no value for "photo"
            $w("#imageX2").collapse();
        }
        if (!item.document) {
        // Collapses the button if there is no value for "document"
            $w("#button3").collapse();
        }
        if (!item.email) {
        // Collapses the text field if there is no value for "email"
            $w("#text18").collapse();
        }
        if (item.boolean) {
        // Collapses the section if there IS a value for "Hide Section"
            $w("#section14").collapse();
        }
    });
});
2 Likes
5

Thank you all for your responses and the video. Much appreciated.

1 Like