Browsing Files in Drupal 8 with the Filebrowser Module

Drupal is a very robust Content Management System. It is among the most popular CMS’s on the internet. However, file management is a tricky business in Drupal. Browsing files is a feature not included in the Drupal standard installation. In this tutorial, we will install the Filebrowser module to allow us to browse and manage files. This is a quick installation and configuration tutorial. If you follow the steps below, feel free to make your own choices.

Installation and Setting Defaults

1. Install and activate the Filebrowser module. (Refer to the tutorial How to Install a Module in Drupal 8.)

2. Click on the Configuration tab to access the Configuration page.

3. Scroll down the page to the Filebrowser section.

4. Click on Default node settings.

5. In the Folder Rights section, tick the checkboxes for all three options:

  • Show subdirectories if present
  • Allow folder’s files to be downloaded as an archive
  • Allow folder to be created

6. For download manager, choose Public – Files are served by the web server and should be accessible by it.

7. Leave Force download unchecked.

8. Leave the defaults for Blacklist. These files will not show in your listing and White list as they are.

9. In the Upload section, tick the checkboxes for the two options:

  • Allow uploads
  • Allow overwrites

10. Leave the default for Accepted files for upload as it is.

11. In the Presentation section, set Default view to Grid – Thumbnail (or icon) of the files in a grid.

12. Make sure FileSystem encoding is set to UTF-8.

13. Leave Hide file extensions unchecked.

14. In Visible columns, see to it that the checkboxes for Icon, Created and Size are ticked.

15. For Default sort, choose Name.

16. For Default sort order, select Ascending.

17. Click on the Save Configuration button.

Creating a File Browser

18. Click on the Content tab to access the Content page.

19. Click on the Add content button.

20. Click on Directory listing to access the Create Directory listing form page.

21. Write File Browser as the Title.

22. Write public:// as Directory uri. If you want to arrange your files by year and month, add to it these tokens: [date:custom:Y]-[date:custom:m].

23. Leave the rest of the defaults as they are.

24. Click on URL alias on the right of the page and type in /file-browser in the field below the label URL alias.

25. While still on the right of the page, go down to Promotion options and un-tick the checkbox for Promoted to front page.

26. Uncheck Published (This is important!)

27. Click on the Save button.

Positioning the File Browser

28. Click on the Structure tab to access the Structure page.

29. Scroll down the page and click on Menus to access the Menus page.

30. Look for Administration in the Title column.

31. Go to the Operations column on the right of the page  and click on the arrow pointing down on the Edit menu button for Administration.

32. Click on Add link to access the Add menu link page.

33. Write File Browser as the Menu link title.

34. Write /file-browser in the field below Link.

35. Leave Enabled checked.

36. Write File browser and management in the Description field.

37. Leave Show as expanded unchecked.

38. Select Filebrowser from the Parent link dropdown list.

39. Set weight to -10 (negative ten).

40. Click on the Save button.

Clearing the Cache

41. Click on the Configuration tab to access the Configuration page.

42. Look for the Development section and click on Performance.

43. Click on the Clear all caches button and wait for the caches to clear.

44. Click on the Save configuration button.

Using the File Browser

45. Click on the Configuration tab to return to the Configuration page.

46. Scroll down the page to the Filebrowser section.

47. Click on File Browser to start using the module.