Custom home page

By default, Micro.blog shows the most recent posts on your blog’s home page. You can override this by creating a custom theme with a different home page layout that includes any text.

Start by clicking Posts → Design → Edit Custom Themes. Create a new template named layouts/index.html and paste in the following:

{{ define "main" }}
  This is the home page.
{{ end }}

You can replace the content in the middle with any HTML. The special {{ define }} tag will automatically wrap your text with the blog’s default design.

Go back to your site settings under Posts → Design and select the new theme, then click Update Microblog Settings.

Including categories

You can also customize your home page so that it only includes specific categories. For example, you might want the home page to only include longer posts, or only photos.

In the new layouts/index.html template, you can specify a category when building the list of posts. To only include posts in the “Essays” category, the code will look something like this:

{{ $paginator := .Paginate .Site.Taxonomies.categories.essays 25 }}
{{ range $paginator.Pages  }}

Or to include posts from 2 categories such as “Essays” and “Photos”:

{{ $paginator := .Paginate (union .Site.Taxonomies.categories.essays .Site.Taxonomies.categories.photos) 25 }}
{{ range $paginator.Pages  }}

The exact HTML for your template will vary based on the default design you are using. For a version using the Marfa theme, see this GitHub Gist.

1 Like

Try as I might, I can’t get this to work on Arabica, All I get it this first three posts in that category and no pagination.

    {{ define "main" }}
    	<main class="content" role="main">
        {{ $paginator := .Paginate .Site.Taxonomies.categories.main 25 }}
        <div class="extra-pagination">
          {{ partial "pagination.html" . }}
        </div>
    		{{ range $paginator.Pages }}
          {{ .Render "summary" }}
    		{{ end }}
        {{ partial "pagination.html" . }}
    	</main>
    {{ end }}

managed to sort this but using {{ partial "summary.html" . }} instead of .Render and moving the summary.html to the partials folder.

Which kind of escaping do we use for this if we have a “-” in the category name?

Probably a dumb question, but here we go. I use a custom domain for my Micro.blog-hosted site. If I want to create a custom home page for garciabuxton.com as directed here, can I still link from that custom page to the standard reverse-chronological blog using this link: https://www.garciabuxton.com/ ? Or does the custom domain thing complicate things?

It complicates things a little. You could link to /archive instead as a quick work-around, although that’s not the same. Ideally for people with custom home pages we’d have the default home page at a different URL, but I’m not sure the best way to do that right now. (Anyone else feel free to jump in with suggestions.)

Thanks, Manton! (And I was trying to link to Gratuitous Web Presence with “1” after the “/page/” part in the URL, but I don’t think it registered correctly here.)

Curious to see if others have any thoughts, but I was just toying with the idea of a “front page” to my site with links to certain posts or archive categories that I wanted to feature. I link to a few categories in the top navigation, but I was considering something different from the latest reverse-chronological blog posts to lead off the site. I’m not a coding wizard at all – though I know at least rudimentary HTML – so your initial post on this topic appealed to me.

Linking to categories makes sense. It’s also possible to use the Filters feature to automatically assign all posts of a certain type to a category, so that might help too. Let us know if you have any questions!

Can we set any Page as our Home page? If so, how? That’d be great for people who want micro.blog to be their website as well as life blog feed!

1 Like

With a custom theme, you can just change the index template to be whatever you want.

Sorry, I didn’t get it. Can the index template be pointed to another page?

The index template can be pointed to any post content, like filtering to a post with a particular title or category, or even just have the HTML of your home page dropped in as the content as you see fit. This theme, designed to teach theming, may be helpful. It includes a custom home page.

1 Like

I am totally lost. I can’t get this to work for Arabica either, and have no idea what you mean by this. Can you make a Gist on GitHub?

My index is

    {{ define "main" }}
	<main class="content" role="main">
    {{ $paginator := .Paginate (.Site.Taxonomies.categories.main) 12 }}
		{{ range $paginator.Pages }}
			{{ partial "summary.html" . }}
	{{ end}}
    {{ partial "pagination.html" . }}
	</main>
{{ end }}

change categories main to whatever you want it to be. The main change is {{ .Render "summary" }} to {{ partial "summary.html" . }} and then make sure there is a summery.html in partials.

You can find my full set up here