[row_fluid] [span3] [/span3] [span9]

Installation

Here is a brief step by step guide how to install MotoPress Content Editor.

1. First, you need to buy and download Content Editor zip file.

2. Then you should go to your WordPress admin panel, click on “Plugins”, choose “Add new” and click on the “Upload” tab.

ce-installation

3. After uploading you’ll be taken to the activate plugin page where you should press “Activate Plugin”. You won’t have difficulties to install it as Content Editor works with any WP theme.

4. Now you have installed the plugin. Pull up your computer and start working with it.

How MotoPress Content Editor works

Looking for the appropriate tag in a WordPress admin panel can sometimes feel like you are searching for edelweiss in high mountains. For that reason we’ve decided to share this overview that explains how Content Editor works.

Using MotoPress content elements

MotoPress Content Editor is a very handy tool to edit an article. You can easily arrange your post simply by dragging and dropping elements to the working area.

ce-using-elements

Adding content

By using built-in elements you are able to organize your content. Just click “T” icon at the left to create a title, paragraph or simply add new text.

ce-adding-elements

Then drag the chosen object to to the exact place where you want to see this element. Make sure you transfer it to the the highlighted area and fill it with tex.

When you define the location you can arrange your text in the most proper for you way. By using the editor panel which is above the content field you are able to organize your content with ease:

  • Edit the format of the text
  • Make title and headings large or bold
  • Choose the right font, modify its size and color
  • Set the text style by choosing the text alignment.
  • Insert space after paragraphs
  • Create bulleted and numbered lists
  • Insert links to your text

The main advantage of the MotoPress Content Editor it the opportunity to see how the final arrangement of the text will look like right in the working area.

ce-adding-text

Adding media

Thanks to MotoPress darg and drop navigation it’s really easy to add not only text but also image, video, slider and even buttons. You need a few mouse clicks to create the desired look of your post.

By clicking “Image” icon in the left column you can quickly edit your post page appearance. A simple interface will appear allowing you to add picture or slider you would like your blog readers to see.

ce-adding-media

You may upload images from the Media Library or embed media from your personal computer. Right in the working field you can modify settings that apply to the image. The editor makes possible to link a picture to the exact page and set the image alignment.

ce-adding-media-parameters

MotoPress content builder turns the editing into an easy and engaging process of page creation. In such a simple way as we’ve featured above users are able to create any page appearance they want without touching a single line of code.

Adding default WP widgets

We’ve also prepared really great news for WP lovers! If you need default WordPress widgets they are here for you. You can use all of them when works with Content Editor.

ce-adding-wp-widgets

Extend Content Editor

MotoPress Content Editor provides the ability to extend its library of visual objects with your own shortcodes. You can add your custom shortcodes to MotoPress Content Editor library or remove existing ones within the functions.php file of your theme or in your plugin.

To start and retrieve the library with existing visual objects you can use mp_library hook.

add_action('mp_library', 'your_function_name', 10, 1);
// Create function with required input parameter - $motopressCELibrary
function your_function_name($motopressCELibrary) {
	// all magic happens here
}

Adding an object

To add your shortcode to MotoPress Content Editor interface you need to “describe” it first. To do that, create an instance of MPCEObject like this:

$youShortcodeObj = new MPCEObject( $id, $name, $icon, $attributes, $closeType, $resize );

Object parameters

$id
(string) (required) The $id should match with your shortcode tag name.
Default: None

$name
(string) (required) Specifies the name of the object in the MotoPress Content Editor interface.
Default: None

$icon
(string) (required) path to the object icon within the wp-content folder.
Default: empty string

$attributes
(array) (required) Multidimensional associative array, where keys are your shortcode attributes and values are associated visual controls.

Visual control parameters

  • type (string) (required) The type of visual control

    • text – a simple input field
    • longtext – a simple textarea field
    • longtext64 – a textarea field with Base64 encoding
    • image – a button to invoke the Media Library dialog box for selecting an image. Add key ‘autoOpen’ with the value ‘true’ to parameters to open dialog automatically
    • multi-images – a button to invoke the Media Library dialog box for selecting some images. Add key ‘autoOpen’ with the value ‘true’ to parameters to open dialog automatically
    • video – an input field to insert links from Youtube or Vimeo.
    • link – an input field with the ability to call WordPress link dialog.
    • select – a dropdown list with the set of available options
    • checkbox – a simple checkbox
  • label (string) (required) the title of control
  • default (mixed) the default value of control
  • description (string) human friendly description of your control
  • dependency (array) brings dependency logic to controls. An array with parameter=>value format, where

    • parameter (string) (required) another control which will be observed for changes
    • value (mixed) (required) the value to show current control

$closeType
(string) (required) It defines enclosing or self-closing shortcode type. The value should be one of these constants:

  • MPCEObject::SELF_CLOSED – if your shortcode is self-closed.
  • MPCEObject::ENCLOSED – if your shortcode is enclosed.

Default: MPCEObject::SELF_CLOSED
Read more about enclosing & self-closing shortcodes.

$resize
(string) Sets the ability to resize your object. List of the available options:

  • MPCEObject::RESIZE_NONE – doesn’t allow to resize
  • MPCEObject::RESIZE_HORIZONTAL – allows to resize horizontally
  • MPCEObject::RESIZE_VERTICAL – allows to resize vertically
  • MPCEObject::RESIZE_ALL – allows to resize horizontally and vertically

Default: MPCEObject::RESIZE_HORIZONTAL

When your shortcode is completely described you can add it to the one of available groups within the addObject method.

$motopressCELibrary->addObject($youShortcodeObj, $group = 'other');

List of available groups:

  • text
  • image
  • button
  • media
  • other
  • wordpress

Removing an object

You can remove visual object from MotoPress Content Editor within the removeObject method.

// Create function with required input parameter - $motopressCELibrary
function your_function_name_for_remove($motopressCELibrary) {
    // remove any object you want
    $motopressCELibrary->removeObject('mp_video');
}
// Hook up your function to 'mp_library' hook
add_action('mp_library', 'your_function_name_for_remove', 10, 1);

Download an example

Download a sample plugin and add your own shortcodes to MotoPress Content Editor or create the new one. This example completely describes how to extend the plugin library and is useful for debugging.
 
[button text=”Download MotoPress library API demo plugin” link=”http://www.getmotopress.com/files/motopress-content-editor-library-api-example.zip” style=”primary” size=”large” target=”_blank”]

Want to learn more?

To get more data about MotoPress Content Editor take a look at our official MotoPress blog.

 

[/span9] [/row_fluid]

Law Offices of Tess Reutzel