locked
Summernote fontsize and fontfamily RRS feed

  • Question

  • User355846639 posted

    Hello,

    I am using summernote text editor in my asp.net core project.

    The editor is well displayed and i can write and save, load images....etc.

    the probem is in the font size and font name.

    if i select a size for my text  for example 12, the control seems to be locked after that so i can't change the size again. the same thing hapens for fontfamily, but all the other controls works fine.

    any one has faced this problem?

    Rhank you for any help.

    Sunday, September 29, 2019 5:02 PM

Answers

  • User355846639 posted

    Hello Yongqing Yu,

    Thank you for the replay, i tried your code and this does not work for me, i do not know why. Finally i changed the scripts i used and it worked.

    So for those who had the same problem, this is my code i used first (not worked for me):

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.js"></script>
    <script>
    $('#summernote').summernote({

    });
    </script>

    and this is the code which worked:

    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>

    <script>
    $('#summernote').summernote({

    });
    </script>

    thank you anyway for the help Yongqing Yu.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, October 1, 2019 1:50 AM

All replies

  • User665608656 posted

    Hi marco,

    According to your description, I tested it using the online summernote text editor, and everything worked well.

    I hope you can confirm that the JS and CSS files you quoted are correct.

    If they are still unresolved, please provide us with the detailed code of summernote text editor, which will help us solve your issue more easily.

    Here is my code:

        <!-- include libraries(jQuery, bootstrap) -->
        <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet" />
        <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
        <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>
    
        <!-- include summernote css/js -->
        <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote.css" rel="stylesheet" />
        <script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote.js"></script>
            <div id="summernote">
                <p>Hello Summernote</p>
            </div>
            <script>
        $(document).ready(function() {
            $('#summernote').summernote();
        });
            </script>

    Here it the result:

    Best Regards,

    YongQing.

    Monday, September 30, 2019 2:17 AM
  • User355846639 posted

    Hello Yongqing Yu,

    Thank you for the replay, i tried your code and this does not work for me, i do not know why. Finally i changed the scripts i used and it worked.

    So for those who had the same problem, this is my code i used first (not worked for me):

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-bs4.js"></script>
    <script>
    $('#summernote').summernote({

    });
    </script>

    and this is the code which worked:

    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>

    <script>
    $('#summernote').summernote({

    });
    </script>

    thank you anyway for the help Yongqing Yu.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Tuesday, October 1, 2019 1:50 AM
  • User355846639 posted

    Hello Yongqing Yu,

    Sorry, but i still have a question. My text editor takes few secondes to display correctly. It starts small then it loads after that correctly.

    is there any reason for that?

    Thank you.

    Thursday, October 3, 2019 1:57 AM