Edit chunks and snippets by selecting their tags
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
_build
assets/components/tagelementplugin
core/components/tagelementplugin
.gitignore
README.md

README.md

tagElementPlugin

A MODx Revolution Plugin that allows to edit chunks and snippets selecting their tags in the content field of resource, chunk, template, snippet or plugin forms. Also you can get the value of some tags that start with "~", "%", "++" and "#".

How it works

Open any resource, chunk or template form where you use chunk or snippet tags (for example [[$myChunk]] or [[mySnippet]]). Select it and press Ctrl+Enter. If the element exists, the quick edit dialog will be opened.

If not you can create it right here.

To go to the element's page press Ctrl+Shift+Enter.

tagElementPlugin can get the value of next tags:

  • [[~1]]
  • [[%lexicon_entry]]
  • [[++system_setting]]
  • [[#1.pagetitle]], [[#SERVER.key]], [[#REQUEST.key]], [[#COOKIE.key]], [[#SESSION.key]] and more.

The last ones will be parsed if pdoParser is used (read about the fastField tags for more information). It gives the great possibilities.

Define an element tag with properties

To form a snippet or a chunk tag with parameters write the element name, select it and press Ctrl+Insert. The "Select element options" dialog with element properties will be opened. Change the required properties and press Save. You'll get the prepared tag. You can specify any custom parameter and any property set. These parameters will be also shown in the options dialog.

Example

Create a new template. Define it structure:

<!DOCTYPE html>
<html lang="ru">
<head>
    [[$head]]
</head>    
<body>
    [[$header]]
    [[$main_menu]]
    [[$gallery]]
    [[$content]]
    [[$footer]]
</body>
</html>

And right on this page create these chunks selecting them one by one.

Customize the shortcuts

Use next system settings to do it:

  • tagelementplugin_quick_editor_keys - a shortcut to open elements in the corresponding quick editing window. By default, Ctrl+Enter.
  • tagelementplugin_quick_chunk_editor_keys - a shortcut to open chunk with the selected text in the quick update dialog. By default, Ctrl+Alt+C.
  • tagelementplugin_chunk_editor_keys - a shortcut to redirect to the chunk update form. By default, Ctrl+Shift+Alt+C.
  • tagelementplugin_element_editor_keys - a shortcut to redirect to the element's page. By default, Ctrl+Shift+Enter.
  • tagelementplugin_element_prop_keys - a shortcut to open the "Select element options" window for the selected snippet or chunk. By default, Ctrl+Ins.

They look like this

{key: Ext.EventObject.ENTER, ctrl: true, shift: false, alt: false}

You can specify a digital key code or use the ExtJs constants.

Support of Fenom file element syntax

Supported tags:

{include 'file:relative/path/to/file'}
{'@FILE relative/path/to/file' | chunk}
{$_modx->runSnippet('@FILE relative/path/to/file', [])}

Select content in quotes (file:relative/path/to/file or @FILE relative/path/to/file) and press Ctrl+Enter or Ctrl+Shift+Enter. Or select only path to the file and press the combination of Ctrl+Shift+F and Ctrl+Enter.

Important

tagElementPlugin does not support rich text editors. It works without any element editor and with Ace.

Documentation (russian).