Change block on export
Question
i want change my view but not on export
for sample i added this code
blockManager.add('products', {
label: 'products',
content: '
<ul>
{% for product in products %}
<li>{{ product.name }}</li>
{% endfor %}
</ul>
',
});
and now i want show this code on view
blockManager.add('products', {
label: 'products',
content: '
<ul>
<li>car</li> <!-- fake data for show on view -->
<li>train</li> <!-- fake data for show on view -->
</ul>
',
});
how can i take this action ?
Answers (2)
I'd make a custom component to handle such a case.
domc.addType('data-list', {
model: ...
defaults: () => ({
...
list: []
}),
view: ...
render() {
...
const list = this.model.get('list');
const content = this.el.innerHTML;
// interpolate / use some template engine
}
});
blockManager.add('products', {
label: 'products',
content: `
<ul gjs-data-type="data-list" gjs-data-list="[{...}, {...}]">
{% for product in products %}
<li>{{ product.name }}</li>
{% endfor %}
</ul>
`,
});
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.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1565
Issue to create a "2 columns" block
Hi, Have a new problem, i'm following the tuto and i want to create the block "2 columns" (or more). I try to use (and understand, that's w...
Issue #1733
How to remove script tag which is added by add block manager script
Hello @artf I want to export final/production based html content excluding the script(Only which is added by block manager). Suppose i am a...
Issue #1471
[Question] Blockmanager and Image
Hi! I use this code to add a new block: blockManager.add("image", { label: 'Image', category: 'Basic', attributes: { class: "gjs-fonts gjs-...
Issue #493
[QUESTION] Can i set content dynamically from block API ?
Hi @artf , very great web builder framework and keep it up :+1: code : As you can see, can i make tag dynamically from my backend? i use EJ...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Related tutorials
In-depth guides on the same topic.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.