Check with your designers to help you design this section
Check with your designers to help you design this section
If you use the id summernote
, RAUL will automatically instatiate the plugin with
basic options on DOM load.
<div id="summernote"></div>
You can customize and better constrol options by using a different id, or better yet, add a class to the containers you want to load summernote into. Then you would use the API per summernote documentation at https://summernote.org/. For example:
<div class="text-editor"></div>
$('.text-ditor').summernote({
placeholder: 'Enter property description',
tabsize: 2,
minHeight: 100,
})
Summernote relies on Bootstrap 4 and jQuery. Unfortunately these libraries do introduce bulk,
but currently are also part of the hard dependencies for RAUL framework as well. The follwing
is an example of the link
and script
tags.
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
crossorigin="anonymous"
/>
<link href="https://cdn.realpage.com/raul/v2.82.9/css/raul.min.css" rel="stylesheet" />
<link
href="https://cdn.realpage.com/raul/v2.82.9/css/plugins/raul-plugin-summernote.min.css"
rel="stylesheet"
/>
......
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"
></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
crossorigin="anonymous"
></script>
<script src="https://cdn.realpage.com/raul/v2.82.9/js/raul.min.js"></script>
<script
src="https://cdn.realpage.com/raul/v2.82.9/js/plugins/raul-plugin-summernote.min.js"
></script>