Navigation

    Vite Forum
    • Register
    • Login
    • Search
    • Unsolved
    • Solved
    • Recent
    • Tags
    • Popular
    • Groups
    • Github
    1. Home
    2. JerryBels
    • Profile
    • Following
    • Followers
    • Topics
    • Posts
    • Best
    • Groups

    JerryBels

    @JerryBels

    0
    Reputation
    1
    Posts
    1
    Profile views
    0
    Followers
    0
    Following
    Joined Last Online

    JerryBels Follow

    Best posts made by JerryBels

    This user hasn't posted anything yet.

    Latest posts made by JerryBels

    • RE: using tinymcs wysiwig editor

      Hello, you can load the model directly. I also imported a language pack without issues.

      /* Import TinyMCE */
      import tinymce from 'tinymce';
      
      /* Default icons are required for TinyMCE 5.3 or above */
      import 'tinymce/icons/default';
      
      /* A theme is also required */
      import 'tinymce/themes/silver';
      
      /* Import the skin */
      import 'tinymce/skins/ui/oxide/skin.css';
      
      /* Import plugins */
      // import 'tinymce/plugins/advlist';
      // import 'tinymce/plugins/code';
      // import 'tinymce/plugins/emoticons';
      // import 'tinymce/plugins/emoticons/js/emojis';
      import 'tinymce/plugins/image';
      import 'tinymce/plugins/lists';
      import 'tinymce/plugins/table';
      
      /* Import premium plugins */
      /* NOTE: Download separately and add these to /src/plugins */
      /* import './plugins/checklist/plugin'; */
      /* import './plugins/powerpaste/plugin'; */
      /* import './plugins/powerpaste/js/wordimport'; */
      
      /* Import content css - will be built into css file */
      import skinUiCss from 'tinymce/skins/ui/oxide/skin.css';
      import contentUiCss from 'tinymce/skins/ui/oxide/content.css';
      import contentCss from 'tinymce/skins/content/default/content.css';
      
      import 'tinymce/models/dom';
      
      import './tinymce/langs/fr_FR.js';
      
      window.tinymce = tinymce;
      

      Then on wanted pages I import the script and the css like so (using Laravel helpers but whatever, it works the same without) and I init the editor :

      <script src="{{ Vite::asset('resources/js/tinymce.js') }}"></script>
      @vite('resources/js/tinymce.css')
      
      <script>
          tinymce.init({
              selector: 'textarea.richEditor',
              menubar: false,
              height : "90%",
              plugins: 'table lists',
              toolbar: 'undo redo | blocks | bold italic | alignleft aligncenter alignright | indent outdent | bullist numlist | table',
              language: 'fr_FR',
              skin: false,
              content_css: false,
          });
      </script>
      
      posted in Support
      JerryBels
      JerryBels