Integrating TinyMCE WYSIWYG in AnchorCMS 0.9.2

[the text is translated into google translate]

 

Hello everyone, today I will tell you how to integrate TinyMCE WYSIWYG visual editor in AnchorCMS 0.9.2

I will do this via the command line, but with an explanation.

In my example will be two dialog boxes for short and full news. I feel so comfortable, the essence of this will not change.

There are two methods of integration, very easy and very simple.

I consider the options with the installation in the admin panel AnchorCMS, in the Add / Remove posts.

But first, we define where files are stored, we will edit?

pwd
/home/admin/web/domain.ltd/public_html/anchor/views/posts

We are interested in two files:

-rw-r--r-- 1 root root 5281 Янв 6 21:28 add.php
-rw-r--r-- 1 root root 4223 Янв 6 05:59 edit.php

Open both files one by one and delete the following code:

<script>
$('textarea[name=html]').editor();
</script>

and

<?php echo $editor; ?>

Preparing for a very simple installation is complete.

Open the file and edit .php add.php

We find there the code

<?php echo Form::textarea('html', Input::previous('html'), array(
'placeholder' => __('posts.content_explain')
)); ?>

and paste the above code:

<!-- CDN hosted by Cachefly -->
<script src="//tinymce.cachefly.net/4.1/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: "textarea",
theme: "modern",
plugins: [
"advlist autolink lists link image charmap print preview hr anchor pagebreak",
"searchreplace wordcount visualblocks visualchars code fullscreen",
"insertdatetime media nonbreaking save table contextmenu directionality",
"emoticons template paste textcolor colorpicker textpattern"
],
toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
toolbar2: "print preview media | forecolor backcolor emoticons",
image_advtab: true,
templates: [
{title: 'Test template 1', content: 'Test 1'},
{title: 'Test template 2', content: 'Test 2'}
]
 
});
</script>

All textarea miraculously transformed into a visual editor.

The second variant, when the script files will be based on our server.

Navigate to the folder

# pwd
/home/admin/web/domain.ltd/public_html/anchor/plugins/

Create a folder tiny — our plugin folder.

Download to her archive with TinyMCE WYSIWYG editor from the official site

http://www.tinymce.com/download/download.php

We need
TinyMCE 4.1.7
Contains all you need for production usage.

Console so:

wget http://download.moxiecode.com/tinymce/tinymce_4.1.7.zip

Next

unzip tinymce_4.1.7.zip

We get:

#ls -la
drwxr-xr-x 3 root root 4096 Янв 6 21:15 tinymce
-rw-r--r-- 1 root root 302675 Ноя 27 16:26 tinymce_4.1.7.zip

If you do not root / ssh accesses can be done via FTP, or your hosting control panel.

Once again, we need to make changes in add.php and edit.php

We find there the code

<?php echo Form::textarea('html', Input::previous('html'), array(
'placeholder' => __('posts.content_explain')
)); ?>

and paste the above code:

<script type="text/javascript" src="/anchor/plugins/tiny/tinymce/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: "textarea",
theme: "modern",
plugins: [
"advlist autolink lists link image charmap print preview hr anchor pagebreak",
"searchreplace wordcount visualblocks visualchars code fullscreen",
"insertdatetime media nonbreaking save table contextmenu directionality",
"emoticons template paste textcolor colorpicker textpattern"
],
toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
toolbar2: "print preview media | forecolor backcolor emoticons",
image_advtab: true,
templates: [
{title: 'Test template 1', content: 'Test 1'},
{title: 'Test template 2', content: 'Test 2'}
]
 
});
</script>

Installation is complete. All textarea converted into WYSIWYG editor.

The same can be done with a form to add pages, and forms commenting using it for a simplified version of the form. Have questions, please write in comments!

PS

Bug №1: Disable Markdown / Disable Markdown . Should be corrected, or on the site will not display the script code ….

Bug №2: Textarea Bug default will not appear in admin when you add a post / page scripts, such that described above.

 

[the text is translated into google translate]

Светозар

Основатель блога kolesnikov.pw, увлекаюсь свободным ПО и операционной системой Linux(Fedora/Arch). В качестве основной ОС сейчас использую Arhc Linux с XFCE. Кроме Linux интересуюсь разработкой WEB сайтов и страйкболом(Airsoft).

Leave a reply
Captcha Click on image to update the captcha .