Specify Sync Folder Location for Deploying Hugo Websites with FTP

Uploading contents of a directory but not the directory itself

TL;DR

When deploying site built with Hugo using ftp, configure the syncroot of your git file to public/ instead of public. It syncs files INSIDE the directory, yet not the directory itself. ALWAYS Check the slashes when you are dealing with directories/folders.

I have been using SiteGround and FTP (File Transfer Protocol) to deploy my website (urbandatapalette.com) created using Hugo¹. My current workflow is like this:

1. Create an image of my Hugo website inside the public folder with the hugo command
2. Push all documents inside the public folder to the FTP server using the git-ftp command
3. Check if the changes are pushed correctly in the FTP server

git-ftp is a command-line function that works like git. Yet, the function is responsible for detecting the changes in your folder. It then uploads the changes to your FTP server. Methods of creating an FTP account depends on the web hosting services. SiteGround, the one I am using, has already provided tutorials on creating new FTP account for your website.

The Problem

When using the FTP protocol, SiteGround requires you to put the assets inside the public_html/ folder. When I tried using git-ftp push, it pushes the whole folder instead of the contents inside it only. This is my desired folder structure:

.
├── public_html
│   ├── 404.html
│   ├── css
│   ├── img
│   ├── index.html
│   ├── js
│   ├── sitemap.xml
│   └── tags

But this is what I got:

.
├── public_html
│   └── public
│       ├── 404.html
│       ├── css
│       ├── img
│       ├── index.html
│       ├── js
│       ├── sitemap.xml
│       └── tags

I am lazy enough that I dun wanna drag all these files out from the public directory in the SiteGround GUI. So I tried to search for an answer. Again, turns out I am not the only one suffering this problem. This is what I found after googling a few webpages:

You might want to consider this a feature and not a bug (acting similar to how rsync changes it action based on the trailing slash) and instead clarify its actions in the docs.

Case 1 --syncroot {folder_name} * without* a trailing slash will upload both the folder and its contents.

Case 2 --syncroot {folder_name}/ * with* a trailing slash will upload just the contents but not the folder itself.

From https://github.com/git-ftp/git-ftp/issues/352

My god, this saves my life. I originally set the syncroot in my git configuration as public, WITHOUT the slash.

Solving the Problem

I added the following parameters in the git configuration file (.git/config) . In particular, it should be syncroot = public/ instead of public.

[git-ftp]
 url = urbandatapalette.com
 user = MYFTPUSER
 syncroot = public/

Reload your IDE or start a new terminal to ensure the changes of .git is applied. Then try the following:

export FTP_PASSWORD=YOURPASSWORD
git ftp push --passwd $FTP_PASSWORD

Check the file configuration in your web hosting server to check whether it is correct or not how. Remember, delete the old files also!

Moral of the story

ALWAYS, ALWAYS check the slashes when you are dealing with directories/folder configuration.

References

Deploy on ‘git push’ at no cost for Github Private Repositories

git-ftp just the contents of a directory

[¹]: This is probably not a good practice. You should use hosting services with native support to Hugo listed on Hugo’s documentation. Yet I bought a one-year hosting plan on SiteGround on February, so… yea.