Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Question] How to disable editing on fetched content #336

Closed
DwolinH opened this issue Sep 26, 2017 · 4 comments
Closed

[Question] How to disable editing on fetched content #336

DwolinH opened this issue Sep 26, 2017 · 4 comments
Labels

Comments

@DwolinH
Copy link

DwolinH commented Sep 26, 2017

Hi,
i want to integrate your project into an existing webpage as a kind of CMS-editor. It is necessary for the editor to wrap the whole body of the page, but i want only parts of the fetched content to be editable. The website header, sidebar and footer should be unchangeable.

Is there an option to differentiate between the editors container and the editable elements?

example markup:

<body>
   <header>...</header>
   <div id="content-wrapper">
      <div id="content" class="editable">...</div>
      <aside id="sidebar">...</div>
   </div>
   <footer>...</footer>
</body>
@artf
Copy link
Member

artf commented Sep 26, 2017

All components are editable by default, you can change their properties with data-gjs-* attributes

<header data-gjs-editable="false" data-gjs-removable="false" ...>...</header>

To get more about components check here

@artf artf closed this as completed Sep 26, 2017
@DwolinH
Copy link
Author

DwolinH commented Sep 26, 2017

That is not really feasible to rewrite thousands of files/ HTML-tags.

Maybe it is better to set components attributes to false after editor.init() and find a way to enable it on specific areas?

screenshot_editor
only the blue box needs to be editable.

@artf
Copy link
Member

artf commented Sep 26, 2017

Probably the easiest way is to update all components

const updateComp = (component) => {
    if (/* is not editable */) {
        component.set({
            removable: false,
                ...
            })
    }
    component.get('components').each(c => updateComp(c))
}
editor.domComponents.getComponents().each(c => updateComp(c))

@lock
Copy link

lock bot commented Sep 18, 2019

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.

@lock lock bot added the outdated label Sep 18, 2019
@lock lock bot locked as resolved and limited conversation to collaborators Sep 18, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

2 participants