**24 August 2024**
![[setting-up-a-blog-obsidian-cover.png]]
When it comes to setting up a blog, people often get caught up in making their site look visually stunning, forgetting that the real goal is durability and the ability to genuinely blog. I’ve realized that though tools like [Astro.build](https://astro.build/), React, Gatsby, Hugo, and other static-site generators and their pre-made templates give a very straightforward and quick way to setup a blog for free, they only focus on the frontend part.
Through my experiences, I've felt that blogging is just more than a website, its a system to channel your thoughts in a structured and punctual manner, and regularly put them out to the world. Giving value is one of the core tenets of blogging. And so we must take care, that the system we use for blogging is more than just a frontend. It should serve as a tool for thinking, for sharing value with the world, and most of all, to make excellence a habit! Here are a few principles that I used to design my content system.
### Typography Beats Flashy Design
In the blog world, simplicity in typography is often overlooked. Good design might catch the eye at first, but regular readers are more interested in a font that's easy on the eyes and content that’s valuable. Spacing, readability, and legibility become far more important over time than eye-catching visuals. It’s the subtle aspects of a blog—like readable fonts and clean spacing—that make it a lasting success.
### More Than Just a Blog, A content system
Obsidian is more than just a blogging tool; it's a complete content management system. Blogging isn’t just about publishing; it’s about ingesting, processing, and refining your thoughts and data before sharing the final result. This systematized approach, native to Obsidian, allows you to organize and develop your ideas over time, producing deeper, richer content.
### Keeping it Simple and Enjoyable
Maintaining a blog can be a chore, especially when coding is involved. The writing process should be seamless and enjoyable—something many people appreciate about platforms like Medium.com, which offers a premium writing experience out of the box. Obsidian’s strength lies in its flexibility and customization, letting you create that same premium feel while still being fully in control of your workflow.
### The Power of the Zettelkasten Approach
Originally designed as a knowledge base or second brain, Obsidian’s Zettelkasten method ensures that your blog remains consistent in both content and quality. By its very nature, Zettelkasten encourages regular content creation, turning content excellence into a habit rather than a milestone. As they say, “excellence is often a habit, not a milestone.”
---
## Step-by-Step Guide
So, here are the steps I took to setup this blog.
### 1. Download Obsidian and Register an Account
First, download [Obsidian](https://obsidian.md/) and set up your account. Obsidian is free to use, and its flexibility makes it a perfect tool for bloggers and content creators.
### 2. Register for Obsidian Publish ($8 per month)
To take your blog live, you'll need to subscribe to [Obsidian Publish](https://obsidian.md/publish), which costs $8 per month. This service handles all the technicalities of publishing directly from your Obsidian vault, making it a seamless experience.
### 3. Register Your Website Using Hostinger
Next, you’ll want to secure your domain. Head over to [Hostinger](https://www.hostinger.com/) and register your website. Hostinger offers affordable and reliable hosting plans that work well with Cloudflare and Obsidian.
### 4. Switch Nameservers to Cloudflare and Add a CNAME Record
After registering your domain, you need to set up Cloudflare for enhanced security and faster load times. Here’s how:
- Switch your domain's nameservers to Cloudflare.
- Once that’s done, add a CNAME record pointing to `publish-main.obsidian.md`. This ensures your Obsidian Publish setup works smoothly with your custom domain.
### 5. Create Medium-Like Typography for Your Blog Using Custom CSS
To give your blog a clean, Medium-like appearance, you can customize the typography with CSS. Follow these steps:
- Create a file named `publish.css` in your Obsidian vault.
- I used the following settings:
```css
/* Import Fonts */
@import url('https://fonts.googleapis.com/css2?family=Charter:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IM+Fell+English&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Helvetica:wght@400;700&display=swap');
/* General Font and Typography Styling */
body, p, li, blockquote {
font-family: "Charter", "Georgia", serif;
font-size: 18px;
line-height: 1.6;
}
h1, h2, h3, h4, h5, h6 {
font-family: "IM Fell English", serif;
font-weight: 400;
}
h2, h3,
.workspace-leaf, .nav-file-title, .nav-folder-title, .side-dock .plugin {
font-family: "Helvetica Neue", sans-serif;
font-weight: 400;
}
small, .code-block .cm-s-obsidian, .metadata {
font-family: "Kievit", sans-serif;
font-size: 14px;
}
/* Font Weight Adjustments */
strong {
font-weight: 600;
}
em {
font-style: italic;
}
/* Code Styling */
code {
font-family: "Courier New", monospace;
}
/* Header Font Sizes */
h1 { font-size: 2.4em; }
h2 { font-size: 2em; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5, h6 { font-size: 1.2em; }
/* Link and Text Highlight Styling */
a {
color: #F48FB1;
text-decoration: none;
}
a:hover {
color: #F06292;
}
::selection {
background-color: #FCE4EC;
color: #000;
}
```
This CSS will give your blog a modern, readable look while still focusing on content.
### 6. Publish the Files—It’s That Easy!
Finally, with everything set up, publish your blog through Obsidian Publish. Your content will be live for the world to see. It’s really that easy!
## Conclusion
Building and maintaining a blog doesn’t have to be complicated. With the right tools and approach, you can create a platform that’s not only functional but enjoyable to manage. By using Obsidian, Hostinger, and Cloudflare, you’re leveraging a system that focuses on simplicity, durability, and an excellent content creation experience. Obsidian’s unique capabilities allow you to turn your ideas into well-organized content while Cloudflare and Hostinger ensure that your blog is fast, secure, and accessible.
Remember, the real value in blogging comes from sharing your thoughts consistently, not from perfecting design details. By prioritizing readability, structure, and ease of use, you’re setting yourself up for long-term success in your blogging journey. So, dive in, start writing, and let the tools do the heavy lifting.
---
*If you found this helpful, you can connect with [me on LinkedIn](https://www.linkedin.com/in/khushi-03786a286/). I experiment with different technologies, and techniques, and share my results through blogs and videos.*