table of contents · automatically into the manager (firefox & chrome) and if you choose to...

File Manager Add-on Manual DMXzone.com

Copyright © 2011 DMXzone.com All Rights Reserved

To get more go to DMXzone.com

of 36

Table of contents

Table of contents ..................................................................................................................................................................... 1 About File Manager Add-on ................................................................................................................................................. 2 Features in Detail ..................................................................................................................................................................... 3 Tutorial: Setting Up the File Manager Add-on on your Page ........................................................................................ 20 Tutorial: Showing Images Thumbnails in the File Manager ............................................................................................ 27 Video: File Manager Features Overview .......................................................................................................................... 36 With this movie we will show you the main features packed in the File Manager Add-on. .................................. 36 Video: Using File Manager Add-on in the Browser ......................................................................................................... 36 Video: Show thumbnails for the Images in File Manager Add-on ............................................................................... 36




of 36

About File Manager Add-on Manage a complete file library directly in your Advanced HTML Editor 3? It’s now

possible with the File Manager Add-on, which allows you and your users to upload,

delete, rename, download files and folders with a few mouse clicks.

Drag one or many files from your personal folders and drop to upload them

automatically into the manager (Firefox & Chrome) and if you choose to show

thumbnails for the images, the File Manager will generate a small thumbnail preview

server side on the fly.

The File Manager Add-on is fully secured and the file views load mighty fast due to extensive usage of Ajax

technology and CSS Sprites, and the amazing integration with the Advanced HTML Editor 3, which even

matches the skin and style.




of 36

Features in Detail

Great support for images, web/dynamic pages, documents, music, movies, compressed, scripts &

CSS files - You can upload any file to your File Manager in Advanced HTML Editor 3

Allow only specific file types to be shown and managed - You can choose whether to show or hide

files from your users in the File Manager.

http://www.dmxzone.com/go?18424




of 36

Custom Files - You can make your File Manager support any custom file type, by entering it comma

separated.

Ajax based file manager - All file manager actions like uploading, adding new folder, editing and

delete are all done asynchronous trough Ajax, so your manager is super fast and very responsible.

Great Advanced HTML Editor 3 Integration - The File Manager Add-on is fully integrated into the

Advanced HTML Editor 3, with the same beautiful style.





of 36

Fully integrated in the editor style and skin - The skin of the File Manager Add-on always matches the

selected editor skin.




of 36

Full integrated Ajax Multi Upload with Drag & Drop (Firefox and Chrome) - Drag one or many files from

your personal folders and drop to upload them automatically into the manager.




of 36




of 36

Automatic On the Fly Thumbnail Generation - When you choose to show thumbnails for the images,

the File Manager will automatically, on the fly generate a small thumbnail preview server side. So you

don’t have to download the full image. This makes the File Manager thumbnail view very fast!




of 36

Fully Manageable - You can allow the user to manage the files - Add, remove and download files,

create new folders and rename them.




of 36

File Downloads - Next to the upload files in the File Manager you can also chose to download directly

any file from it!




of 36

Edit file names and folders - Once the editing is allowed you can rename the files and folders at any

time.




of 36

Image Info Tooltips - Display more detailed file information.




of 36

Link or Insert files directly in the Adv HTML Editor 3 - With the File Manager, next to managing the files,

you can also select any file and choose if you want to link to it or insert it in the current editor. If you

have selected existing link or image in the editor, it will be edited otherwise new will be inserted.




of 36

Dynamic folders - You can use dynamic data to make dynamic folders.




of 36

CSS Sprites - All preview icons are stored in a CSS Sprite image that makes the File Manager views load

mighty fast as it needs to download just that single, well optimized image.

Great File Views - Chose between detailed, list or thumbnails view.

o Detail View - In the detail files view you have small files icons, last modified information and size.




of 36

o List View - In the list view you have an ordered array of your files.

o Icon View - You can preview your files types with the suitable icon.




of 36

o Thumbnail View - In the thumbnail view you have a large icon for any files type and the image

