Prestashop Customizing tinyMCE Code "backlighttinymcecode" module for tinyMCE editor
Come back
26

Prestashop Customizing tinyMCE Code "backlighttinymcecode" module for tinyMCE editor

The module can be found under the link to the prestashop website:

https://addons.prestashop.com/ru/administrative-tools/46854--tinymce-.html

[info about files]

I am showing a video example of how the module works:

Description

You can edit the page description using a text code editor by submitting the html code in a convenient format. Using two editors to choose from and possible settings, that's all for tinyMCE editor, in which you write html code.

The module is compatible with prestashop versions from 1.5 to 1.7.7.8.

At the bottom of the images are two editors that can be used in descriptions:

1) Ace Editor

Ace Editor

2) CodeMirror Editor

CodeMirror Editor

Exactly who uses the tinyMCE description as editing the description in the form of html, then this editor module with the output of good and convenient html is more suitable for you, because you may have everything in a simple text format. Using this module, you can compose more complex content on the description page.

When you write the description and edit the html code, then you do not have to copy the code to other editors to fix any errors, a built-in html editor for tinyMCE has been specially made for you, so that you can immediately edit the html code without any additional installed programs.

The editor itself opens when you click on the edit description in html:

Editing the description in html

Below I show a comparison of how it was and how it became, with the output of the editor:

Comparison with editor output
Settings

The editor itself contains the basic settings:

  • Choosing a theme that suits you best;
  • Set the font size of the text;
  • Set the size of the window that will be displayed during code editing;
  • Set or remove line numbering on the left side of the editor;
  • Enable or disable emmet events for faster coding. For example, you write the phrase div and immediately press Tab and there will be a ready-made writing of the tag;
  • Enable or disable code formatting, works if there is a selected code and press "Ctrl + Tab";
  • Enable or disable auto formatting of the code, fires 1 time only when the window with the code is opened;
  • Disable the selected theme, while maintaining the settings of the selected theme;
  • Enabling hotkey tooltips in the editor for writing code. Tooltips are displayed on mouse hover;

    That is, it is displayed like this:

    Quick tips for working with the editor
Additionally!
If the cursor is in the area of the code section and press f11 or Esc, the editor will display full screen editing mode. Otherwise, if you press f11 or Esc will return to its original state.
Here I write module changes ;)
In version 1.0.1:
  • - Modified _PS_BASE_URL_ on _PS_BASE_URL_SSL_ in file configTMC.php - for sites with https
✌ If you need this product, please send me an inquiry. 🙂 💬
(I will answer your mail)
License:
AFL 3.0
created:
14.01.2021
updated:
17.11.2022
author:
admin
Tags
yandex metrika