Files Pane

This website contains links to software which is either no longer maintained or will be supported only until the end of 2019 (CKFinder 2). For the latest documentation about current CKSource projects, including software like CKEditor 4/CKEditor 5, CKFinder 3, Cloud Services, Letters, Accessibility Checker, please visit the new documentation website.

If you look for an information about very old versions of CKEditor, FCKeditor and CKFinder check also the CKEditor forum, which was closed in 2015. If not, please head to StackOverflow for support.

(Created page with 'The Files Pane lists all files available in the selected folder. == Different Views == The Files Pane may present two different views, depending on CKFinder settings (see "[[CK…')
 
(Part 1 of the article updated to CKFinder 2.1 Help)
Line 1: Line 1:
−
The Files Pane lists all files available in the selected folder.
+
__TOC__
 +
{{#CUSTOMTITLE:Files Pane}}
 +
The <strong>Files Pane</strong> lists all files available in the selected folder.
 +
 
 +
[[Image:CKFinder_file_pane.png|frame|center|CKFinder Files Pane]]
 +
 
  
 
== Different Views ==
 
== Different Views ==
 +
The <strong>Files Pane</strong> may present the files with two different display formats, depending on CKFinder settings (see "<strong>[[CKFinder_2.x/Users_Guide/CKFinder_Interface/Toolbar/Settings|Settings]]</strong>"). The following is a comparison of the <strong>Thumbnails</strong> and the <strong>List</strong> views for the same folder.
 +
 +
When you configure CKFinder to use the <strong>Thumbnails</strong> view, the files will be presented as thumbnails (miniature previews or icons), with or without additional information like file name, size, or date (depending on your settings).
 +
 +
[[Image:CKFinder_file_view_thumbnails.png|frame|center|CKFinder Files Pane with Thumbnails view]]
  
−
The Files Pane may present two different views, depending on CKFinder settings (see "[[CKFinder_2.x/Users Guide/CKFinder Interface/Toolbar/Settings|Settings]]"). The following is a comparison of the "'''Thumbnails'''" and the "'''List'''" views for the same folder:
 
  
−
[[Image:Ckfinder thumbnails view.gif|Image:Ckfinder_thumbnails_view.gif]]
+
When you configure CKFinder to use the <strong>List</strong> view, the files will be presented in a list, with or without additional information like file name, size, or date (depending on your settings).
 +
 
 +
[[Image:CKFinder_file_view_list.png|frame|center|CKFinder Files Pane with List view]]
  
−
[[Image:Ckfinder list view.gif|Image:Ckfinder_list_view.gif]]&nbsp;
 
  
 
== Basic Operations ==
 
== Basic Operations ==
  
−
=== Selecting (Activating) a File ===
+
=== Activating (Selecting) a File with a Mouse ===
 +
In order to activate a file and make it the "current file" in CKFinder, click the file name or its thumbnail. To make it easier to choose the file, when you hover your mouse over a file, its background will become highlighted. Once a file is activated, it will be permanently highlighted with a different background color.
 +
 
 +
The figure below presents various states of a file as viewed in a folder: unselected, hovered with a mouse, and activated (selected).
 +
 
 +
<table align="center" cellpadding="0" cellspacing="0">
 +
<tr>
 +
<td valign="top" style="padding-right: 10px">[[Image:CKFinder_file_select_unselected.png]]</td>
 +
<td valign="top" style="padding-right: 10px; padding-left: 10px">[[Image:CKFinder_file_select_hovered.png]]</td>
 +
<td valign="top" style="padding-right: 10px; padding-left: 10px">[[Image:CKFinder_file_select_selected.png]]</td>
 +
</tr>
 +
</table>
 +
 
 +
In order to deactivate a file, click another one (activating it) or click any empty space inside the <strong>Files Pane</strong>.
 +
 
 +
=== Copying Files ===
 +
In order to copy a file to a different folder, select it, and drag onto the target folder in the <strong>Folders Pane</strong>. When you drop it onto a folder name, choose the <strong>Copy File Here</strong> option from the context menu.
 +
 
 +
[[Image:CKFinder_file_drag_copy.png|frame|center|Copying a file in CKFinder]]
  
−
To select a file, making it the "active file" in CKFinder, simply click in the file. To make it easy to understand that the mouse is over the file, the file area will be colored. The selected file will have a different background color (generally blue).&nbsp;
 
  
−
== Advanced Operations ==
+
The file will be duplicated and its copy will be placed in the target folder. The source folder will remain untouched.
 +
 
 +
[[Image:CKFinder_file_copied.png|frame|center|File copied in CKFinder]]
 +
 
 +
 
 +
<note>Note: If the file with the same name already exists in the target folder, you will be prompted to choose between overwriting it or automatically renaming the copied file (this is the default option).</note>
 +
 
 +
 
 +
[[Image:CKFinder_file_already_exists.png|frame|center|Error message for a file that already exists in CKFinder]]
 +
 
 +
 
 +
=== Moving Files ===
 +
In order to move a file to a different folder, select it, and drag onto the target folder in the <strong>Folders Pane</strong>. When you drop it onto a folder name, choose the <strong>Move File Here</strong> option from the context menu.
  
−
Advanced operations may be achieved on a file by using its "Context Menu". The following options are available: <br>
+
[[Image:CKFinder_file_drag_move.png|frame|center|Moving a file in CKFinder]]
  
−
[[Image:Ckfinder file context.gif|Image:Ckfinder_file_context.gif]]
 
  
−
'''Note''': Some context menu buttons may be disabled, depending on CKFinder settings enforced by your system administrator. See "[[CKFinder_2.x/Users Guide/CKFinder Configuration/Access Control|Access Control]]" for more information.
+
The file will be removed from the source folder and pasted into the target folder.
  
−
=== Selecting Files ===
+
[[Image:CKFinder_file_moved.png|frame|center|File moved in CKFinder]]
  
−
To select a file, returning it to the hosting application, just click the "'''Select'''" option.
 
  
−
=== Viewing (previewing) Files ===
+
== Advanced Operations ==
 +
Advanced operations can be performed on a file by using its <strong>[[CKFinder_2.x/Users_Guide/CKFinder_Interface/Context_Menu|Context Menu]]</strong>. Depending on the circumstances, the following options may be available:
  
−
To preview a file in the browser, just click the "'''View'''" button. Not all kinds of files can be viewed on browsers, but this feature is quite useful for images, text and PDF files. In other cases, the browser will ask you to open the file with the proper application.
+
[[Image:CKFinder_file_menu.png|frame|center|File context menu in CKFinder]]
  
−
=== Downloading Files ===
 
  
−
To download a file, just click the "'''Download'''" button. The browser will ask you for the place to save the downloaded file in your computer.
+
* <strong>Select</strong> &ndash; selects the file.
 +
* <strong>View</strong> &ndash; displays the full-sized file in a new browser tab or window.
 +
* <strong>Download</strong> &ndash; downloads the file from the server to your computer.
 +
* <strong>Resize</strong> &ndash; allows you to modify file size and/or create a new thumbnail.
 +
* <strong>Rename</strong> &ndash; changes the name of the file.
 +
* <strong>Delete</strong> &ndash; permanently removes the file.
  
−
=== Renaming Files ===
+
<note>Note: Some context menu options may be disabled (and thus grayed out), depending on CKFinder settings enforced by your system administrator.
 +
</note>
  
−
To rename a file, just click the "'''Rename'''" option in the context menu. A dialog box, containing the current file name, will appear, asking for the new name. Just type it and confirm.
 
  
−
Not all characters can be used in folder and files names due to limitations in the systems where CKFinder runs. For instance, the following characters cannot be used on folders and files names: \ / : * ? " &lt; &gt; |
+
=== Selecting Files ===
 +
In order to select a file by using the context menu, choose the <strong>Select</strong> option. Alternatively, you can also perform a double-click on the file with your mouse.
  
−
'''Attention''': by renaming a file, links or media insertions available in other pages, which point to the renamed file, will be "broken", therefore not available anymore. So, be careful when using this feature.
+
Depending on the environment where CKFinder is used, the selection operation can, for example, send the file URL to another application or insert an image directly into an article created in your CMS system.
  
−
=== Deleting Files ===
+
=== Viewing (Previewing) Files ===
 +
In order to preview a file in the browser, choose the <strong>View</strong> option from its context menu. Not all kinds of files can be viewed in browsers, but this feature is quite useful for images, text, and PDF files. In other cases, the browser will ask you to open the file with an appropriate application.
  
−
To delete a file, just click the "'''Delete'''" option in the context menu. A confirmation message will appear to ensure that this operation is desired.
+
Depending on your browser and operating system settings, the file will be displayed in a new browser tab or a new browser window.
  
−
'''Attention''': by deleting a file, links or media insertions available in other pages, which point to the deleted file, will be "broken", therefore not available anymore. So, be careful when using this feature.<br>&nbsp;
+
=== Downloading Files ===
 +
In order to download a file, choose the <strong>Download</strong> option from its context menu. The browser will ask you for a location on your computer to save the downloaded file. Depending on your browser and operating system settings, the file might also be opened immediately after it is downloaded by using an appropriate application of your operating system.

Revision as of 13:28, 19 September 2011

The Files Pane lists all files available in the selected folder.

CKFinder Files Pane


Different Views

The Files Pane may present the files with two different display formats, depending on CKFinder settings (see "Settings"). The following is a comparison of the Thumbnails and the List views for the same folder.

When you configure CKFinder to use the Thumbnails view, the files will be presented as thumbnails (miniature previews or icons), with or without additional information like file name, size, or date (depending on your settings).

CKFinder Files Pane with Thumbnails view


When you configure CKFinder to use the List view, the files will be presented in a list, with or without additional information like file name, size, or date (depending on your settings).

CKFinder Files Pane with List view


Basic Operations

Activating (Selecting) a File with a Mouse

In order to activate a file and make it the "current file" in CKFinder, click the file name or its thumbnail. To make it easier to choose the file, when you hover your mouse over a file, its background will become highlighted. Once a file is activated, it will be permanently highlighted with a different background color.

The figure below presents various states of a file as viewed in a folder: unselected, hovered with a mouse, and activated (selected).

CKFinder file select unselected.png CKFinder file select hovered.png CKFinder file select selected.png

In order to deactivate a file, click another one (activating it) or click any empty space inside the Files Pane.

Copying Files

In order to copy a file to a different folder, select it, and drag onto the target folder in the Folders Pane. When you drop it onto a folder name, choose the Copy File Here option from the context menu.

Copying a file in CKFinder


The file will be duplicated and its copy will be placed in the target folder. The source folder will remain untouched.

File copied in CKFinder


important note
Note: If the file with the same name already exists in the target folder, you will be prompted to choose between overwriting it or automatically renaming the copied file (this is the default option).


Error message for a file that already exists in CKFinder


Moving Files

In order to move a file to a different folder, select it, and drag onto the target folder in the Folders Pane. When you drop it onto a folder name, choose the Move File Here option from the context menu.

Moving a file in CKFinder


The file will be removed from the source folder and pasted into the target folder.

File moved in CKFinder


Advanced Operations

Advanced operations can be performed on a file by using its Context Menu. Depending on the circumstances, the following options may be available:

File context menu in CKFinder


  • Select – selects the file.
  • View – displays the full-sized file in a new browser tab or window.
  • Download – downloads the file from the server to your computer.
  • Resize – allows you to modify file size and/or create a new thumbnail.
  • Rename – changes the name of the file.
  • Delete – permanently removes the file.
important note

Note: Some context menu options may be disabled (and thus grayed out), depending on CKFinder settings enforced by your system administrator.


Selecting Files

In order to select a file by using the context menu, choose the Select option. Alternatively, you can also perform a double-click on the file with your mouse.

Depending on the environment where CKFinder is used, the selection operation can, for example, send the file URL to another application or insert an image directly into an article created in your CMS system.

Viewing (Previewing) Files

In order to preview a file in the browser, choose the View option from its context menu. Not all kinds of files can be viewed in browsers, but this feature is quite useful for images, text, and PDF files. In other cases, the browser will ask you to open the file with an appropriate application.

Depending on your browser and operating system settings, the file will be displayed in a new browser tab or a new browser window.

Downloading Files

In order to download a file, choose the Download option from its context menu. The browser will ask you for a location on your computer to save the downloaded file. Depending on your browser and operating system settings, the file might also be opened immediately after it is downloaded by using an appropriate application of your operating system.

Retrieved from "https://docs-old.ckeditor.com/index.php?title=CKFinder_2.x/Users_Guide/CKFinder_Interface/Files_Pane&oldid=6519"