Host a Docs Stylesheet on Dropbox
Docs gives you the ability to specify an external stylesheet, which can be used to modify the design of your public website. Check out Customize Your Docs Site for more information on how to set your custom CSS. This article specifically shows how to reference a stylesheet hosted on Dropbox.
Note: Hosting the CSS file in your own web hosting space or uploading the file directly to Docs settings are preferable options to hosting on Dropbox. This article is not a recommendation to host with Dropbox, we are just providing the extra steps you'll need to take if you decide to do so.
- 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=0You 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.
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.