[Question] Can multiple Webpage Builder tabs be opened?

[dilancastillo]

In advance, thank you very much for this powerful tool, I want to comment that I have a website with several html views and access each one from the navbar, can I open several tabs of Webpage Builder to edit each one of these views separately ?

Thank you very much for your attention.

[pouyamiralayi]

Hi @dilancastillo here is how to implement a multi page scenario: #1331 comment Cheers!

[dilancastillo]

@pouyamiralayi thank you very much

[dilancastillo]

hey @pouyamiralayi , I wanted to tell you that I reviewed the comment you recommended and I have a problem, I did a test by placing a simple component but it does not appear on the canvas, how should I put html and css components?

const editor = grapesjs.init({ height: '100%', fromElement: true, showOffsets: 1, noticeOnUnload: 0, allowScripts: 1, container: '#gjs', current: 1, pages: [ { components: [<div><h1>Hola mundo</h1></div>], style: [] }, { components: [], style: [] }, ], plugins: ['gjs-preset-webpage'], pluginsOpts: { 'gjs-preset-webpage': {

        }
    },
    storageManager: {
        id: 'gjs-',
        type: 'local',
        autosave: true,
        autoload: false,
        stepsBeforeSave: 1,
    },
});
const currentPage = pages[currentIndex];
currentPage.components = editor.getComponents();
currentPage.style = editor.getStyle();

const nextPage = pages[nextIndex];
editor.setComponents(nextPage.components);
editor.setStyle(nextPage.style);

[dilancastillo]

I would greatly appreciate your help

[pouyamiralayi]

Hi @dilancastillo the related approach should not be placed in your initialization config. pages object is a proposed data structure which you should consider in your environment, like a window.pages global variable or etc. Take a look at my own implementation which is using localStorage. Cheers!

[dilancastillo]

Hello @pouyamiralayi , your explanation is very helpful and I thank you very much for the support