How I Setup My Obsidian Publish?

Domain

I use my custom domain hosted at Cloudflare. Once you create your account and buy your domain, then you can setup your custom domain. Then the configurations are the following.

Obsidian Obsidian > > > Custom domain > Configure > Change the following values

Config	Example
Custom URL	blog.xingxinhe.com
Redirect to your custom domain	✅

I subscribe the domain xingxinhe.com but I host my blogs in the subdomain. Therefore, I could add a prefix blog ahead of my domain.

CloudFlare CloudFlare > Domain Registration(in the left panel) > Manage Domains > Manage(pick the domain) > Quick actions > Update DNS Configuration > Add Record >

Type	Name	Content	Proxy Status	TTL
CNAME	blog	publish-main.obsidian.md	Proxied	Auto

Remark

Let me explain pretending your domain is kanyewest.com.

the contents you publish are hosted by Obsidian(publish-main.obsidian.md).

when visitor enter your website(kanyewest.com), you want them to see the contents hosted in Obsidian. This is “redirect”.

therefore, the Name column is where you want to redirect your content to publish-main.obsidian.md.

if you are satisfied using kanyewest.com to display your published content, modify the value of Name to @

if you use Obsidian to sell your products like store.kanyewest.com then the Name could be store.

Note

See Custom Domain for more.

URL

tl;dr: I reference the structure as in ==Joel on Software==. That is, from the weblink I have something like this

https://blog.xingxinhe.com/{year}/{month}/{post-name}

Remark

I also reference others like Scott Hanselman’s Blog, Coding Horror, Sandi Metz’s Blog, Martin Fowler’s Blog, David Walsh Blog, Addy Osmani’s Blog, Kent C. Dodds’ Blog, Ray Wenderlich’s Blog, John Resig’s Blog, and on and on… They are not for me but maybe for you.

Folder

Since I use the URL described above, I manage my vault as followed.

📂Vault
├─📂blog
│  ├─📂2024
│  │  ├─📂01
│  │  │  └─📄My Blog Post1.md
│  │  ├─..
│  │  └─📂12
│  ├─📂2023
│  ├─📂...

The benefit is that I can auto-generate the URL matched my intention using Templater to fill the Permalinks . The YAML in my blog template file would be

---
permalink: <% tp.user.url_title(tp.file.path(true), tp.file.title ) %>
---

then add the function url_title() like so

function url_title(path, title) {
    const folderPath = path.substring(0, path.lastIndexOf('/')).replace('blog/','');
    return folderPath + '/' + title
    .replace(/\W+/g, ' ')
    .trim()
    .split(' ')
    .join('-')
    .toLowerCase();
   }
module.exports = url_title;

Layout

Analytics

To better understand

Assets

Since the space of my Obsidian Publish is limited to 4GB, therefore I use pngquant to compress the images.

Remark

I want to automate this process and I am planning to do it with a plugin. Stay tuned.