%%[[if preview]]%%

demo_directory_1
- 1.jpg
- 2.jpg
- 3.jpg
- 4.jpg
- 5.jpg
- 6.jpg
- 7.jpg
- 8.jpg
demo_directory_2
- 1.jpg
- 2.jpg
- 3.jpg
- 4.jpg
- 5.jpg
- 6.jpg
- 7.jpg
- 8.jpg
demo_directory_3
- all_images
  - 1.jpg
  - 2.jpg
  - 3.jpg
  - 4.jpg
  - 5.jpg
  - 6.jpg
  - 7.jpg
  - 8.jpg
- some_images
  - 1.jpg
  - 2.jpg
  - 3.jpg
  - 4.jpg
- more_images
  - 5.jpg
  - 6.jpg
  - 7.jpg
  - 8.jpg
demo_directory_4
- 1.jpg
- 2.jpg
- 3.jpg
- 4.jpg
- 5.jpg
- 6.jpg
- 7.jpg
- 8.jpg
demo_directory_5
demo_directory_6

%%[[endif]]%% %%[[if publish]]%% %id=iteration_start% ) { // 2 is the default iteration start and is used instead of 0 to account for . and .. "directories" $php_filetree_stack_%id% = "

" . htmlspecialchars($this_file) . "

"; return $php_filetree_stack_%id%; } } $allowed_extensions = array(%id=allowed_files%); %[if %("%id=action%" == "do_nothing")% ]% echo php_file_tree_%id%("%id=relative_path%", "#", $allowed_extensions); %[endif]% %[if %("%id=action%" == "download")% ]% echo php_file_tree_%id%("%id=relative_path%", "[link]", $allowed_extensions); %[endif]% %[if %("%id=action%" == "normal_navigation")% ]% echo php_file_tree_%id%("%id=relative_path%", "[link]", $allowed_extensions); %[endif]% %[if %("%id=action%" == "new_tabs")% ]% echo php_file_tree_%id%("%id=relative_path%", "[link]", $allowed_extensions); %[endif]% %[if %("%id=action%" == "topbox")% ]% echo php_file_tree_%id%("%id=relative_path%", "[link]", $allowed_extensions); %[endif]% ?> %%[[endif]]%% %%[[if edit]]%%

Setup
Please publish this webpage to a server with PHP 7.4 or greater. A sample file tree is displayed in RapidWeaver preview.

FileTree is currently configured to browse all directories and files at this location and lower:
%id=relative_path%

FileTree is configured to only show files ending in the following extensions:
%id=allowed_files% %[if %("%id=hide_hidden%" == "false")% ]%

You currently have hidden directories and files (those starting with a [.] period character) set to display.

%[endif]% %[if %("%id=hide_hidden%" == "true")% ]%

You currently have hidden directories and files (those starting with a [.] period character) set to hide.

%[endif]% %%[[endif]]%% %%[[if edit]]%%

Icon markup
This is the CSS code for the icons. Double-click the area below to edit. If you find it easier, copy and paste the code between here and a normal code editor (like Atom, Sublime or VS Code). The product page for FileTree explains the code in greater detail.

%%[[endif]]%% %%[[if !edit]]%% %%[[endif]]%% %%[[if edit]]%% %[if %("%id=action%" == "topbox")% ]%

TopBox lightbox support
Add a free TopBox Enabler or the paid TopBox v5 stack to this webpage. Preferably place TopBox below your FileTree stack, so that TopBox is able to capture the links being loaded. Simple file types like images, audio, video and PDF are supported. Be sure your file tree does not include complicated file types (like text files, office documents and .zip packages) as these will not work inside the lightbox. You can control what files are listed in the FileTree settings, to remove those that are not supported by TopBox. Customise your lightbox effect as you normally would, using the TopBox settings. You can change the TopBox Grouping option to only show lightbox navigation links for files within that directory, lightbox navigation links for all files in FileTree, or turn off the lightbox navigation links.

%[endif]% %%[[endif]]%%