thumbnails are automatically generated on the fly.

Secure File Manager - The File Manager Add-on has been designed to keep your files save with the

choice to make visible only certain folders or files types.

Support for all latest browsers - All modern browsers are supported (IE8+ FF 3.6+, Safari 5+, Chrome 10+,

Opera 10).

Fully jQuery powered - Works with the latest jQuery 1.4.4




of 36

Great Dreamweaver Integration - Interactive dialog in Dreamweaver with all the options you’ll need.




of 36

Before you begin

Make sure to setup your site in Dreamweaver first before creating a page. If you don’t know how to do that

please read this.

Installing the extension Read the tutorial at http://www.dmxzone.com/go?4671

Login, download the product, and look up your serial at http://www.dmxzone.com/myZone/purchases

Get the latest extension manager from Adobe at

http://www.adobe.com/exchange/em_download/

Open the .mxp file (the extension manager should start-up) and install the extension.

If you experience any problems contact our Live Support!

http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt1.html


http://www.dmxzone.com/myZone/purchases

http://www.adobe.com/exchange/em_download/




of 36

Tutorial: Setting Up the File Manager Add-on on your Page In this tutorial we will show you how to use the File Manager Add-on for Advanced HTML Editor 3.

*You can also check out the video.





of 36

How to do it 1. First, we are going to insert the Advanced HTML Editor 3 on our page. Click the Advanced HTML Editor

3 icon and the dialog will pop up.




of 36

2. We are going to enable the Image Upload option (1) and select an Upload Folder (2). We will use this

folder as a source folder for the File Manager Add-on.




of 36

3. In the Add-ons tab (1) we will select the File Manager Add-on and enable it to work with our HTML

Editor (2) by clicking on the image File Manager options button (3).




of 36

4. Now, we will customize the appearance of the File Manager Add-on. First, we need to select the

source folder (1) for our files. Also we chose the Icon view for our files view style (2).




of 36

5. We enable all file types to be shown in the File manager (1), also we allow upload, creating of new

folders, download, file/folder rename and delete of files (2). When you’re done, click OK.

* In order to be able to upload files in your File Manager, you need to have Pure PHP/ASP Upload extension

installed.




of 36

6. Now, you can save your work and preview the File Manager Add-on in the browser.




of 36

Tutorial: Showing Images Thumbnails in the File Manager In this tutorial we will show you how to show thumbnails for the images in File Manager Add-on.

*You can also check out the video.





of 36

How to do it: 1. First, we are going to insert the Advanced HTML Editor 3 on our page. Click the Advanced HTML Editor

3 icon and the dialog will pop up.




of 36

2. We are going to enable the Image Upload option (1) and select an Upload Folder (2). We will use this

folder as a source folder for the File Manager Add-on.




of 36

3. In the Add-ons tab (1) we will select the File Manager Add-on and enable it to work with our HTML

Editor (2) by clicking on the image File Manager options button (3).




of 36

4. Now, we will customize the appearance of the File Manager Add-on. First, we need to select the

source folder (1) for our files. Also we chose the Thumbnail view for our files view style (2).




of 36

5. We enable only Images under the allowed files section (1), check the Show image thumbs (2) and

allow all actions under the File Management section (3).




of 36

6. Now, save your work and preview the result in the browser.




of 36

7. Open the File Manager from your Advanced HTML Editor 3 and you’ll get a thumbnail preview of your

images. Select an image and insert it in your editor.




of 36




of 36

Video: File Manager Features Overview

With this movie we will show you the main features packed in the File Manager Add-on.

Video: Using File Manager Add-on in the Browser

With this movie we will show you how to use the File Manager Add-on in Advanced HTML

Editor 3.

Video: Show thumbnails for the Images in File Manager Add-on

With this movie we will show you how to show thumbnails for the images in File Manager

Add-on for Advanced HTML Editor 3











table of contents · automatically into the manager (firefox & chrome) and if you choose to...

Documents