Skip to content

Commit ab096eb

Browse files
author
Dennis Suitters
authored
Merge pull request #1 from summernote/master
Updates from main Repo
2 parents 71c90fe + 0f025aa commit ab096eb

File tree

9 files changed

+340
-97
lines changed

9 files changed

+340
-97
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ _site/
2121

2222
# rbenv
2323
.ruby-version
24+
Gemfile.lock
2425

2526
# macOS
2627
.DS_Store

‎00-getting-started.md

Lines changed: 27 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,8 @@ Include the Following code in the <code>head</code> area of your HTML page.
4444
{% highlight html %}
4545
<!-- include libraries(jQuery, bootstrap) -->
4646
<link href="{{ site.bootstrap_css }}" rel="stylesheet">
47-
<script src="{{ site.jquery_js }}"></script>
48-
<script src="{{ site.bootstrap_js }}"></script>
47+
<script src="{{ site.jquery_js }}"></script>
48+
<script src="{{ site.bootstrap_js }}"></script>
4949

5050
<!-- include summernote css/js -->
5151
<link href="{{ site.summernote_css }}" rel="stylesheet">
@@ -99,8 +99,8 @@ You can also test running example. Save below code as `index.html` and open it w
9999
<meta charset="UTF-8">
100100
<title>Summernote</title>
101101
<link href="{{ site.bootstrap_css }}" rel="stylesheet">
102-
<script src="{{ site.jquery_js }}"></script>
103-
<script src="{{ site.bootstrap_js }}"></script>
102+
<script src="{{ site.jquery_js }}"></script>
103+
<script src="{{ site.bootstrap_js }}"></script>
104104
<link href="{{ site.summernote_css }}" rel="stylesheet">
105105
<script src="{{ site.summernote_js }}"></script>
106106
</head>
@@ -119,63 +119,36 @@ You can also test running example. Save below code as `index.html` and open it w
119119

120120
### For bootstrap 4
121121

122-
You can also use Summernote with Bootstrap 4 using `summernote-bs4.js` and `summernote-bs4.css`. This is also beta version, as Bootstrap 4 is in beta. Below is a code example using bootstrap 4.
122+
You can also use Summernote with Bootstrap 4 using `summernote-bs4.js` and `summernote-bs4.css`.
123123

124-
<iframe src="/bs4.html" width="100%" height="200" frameborder="0"></iframe>
124+
<iframe id="bs4-frame" width="100%" height="200" frameborder="0">
125+
{% include bs4.html %}
126+
</iframe>
127+
<script>
128+
var bs4_frame = document.querySelector('#bs4-frame');
129+
bs4_frame.contentDocument.write(bs4_frame.innerHTML);
130+
bs4_frame.innerHTML = '';
131+
</script>
125132

126133
{% highlight html %}
127-
<!DOCTYPE html>
128-
<html lang="en">
129-
<head>
130-
<meta charset="UTF-8">
131-
<title>bootstrap4</title>
132-
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
133-
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
134-
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
135-
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
136-
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.css" rel="stylesheet">
137-
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.js"></script>
138-
</head>
139-
<body>
140-
<div id="summernote"></div>
141-
<script>
142-
$('#summernote').summernote({
143-
placeholder: 'Hello bootstrap 4',
144-
tabsize: 2,
145-
height: 100
146-
});
147-
</script>
148-
</body>
149-
</html>
134+
{% include bs4.html %}
150135
{% endhighlight %}
151136

152137
### Without Bootstrap
153138

154-
You can use Summernote without Bootstrap using `summernote-lite.js` and `summernote-lite.css`. The Lite version is currently in Beta. Please report bugs so we can improve it. Below is a code example using summernote lite.
139+
You can use Summernote without Bootstrap using `summernote-lite.js` and `summernote-lite.css`.
155140

156-
<iframe src="/lite.html" width="100%" height="200" frameborder="0"></iframe>
141+
<iframe id="lite-frame" width="100%" height="200" frameborder="0">
142+
{% include lite.html %}
143+
</iframe>
144+
<script>
145+
var lite_frame = document.querySelector('#lite-frame');
146+
lite_frame.contentDocument.write(lite_frame.innerHTML);
147+
lite_frame.innerHTML = '';
148+
</script>
157149

158150
{% highlight html %}
159-
<!DOCTYPE html>
160-
<html lang="en">
161-
<head>
162-
<meta charset="UTF-8">
163-
<title>Summernote Lite</title>
164-
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
165-
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">
166-
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>
167-
</head>
168-
<body>
169-
<div id="summernote"></div>
170-
<script>
171-
$('#summernote').summernote({
172-
placeholder: 'Hello stand alone ui',
173-
tabsize: 2,
174-
height: 100
175-
});
176-
</script>
177-
</body>
178-
</html>
151+
{% include lite.html %}
179152
{% endhighlight %}
180153

181154
## Basic API
@@ -261,9 +234,9 @@ for more detail api: [deep dive with api](/deep-dive/#api)
261234
Include libraries with lang file. eg) <code>summernote-ko-KR.js</code>.
262235

263236
{% highlight html %}
264-
<link href="{{ site.bootstrap_css }}" rel="stylesheet">
265-
<script src="{{ site.jquery_js }}"></script>
266-
<script src="{{ site.bootstrap_js }}"></script>
237+
<link href="{{ site.bootstrap_css }}" rel="stylesheet">
238+
<script src="{{ site.jquery_js }}"></script>
239+
<script src="{{ site.bootstrap_js }}"></script>
267240

268241
<link href="summernote.css" rel="stylesheet">
269242
<script src="summernote.min.js"></script>

0 commit comments

Comments
 (0)