- I. DROPEDITOR INSTALL
- II. COMMON FUNCTIONS
- III. ADVANCED EDITION TOOLS
- IV. IMAGE, FILE & TABLE MANAGER
- V. CONTENT AND STYLE
- VI. EDITOR PROFILES
DropEditor is a free text editor for Joomla. Whether you are an occasional or regular content redactor, DropEditor will save you a lot of time with unique inbuilt features.
I. DROPEDITOR INSTALL
Our component is Joomla 3.x compatible. All the features and 3rd party integrations are included in all memberships.
In order to install our component you have to download the extension .zip file and use standard Joomla installer.
1.2 Update & automatic updater
In order to update the extension you can install a new version over the old one by downloading the ZIP file from JoomUnited or use the automatic updater (recommended).
The automatic updater, which push the update notification, is embedded in the Joomla extension you've installed. So you'll get notified like any other extension in the dashboard or using the menu: Extension > Manage > Update menu.
Login to your account to update
You need to login to your JoomUnited account to update all your JoomUnited Joomla extensions. In order to login access the main configuration of the component then click on the Live update tab. At the bottom, you'll find a login button.
Enter your JoomUnited credentials, the same you use to login here @ www.joomunited.com
The button will turn orange, congrats! you can now update all the JoomUnited extensions on this website! If your membership is expired you'll get a renew link and a text that explain that.
1.3 Activate the editor
To use DropEditor you need to set it as default in Joomla global configuration > Site tab, set DropEditor as default
II. COMMON FUNCTIONS
2.1 Classic edition tools
The main idea of DropEditor is to bring advanced tools for recurring tasks of edition in order to save you the maximum amount of time.
DropEditor default setup is quite simple, you have 3 lines of tools, the first line is dedicated to manage images, files and if the table manager is installed, tables (Droptables).
The 2 other lines are dedicated to layout and content management.
The first set of this second line of tool are in order:
- Set editor in full screen mode, to go back, click on escape or click back on the button
- Cancel/Repeat latest action, when content is saved those tools are disabled because has been sent to the database
- Align and justify the text
- Bullet list: an advanced tool we’ll see in details
- Bold / Italic / Underline: just select some text and apply new format
- Special characters, with preview available
Latest tools (column, button, summary, and template, source, style, format, links) are advanced and will be seen in details bellow.
III. ADVANCED EDITION TOOLS
3.1 Bullet list
The bullet list is not just a basic list, you’ll be able to create your own bullet list style, store it and reuse it later. Usually styles are defined in your template and should be reused all over your website.
The button will open a dialog box.
On the left part you can set icon and style of your bullet list, a preview is available on the right part.
If you insert your list directly in your content with Insert button, without saving you’ll “lose” your style (not saved).
The save button will store bullet list in the database and you will be able to edit it later. To edit a bullet you have the option to click on the pen inside the lightbox. Plus button will insert the list and trash will delete it.
You can also use the right click right on your content.
3.2 Column manager
The column manager is a tool to create a column layout in your content. Clicking on the button will show a menu with quick column layout selection.
- 2 columns
- 3 columns
- 4 columns
- 1/4 - 3/4 layout
- 3/4 - 1/4 layout
Here is an example of a 3 columns layout quick link insertion in an article.
It’s also possible to define a custom layout for your columns with the Custom button.
Columns can be created by using drag’n drop to create or delete it. Then, you can set custom sizes for each column. Finally click on Insert button to add your layout to your article.
A green menu list is here to reset your layout and apply a predefined one.
3.3 Button editor
The button manager will allow you to create your own button style, store it and reuse it later. Usually buttons are defined in your template and should be reused all over your website.
The button editor is quite similar to the Bullet list interface, you’ll be able to create a style using the left side window tool then Insert/Save/Edit it.
You have option to define background, border styles and mouse hover effect. To insert a button into content, you have option to click on Insert button or + symbol of a saved button.
You can also edit and save an existing style, just click on the pen and change parameters or do a right click in the editor.
Finally you can define a custom link for the button or make a quick link to a menu or an article.
3.4 Article summary
The summary tool can generate an automatic summary of all your content based on titles in your content. You can also update automatically summary.
To use it, add titles in your article then click on the summary tool.
A summary will be added with anchor to your content. You can also update it with a right click to regenerate it.
3.5 Template tool
The template tool will let you save all the layout of your content (HTML structure) in order to load it later.
Click on the button to save/load a layout.
You can define a template name, save it. To load a template click on his name on the bottom zone.
3.6 Link manager
A link manager is available with an interface that allows you to make quick links to Joomla content, article and menus
In the dialog box you have option to make link to custom URL or load a Joomla content. Just select a content, the URL will be generated and click on Insert button.
3.7 Anchor tool
A simple anchor tool to load a page in a particular point is also available.
You can add an anchor name, then validate
An anchor will be added in your content.
Then to make a link to this anchor, just select some text, click back on the anchor tool button and select the anchor previously created.
3.8 Google font
First, you need to enable Google font parameter in Editor tools tab. Next, click View google font button, then select fonts will be appeared in editor.
Finally, you will see the fonts in editor tool.
3.9 Insert Media
After that, a popup window appears, you can add the link at Youtube or Vimeo tab. Then click Insert button.
Moreover, you can pick a video or sound file from your server at Video or Sound tab.
3.10 Non-breakable spaces
IV. IMAGE, FILE & TABLE MANAGER
4.1 Droppics image manager
Droppics is a Joomla component used to manage image and galleries, more information available here: https://www.joomunited.com/products/droppics
A light version of the extension is integrated in the editor, in case you purchase the full version the tool will be upgraded with gallery management, themes...
The Droppics extension will make image upload and insertion easy. Click on the select button to upload single or multiple images. Click on an uploaded image to edit options and on the green button to insert the image in your content
You can choose to add thumbnails or original size of the picture.
A link manager is also available to make quick links to custom URL, menu or article.
Image added in content as thumbnail:
Note that in Droppics you have an image importer to import existing images, you can enable it from the Droppics component parameter.
You can select a server folder then click on the import button.
4.2 Dropfiles files manager
Dropfiles is a Joomla component used to manage files and categorize them, more information available here:
A light version of the extension is integrated in the editor, in case you purchase the full version the tool will be upgraded with file category management, themes...
In the Dropfiles lightbox you’ll be able to upload files, edit file title and description and insert the file in your editor.
File in content on frontend.
4.3 Droptables – tables manager
Droptables is a Joomla table manager that uses spreadsheet interface from your editor, more information available here: https://www.joomunited.com/products/droptables
If you purchase a version the tool will be available in your editor.
V. CONTENT AND STYLE
The title tool in your editor is here to define all the titles level or go back to a normal paragraph.
Plus in the editor configuration you got additional options to define more levels or override styles. To access to the configuration go in Component > DropEditor > Custom styles
On the left part you can activate up to 6 levels of titles.
On the center part you can set the names of the titles and define a custom style. Those titles styles will override your titles style.
5.2 Custom styles
You can define some custom styles that will be loaded to your user in the style dropdown list.
Some styles are already created and you can edit them, rename styles and class or create your own. All styles are stored in a dedicated .css file.
The name of the style are displayed in the list.
5.3 Source code
A source code edition tool is available.
You’ll have access to the HTML of your article, the source code uses colored syntax display.
VI. EDITOR PROFILES
6.1 Profiles activation
DropEditor allows you to define edition profile that apply for dedicated Joomla user group. To access to the configuration go in Component > DropEditor > Profiles
In the main tab you can make the profile available for particular Joomla user group, for example groups used on Joomla frontend.
You can also restrict the editor usage to particular Joomla component.
6.2 Profiles tools
Each profile have its own tools. Use drag’n drop to activate/remove tools from profile.
6.3 Other tools available
Some tools are also available and not activated by default.
Find and replace: Make a search and replace one or all elements in your editor content.
Remove style tool: make all css inline style disappear
Then you got:
- Paste as text or from Word: there’s an automatic tool when you paste a content inside editor that removes styles
- Select all content
- Preview: open a new tab with Joomla content preview
- Print content
- Line through
- Page break
- Ordered list
- HTML table
- Horizontal line
- Text color
- Background color
6.4 Import - Export Styles/Profiles
You can also import/export your Custom styles or Editor profiles by clicking the Import/Export button on the top right at DropEditor profiles.
After that a popup window appears, so you can choose a file then Run Import or select to export Custom styles or Editor profiles.
Happy editing with DropEditor!