Can't paste video in summernote js
Here's my summernote configuration
$('.summernote-block').summernote({
height: 250,
focus: true,
toolbar: [
// [groupName, [list of button]]
['insert', ['link', 'picture','videoAttributes','media', 'video', 'table', 'hr']],
['style', ['bold', 'italic', 'underline','style']],
['fontsize', ['fontsize']],
['color', ['color']],
['para', ['style', 'ul', 'ol', 'paragraph']],
['height', ['height']],
['view', ['fullscreen']]
],
popover: {
airMode: true,
image: [
['imagesize', ['imageSize100', 'imageSize50', 'imageSize25']],
['float', ['floatLeft', 'floatRight', 'floatNone']],
['remove', ['removeMedia']]
],
video: [
['providers', ['YouTube', 'Vimeo', 'Vine', 'Instagram', 'DailyMotion', 'Youku']]
],
link: [
['link', ['linkDialogShow', 'unlink']]
],
air: [
['color', ['color']],
['font', ['bold', 'underline', 'clear']],
['para', ['ul', 'paragraph']],
['table', ['table']],
['insert', ['link', 'picture','video']]
]
}
});
WHat I include in head tag of html file.
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700,200" rel="stylesheet" />
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
<!-- CSS Files -->
<link href="../assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="../assets/css/now-ui-dashboard.css?v=1.1.0" rel="stylesheet" />
<!-- CSS Just for demo purpose, don't include it in your project -->
<!-- <link href="../assets/demo/demo.css" rel="stylesheet" /> -->
<link href="../assets/js/plugins/summernote/summernote-bs4.css" rel="stylesheet">
Also in the bottom before the closing body
<script src="../assets/js/core/jquery.min.js"></script>
<script src="../assets/js/core/popper.min.js"></script>
<script src="../assets/js/core/bootstrap.min.js"></script>
// <script src="../assets/js/plugins/perfect-scrollbar.jquery.min.js"></script>
<!-- include summernote css/js -->
<script src="../assets/js/plugins/summernote/summernote-bs4.min.js"></script>
<!-- Google Maps Plugin -->
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
<!-- Chart JS -->
<script src="../assets/js/plugins/chartjs.min.js"></script>
<!-- Notifications Plugin -->
<script src="../assets/js/plugins/bootstrap-notify.js"></script>
<!-- Control Center for Now Ui Dashboard: parallax effects, scripts for the example pages etc -->
<script src="../assets/js/now-ui-dashboard.min.js?v=1.1.0" type="text/javascript"></script>
<!-- Now Ui Dashboard DEMO methods, don't include it in your project! -->
<script src="../assets/demo/demo.js"></script>
<script>
$(document).ready(function() {
// Javascript method's body can be found in assets/js/demos.js
demo.initGoogleMaps();
});
</script>
WHat I tried to do.
1.I try to replace summernote include script
tag with other script's except bootstrap
popper
or jQuery
2.T try to use simple configuration of summernote I remove all configuration and paste this code below
$(document).ready(function() {
$('#summernote').summernote();
});
3.I try to use some of video plugins in summernote.
Also in codepen I saw many example's which paste video without any configuration and the including same file's like in my situation and it work's perfectly.
Please heeeelp.
While attempting to insert the video, do you see any errors in the console (press F12 to open devtools)? Do you have any adblock software that might be interfering or a proxy that blocks youtube?
I guess you are running this locally, are you able to move your code to a public web server to test? Here are some posts related to the error you see, maybe they'll help...
File URL "Not allowed to load local resource" in the Internet Browser
Cannot open local file - Chrome: Not allowed to load local resource