CODEWITHSUNDEEP
javascriptphpcodeignitertinymce
Kevinvhengst
Kevinvhengst

Reputation: 1702

Implementing Tinymce in my CodeIgniter app

So I'm creating a simple CMS for my own use. So obviously i want to use Tinymce for my text editing. Im trying to implement it in a simple view, but it return nothing. No errors in the console, but it doesn't load Tinymce.

I followed this simple CI guide:

https://github.com/EllisLab/CodeIgniter/wiki/TinyMCE

So this is my simple view:

<html>
<head>
<title>TEST</title>
<script type="text/javascript" src='<?php echo asset_url()."js/jquery.js" ?>'></script>
<script type="text/javascript" src='<?php echo asset_url()."js/tiny_mce/tiny_mce.js" ?>'>
    tinyMCE.init({
        theme : "advanced",
        mode : "textareas",
        plugins : "imagemanager,filemanager,insertdatetime,preview,emotions,visualchars,nonbreaking",
        theme_advanced_buttons1_add: 'insertimage,insertfile',
        theme_advanced_buttons2_add: 'separator,forecolor,backcolor',
        theme_advanced_buttons3_add: 'emotions,insertdate,inserttime,preview,visualchars,nonbreaking',
        theme_advanced_disable: "styleselect,formatselect,removeformat",
        plugin_insertdate_dateFormat : "%Y-%m-%d",
        plugin_insertdate_timeFormat : "%H:%M:%S",
        theme_advanced_toolbar_align : "left",
        theme_advanced_resize_horizontal : false,
        theme_advanced_resizing : true,
        apply_source_formatting : true,
        spellchecker_languages : "+English=en",
        extended_valid_elements :"img[src|border=0|alt|title|width|height|align|name],"
        +"a[href|target|name|title],"
        +"p,"
        invalid_elements: "table,span,tr,td,tbody,font"

    });
</script>

</head>
<body>
<textarea>
    text..
</textarea>
</body>
</html>

Al i see now is the standard textarea, and not the Tinymce editor. Since the console doesn't give me any feedback at all, I'm kinda clueless where to look for the problem.

Anyone has any experience with this?

Upvotes: 0

Views: 5229

Answers (3)

Samithe Adhikari
Samithe Adhikari

Reputation: 131

Simply add this lines to header

<!-- WYSIWYG text editor -->
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<script>tinymce.init({ selector:'textarea' });</script>

Upvotes: 0

Nish
Nish

Reputation: 1137

I added the start tag which was missing. Try now.

<html>
<head>
<title>TEST</title>
<script type="text/javascript" src='<?php echo asset_url()."js/jquery.js" ?>'>  </script>
<script type="text/javascript" src='<?php echo asset_url()."js/tiny_mce/tiny_mce.js" ?>'>
<script>
    tinyMCE.init({
        theme : "advanced",
        mode : "textareas",
        plugins : "imagemanager,filemanager,insertdatetime,preview,emotions,visualchars,nonbreaking",
        theme_advanced_buttons1_add: 'insertimage,insertfile',
        theme_advanced_buttons2_add: 'separator,forecolor,backcolor',
        theme_advanced_buttons3_add: 'emotions,insertdate,inserttime,preview,visualchars,nonbreaking',
        theme_advanced_disable: "styleselect,formatselect,removeformat",
        plugin_insertdate_dateFormat : "%Y-%m-%d",
        plugin_insertdate_timeFormat : "%H:%M:%S",
        theme_advanced_toolbar_align : "left",
        theme_advanced_resize_horizontal : false,
        theme_advanced_resizing : true,
        apply_source_formatting : true,
        spellchecker_languages : "+English=en",
        extended_valid_elements :"img[src|border=0|alt|title|width|height|align|name],"
        +"a[href|target|name|title],"
        +"p,"
        invalid_elements: "table,span,tr,td,tbody,font"

    });
</script>

</head>
<body>
<textarea>
    text..
</textarea>
</body>
</html>

Upvotes: 0

jalansesama
jalansesama

Reputation: 101

Use this script to change your textarea for tinymce:

$(document).ready(function() {
    tinymce.init({
            selector: "textarea",
            plugins: [
                "advlist autolink lists link image charmap print preview anchor",
                "searchreplace visualblocks code fullscreen",
                "insertdatetime media table contextmenu paste"
            ],
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | fontselect fontsizeselect",
            fontsize_formats: "8pt 10pt 12pt 14pt 18pt 24pt 36pt"
        });

    });

I hope it helps

Upvotes: 1

Related Questions