The Mediumish Jekyll theme is well-loved for its sleek and minimal design, but what if you want your site to stand out from the crowd? While the theme offers a solid structure out of the box, it’s also incredibly flexible when it comes to customization. This article will walk you through how to make Mediumish reflect your own brand identity — from colors and fonts to custom layouts and interactive features.
Guide to Personalizing the Mediumish Jekyll Theme
- Learn which parts of Mediumish can be safely modified
- Understand how to adjust colors, fonts, and layouts
- Discover optional tweaks that make your site feel more unique
- See examples of real custom Mediumish blogs for inspiration
Why Customize Mediumish Instead of Using It As-Is
Out of the box, Mediumish looks beautiful — its clean design and balanced layout make it an instant favorite for writers and content creators. However, many users want their blogs to carry a distinct personality that represents their brand or niche. Customizing your Mediumish site not only improves aesthetics but also enhances user experience and SEO performance.
For instance, color choices can influence how readers perceive your content. Typography affects readability and brand tone, while layout tweaks can guide visitors more effectively through your articles. These small but meaningful adjustments can transform a standard template into a memorable experience for your audience.
Understanding Mediumish’s File Structure
Before making changes, it helps to understand where everything lives inside the theme. Mediumish follows Jekyll’s standard folder organization. Here’s a simplified overview:
mediumish-theme-jekyll/
├── _config.yml
├── _layouts/
│ ├── default.html
│ ├── post.html
│ └── home.html
├── _includes/
│ ├── header.html
│ ├── footer.html
│ ├── author.html
│ └── sidebar.html
├── assets/
│ ├── css/
│ ├── js/
│ └── images/
└── _posts/
Most of your customization work happens in _includes (for layout components), assets/css (for styling), and _config.yml (for general settings). Once you’re familiar with this structure, you can confidently tweak almost any element.
Customizing Colors and Branding
The easiest way to give Mediumish a personal touch is by changing its color palette. This can align the theme with your logo or branding guidelines. Inside assets/css/_variables.scss, you’ll find predefined color variables that control backgrounds, text, and link colors.
1. Changing Primary and Accent Colors
To modify the theme’s main colors, edit the SCSS variables like this:
$primary-color: #0056b3;
$secondary-color: #ff9900;
$text-color: #333333;
$background-color: #ffffff;
Once saved, rebuild your site using bundle exec jekyll serve and preview the new color scheme instantly. Adjust until it matches your brand identity perfectly.
2. Adding a Custom Logo
By default, Mediumish uses a simple text title. You can replace it with your logo by editing _includes/header.html and inserting an image tag:
<a href="/" class="navbar-brand">
<img src="/assets/images/logo.png" alt="Site Logo" height="40">
</a>
Make sure your logo is optimized for both light and dark backgrounds if you plan to use theme switching or contrast-heavy layouts.
Adjusting Fonts and Typography
Typography sets the tone of your website. Mediumish uses Google Fonts by default, which you can easily replace. Go to _includes/head.html and change the font import link to your preferred typeface. Then, edit _variables.scss to redefine the font family.
$font-family-base: 'Inter', sans-serif;
$font-family-heading: 'Merriweather', serif;
Choose fonts that align with your content tone — for example, a friendly sans-serif for tech blogs, or a sophisticated serif for literary and business sites.
Editing Layouts and Structure
If you want deeper control over how your pages are arranged, Mediumish allows you to modify layouts directly. Each page type (home, post, category) has its own HTML layout inside _layouts. You can add new sections or rearrange existing ones using Liquid tags.
Example: Adding a Featured Post Section
To highlight specific content on your homepage, insert this snippet inside home.html:
<section class="featured-posts">
<h2>Featured Articles</h2>
</section>
Then, mark any post as featured by adding featured: true to its front matter. This approach increases engagement by giving attention to your most valuable content.
Optimizing Mediumish for SEO and Performance
Custom styling means nothing if your site doesn’t perform well in search engines. Mediumish already has clean HTML and structured metadata, but you can improve it further.
1. Add Custom Meta Descriptions
In each post’s front matter, include a description field. This ensures every article has a unique snippet in search results:
---
title: "My First Blog Post"
description: "A beginner’s experience with the Mediumish Jekyll theme."
---
2. Integrate Structured Data
For advanced SEO, you can include JSON-LD structured data in your layout. This helps Google display rich snippets and improves your site’s click-through rate. Place this in _includes/head.html:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": "How Can You Customize the Mediumish Theme for a Unique Jekyll Blog",
"author": "",
"description": "Learn how to personalize the Mediumish Jekyll theme to create a unique and branded blogging experience.",
"url": "/loomranknest01/"
}
</script>
3. Compress and Optimize Images
High-quality visuals are vital to Mediumish, but they must be lightweight. Use free tools like TinyPNG or ImageOptim to compress images before uploading. You can also serve responsive images with srcset to ensure they scale perfectly across devices.
Real Examples of Customized Mediumish Blogs
Several developers and creators have modified Mediumish in creative ways:
- Portfolio-style layouts — replacing post lists with project galleries.
- Dark mode integration — toggling between light and dark styles using CSS variables.
- Documentation sites — adapting the theme for product wikis with Jekyll collections.
These examples prove that Mediumish isn’t limited to blogging. Its modular structure makes it a great foundation for various types of static websites.
Tips for Safe Customization
While customization is powerful, always follow best practices to avoid breaking your theme. Here are some safety tips:
- Keep a backup of your original files before editing.
- Use Git version control so you can roll back if needed.
- Test changes locally with
bundle exec jekyll servebefore deploying. - Document your edits for future reference or team collaboration.
Summary: Building a Unique Mediumish Blog
Customizing the Mediumish Jekyll theme allows you to express your style while maintaining the speed and simplicity of static sites. From color adjustments to layout improvements, each change can make your blog feel more authentic and engaging. Whether you’re building a portfolio, a niche publication, or a brand hub — Mediumish adapts easily to your creative vision.
Your Next Step
Now that you know how to personalize Mediumish, start experimenting. Tweak one element at a time, preview often, and refine your design based on user feedback. Over time, your Jekyll blog will evolve into a one-of-a-kind digital space that truly represents you.
Want to go further? Explore Jekyll plugins for SEO, analytics, and multilingual support to make your customized Mediumish site even more powerful.