How to load css link into the head tag?
Question
Hello, First of all, thanks for contributing such an amazing js framework. I am very new to grapesjs. And github too.
canvas: {
scripts: ['https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js']
}
https://github.com/artf/grapesjs/wiki/Components-&-JS#template-related According to grapesjs wiki, I load js links inside the canvas as the above codes and it works fine.
But when I try with css links like this, it doesn't work.
canvas: {
links : ['https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css']
}
Some people here suggest to add those CSS links directly under the id="gjs". I did it but what happen is if I clean the canvas, it also clean my css links and CSS doesn't work anymore. My question is how can I load CSS link into the head tag?
Answers (3)
You were almost there :)
canvas: {
styles: ['https://...']
}
Thank you so much @artf , it works like a charm.
You have to include separately while rendering, it won't come in getHtml() or anything.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1739
How to load dynamic CSS style(Not Link) into the Canvas head
Hi, First of all thanks for your great Work !!!!! I am trying to load a dynamic style into the canvas head. Is there any way to load dynami...
Issue #1113
[QUESTIONS] New trait type is not working with rendered components?
Hello, thanks for the great framework. I'm trying to apply this to my project. I want to add a new trait for existing LINK '<a>' component....
Issue #1742
How to load local css in to canvas of grapesjs editor in React ? Css path is not taking
WARNING READ and FOLLOW next 5 steps, then REMOVE them before posting the issueFollow CONTRIBUTING Guidelines https://github.com/artf/grape...
Issue #1991
[QUESTIONS] resizable, using unitWidth in px output into percent.
Hi @artf, Thanks for making this amazing framework. Recently I made a custom component based on your flexbox plugin. The red arrow is the a...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.