Issue #1329Opened August 1, 2018by inventorbit4 reactions

Question: How to use same CSS for Multiple pages

Question

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 :)

Answers (3)

cjpollardAugust 1, 20183 reactions

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

artfAugust 2, 20181 reactions

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

inventorbitAugust 1, 20180 reactions

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

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.