How to publish your blog to your server

Continuing the discussion from How to upload my hugo blog from localhost to my server?:

This is a common question - I’ve built my site locally, now what?

There are a few different workflows for Hugo. The one that I use isn’t the only one. It works for me, but it may not be the best one for you. Still, it will give you an idea of what is possible.

My workflow is:

  1. Run hugo with the live reload option hugo server --watch. That --watch option tells hugo to watch the file system for new files and changed files.
  2. Open a browswer to http://localhost:1313 so that I can see updates as I am working on my posts.
  3. Use hugo new post/some-title.md to create a file for editing.
    4 Edit the file content/post/some-title.md.
  4. Save and then view in my browser, http://localhost:1313.
  5. When I’m happy with the results, make sure that “draft = true” has been removed from the posts I’m publishing.
  6. Rebuild my public/ folder with the right base URL. I do this by purging the folder and running hugo using the commands rm -rf public/ && hugo.
  7. Push the new site up using sftp.

Note that I don’t specify a theme on the command line - I always add it to my config file.

The important step (and one that is confusing to new users), is that I have to run hugo without the server option to generate the files that I’m pushing to my real web server. That’s because the server option generates output for local viewing. URLs in the HTML files refer to localhost:1313. When hugo runs without the server option, the HTML files use the baseURL setting from the configuration file. That makes them useable on the remote server.

There are some optimizations for larger sites:

  1. I could use separate output directories for my local work and for building the final content. That would ensure that I never published files with the wrong base URL by accident.
  2. There are tools, like rsync, that are smart enough to push only the files that have changes to the remote server. If I was working on a large site, then I would certainly do so.
  3. Add a version control system like git that truly understands changes.

For truly large sites, there’s a period of time while the push to the server is running that content will get wonky because there’s a mix of “yesterday’s content” and “today’s content.”" If this becomes a problem, I’d want to stage to a temporary location on that remote server and then move (not copy) the changed files in. That’s quite beyond the bounds of this note, though.

4 Likes

hi! thank you for this page.
Could you please add exactly how to specify your theme in the config and what folders and/or urls are present to make it so? I cannot get it to take. Instead, the text for each blog is rendered in a list like an RSS feed, but no styling

1.Here is what I have;
I have in my config.toml:

theme = “hugo_theme_robust”

And I have the git repo at themes/hugo_theme_robust
but my pages do not have any styling when I double click on the produced index.html.

2.Here is the log output:

$ hugo-dev -v
INFO: 2016/07/07 20:20:02 hugo.go:452: Using config file: /Users/me/src/myBloge/myBlog-bitb/config.toml
INFO: 2016/07/07 20:20:02 hugo.go:561: using a UnionFS for static directory comprised of:
INFO: 2016/07/07 20:20:02 hugo.go:562: Base: /Users/me/src/myBloge/myBlog-bitb/themes/hugo_theme_robust/static
INFO: 2016/07/07 20:20:02 hugo.go:563: Overlay: /Users/me/src/myBloge/myBlog-bitb/static/
INFO: 2016/07/07 20:20:02 hugo.go:595: syncing static files to /Users/me/src/myBloge/myBlog-bitb/public/
Started building site
INFO: 2016/07/07 20:20:02 site.go:1275: found taxonomies: map[string]string{“tag”:“tags”, “category”:“categories”}
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/tags/sale/page/1” translated to “tags/sale/page/1/index.html”
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/categories/contact/page/1” translated to “categories/contact/page/1/index.html”
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/categories/admin/page/1” translated to “categories/admin/page/1/index.html”
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/tags/hello/page/1” translated to “tags/hello/page/1/index.html”
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/post/page/1” translated to “post/page/1/index.html”
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/page/1” translated to “page/1/index.html”
INFO: 2016/07/07 20:20:02 htmlredirect.go:116: Alias “/page/1” translated to “page/1/index.html”
ERROR: 2016/07/07 20:20:02 template.go:138: Unable to render [partials/header.html theme/partials/header.html]
ERROR: 2016/07/07 20:20:02 template.go:139: Expecting to find a template in either the theme/layouts or /layouts in one of the following relative locations [partials/header.html theme/partials/header.html]
ERROR: 2016/07/07 20:20:02 template.go:138: Unable to render [partials/subheader.html theme/partials/subheader.html]
ERROR: 2016/07/07 20:20:02 template.go:139: Expecting to find a template in either the theme/layouts or /layouts in one of the following relative locations [partials/subheader.html theme/partials/subheader.html]
0 of 5 drafts rendered
0 future content
4 pages created
0 non-page files copied
7 paginator pages created
2 tags created
2 categories created
in 64 ms

3.I am using markdown right now, but I hope to use asciidoc later.
4.It works fine with hugo server.
5.Opening the created index.html with my browser yields unstyled text.

Your CSS files are probably not loaded. Look in the HTML source of the deployed website to see if the CSS file is accessible.

If you have a publicly available deployed website, you can link and we can see if that is the issue or no.

hi there,

Pls can you help? I think I’m having a similar issue … I’ve published it up to my hosting server using FTP but I’m not getting styling. I’m using an up to date version of Hugo on OSX.
My website is: http://templada.com

Kind regards

Raoul

Recently learnt that there is a hugo undraft .

Thought it was not widespread info as much as it should have.