Grapesjs: Question: How to use same CSS for Multiple pages

Created on 1 Aug 2018  路  4Comments  路  Source: artf/grapesjs

Hello Grapejs Team,

We've been working on Multi-page Website Builder.

For each project there will be multiple html pages with single common "style.css" page.

I am lazy loading each page with the following function - for handling multiple page loads

loadPage(pageId: string, cssPageId) {
    this.pageService.getEntity(pageId).subscribe(currentpage => {
      this.htmlPage = currentpage;
      this.editor.setComponents(currentpage.content);
    });
    this.pageService.getEntity(cssPageId).subscribe(stylepage => {
      this.cssPage = stylepage;
      this.editor.setStyle(stylepage.content);
    });
  }

The above page loads the page properly however, if page is empty or different from previous page it removes certain CSS classes. It's not perfectly loading the entire css file.

Am I missing something?

How can I have a common CSS file? Whether there is any workaround. Please help me with this issue.

Thanks for your great work and support :)

outdated

Most helpful comment

This should work.
var editor = grapesjs.init({ keepUnusedStyles: true, ... });

All 4 comments

This should work.
var editor = grapesjs.init({ keepUnusedStyles: true, ... });

@cjpollard Thank you very much :) It's working. You saved my time...

@inventorbit next time, if someone solves your issue, close it

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

tribulant picture tribulant  路  3Comments

crazyxhz picture crazyxhz  路  3Comments

ionic666 picture ionic666  路  3Comments

alibouaziz picture alibouaziz  路  3Comments

adam-gpc picture adam-gpc  路  3Comments