TinyMCE jQuery (4.1.x) を、ざっくりと導入

ざっくりとTinyMCEを導入する方法を記述する。

まずは、ココでTinyMCE4.1.6 jQuery packageをダウンロード。

落とした物を解凍し、任意のサイトのjsフォルダに、解凍したjsフォルダの中のtynymceフォルダをまるっとコピー

こんな感じかな。
*なんか！ついてるけど、NetBenseのツリーなので気にしないで。
*scssは、前回の記事の名残だからこれも気にしないで。

そして、index.htmlはこんな感じ。

<!DOCTYPE html>
<html>
    <head>
        <title>LaboLabo</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load("jquery", "1");
            google.load("jqueryui", "1");
        </script>
        <script type="text/javascript" src="js/tinymce/tinymce.min.js"></script>
        <script type="text/javascript">
            $(function(){
                tinyMCE.init({
                    selector:"textarea"
                });
            });
        </script>
    </head>
    
    <body>                  
        <form method="post" action="somepage">
            <textarea>
            </textarea>
        </form>
    </body>
</html>

<!DOCTYPE html>

<html>

<head>

<title>LaboLabo</title>

google.load("jquery", "1");

google.load("jqueryui", "1");

</script>

$(function(){

tinyMCE.init({

selector:"textarea"

});

</script>

</head>

<body>

</textarea>

</form>

</body>

</html>

これで、とりあえず最低限のWYSIWYGができる。

以上。

Leave a Reply Cancel Reply