How to Print Directory Contents Using Chrome or Firefox?

If you need to print directory contents listing to a file or printer, then here is a nifty way to accomplish the task using Google Chrome or Firefox web browser.

Print Directory Contents using Google Chrome

Open Google Chrome, type the folder path in address bar and press ENTER. This shows the folder contents, sorted by Name with folders on top. You can sort it as you’d like – by Size or Date Modified column – thanks to Chrome’s sortTable JavaScript function.

print directory contents chrome firefox

While the file and folder icons are shown in the normal view, they won’t be outputted when you print directory contents to a physical printer or output to a file.

print directory contents chrome firefox

Print Directory Contents using Mozilla Firefox

In Mozilla Firefox, directory listings are shown in a better way, with a better style sheet.

Click the Name column header to sort the listing by name with folders on top.

print directory contents chrome firefox

The file and folders icons look neat, but you most likely don’t want to see them in print. Firefox’s print preview dialog would show the icon for every file listed, but not for folders.

print directory contents chrome firefox

You can apply your own styling to the directory contents page, and remove the file/folder icons from being printed.

Add or Remove Custom Styles

Launch the Firefox Developer Tools / Inspector by pressing Shift + F7. Alternately, use F12 (or Ctrl + Shift + i) and click “Style Editor”.

print directory contents chrome firefox

Add the following to the Style Sheet Editor.

.dir::after { content: "/" }
img { display:none }

Then remove the following lines in the Style Editor window, and close Developer Tools (Ctrl + Shift + i).

.dir::before {
content: url(resource://gre/res/html/folder.png);

Doing so would hide the file and folder icons to prevent them from being printed. Also, to easily differentiate between files and folders, the custom stylesheet code adds a trailing forward slash (“/”) after the directory name. Chrome, on the other hand, does this by default.

So here is how the print preview looks like, and so would the final output to printer or a PDF file.

print directory contents chrome firefox

print directory contents chrome firefox

Note: In Internet Explorer or Microsoft Edge, when you type a directory path the folder window is launched rather than the browser rendering the folder contents.

Related article: How to add Print Directory option to the right-click menu for file system folders.

One small request: If you liked this post, please share this?

One "tiny" share from you would seriously help a lot with the growth of this blog. Some great suggestions:
  • Pin it!
  • Share it to your favorite blog + Facebook, Reddit
  • Tweet it!
So thank you so much for your support, my reader. It won't take more than 10 seconds of your time. The share buttons are right here. :)

About the author

Ramesh Srinivasan founded back in 2005. He is passionate about Microsoft technologies and has a vast experience in Windows — delivering support for Microsoft's consumer products. He has been a Microsoft MVP (2003-2012) who contributes to various Windows support forums.

1 thought on “How to Print Directory Contents Using Chrome or Firefox?”

  1. I am very interested to learn Ramesh if your previous findings still stand in Chrome Windows 10 in printing off file directories. Yours to date seem to make the only sense but just wondering if there has been any advancement. Thank you for the hard work you do

Leave a Comment