How to host a stylesheet on Dropbox

For the tech-savvy, Docs gives you the ability to specify an external stylesheet, which can be used to modify the design of your public website. This article shows you how to host that stylesheet on Dropbox.

1

Create your CSS file and save it with a .css extension. Save this file in the Dropbox folder on your computer or upload the file using the Dropbox web app. 

2

Navigate to the file you saved in the Dropbox web app. Click the 3 dots on the right side of the file and choose Share. Click Create Link then Close. If you are using Dropbox Business or Professional, you will also need to click Link Settings and change the Link Access setting to Anyone. 

3

Head over to your Docs Settings page and click into the Custom Code section. Paste the URL you just copied into the Custom Stylesheet URL field.

But wait, there's more! This next part is super important!

The link you just pasted looks something like this:
https://www.dropbox.com/s/19kh2r77nipor2w/test.css?dl=0

You need to change the www in the URL to dl, and remove the ?dl=0 from the end so it looks like this:
https://dl.dropbox.com/s/19kh2r77nipor2w/test.css

This allows Docs to access the source of the file rather than the Dropbox page for the file. Click the Save button at the bottom of the page when you're finished.

Note: If you have the Dropbox app installed on your computer, start editing the CSS as desired from the Dropbox folder. When you save the file, Dropbox will sync the changes automatically. You can refresh your Docs public site to see those changes take effect.

If you're using Beacon, custom CSS from your stylesheet will not be pulled into Docs displayed in Beacon.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still stuck? How can we help? How can we help?