# What if you need to have an index page and a blog for your site?

**URL:** <https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401>\
**Category:** support\
**Created:** [November 28, 2017, 1:29pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401 "2017-11-28T13:29:18Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Rea](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rea/32/4669_2.png) [@Rea](https://discourse.gohugo.io/u/Rea)\
**Post date:** [November 28, 2017, 1:29pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/1 "2017-11-28T13:29:18Z")

</div>

Root of domin: An index page which is a landing page that shows recent post of your blog in part of the page, and, Your blog: located in `/blog`. (They are using same assets)

‌  
[example.com](http://example.com) --\> have some Hugo code that should be build

[example.com/blog](http://example.com/blog) --\> which is a normal Hugo blog, published in themes.

How this can be implemented?

‌ ‌  
‌ ‌ ‌  
‌ ‌ ‌  
ـــــــــــــــــــــــــــــــ  
UPDATE: you can find a good description here: [What's the point to implement many blogs?](https://discourse.gohugo.io/t/9466/2)

---

<div class="post-metadata">

**Author:** ![alexandros](https://avatars.discourse-cdn.com/v4/letter/a/ecc23a/32.png) [@alexandros](https://discourse.gohugo.io/u/alexandros)\
**Post date:** [November 28, 2017, 1:39pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/2 "2017-11-28T13:39:41Z")

</div>

See: [Static Index w/ Separate /blog?](https://discourse.gohugo.io/t/static-index-w-separate-blog/5665)

Tip: Read the Forum Guidelines on requesting help: [https://discourse.gohugo.io/t/requesting-help/](https://discourse.gohugo.io/t/requesting-help/)

---

<div class="post-metadata">

**Author:** ![Rea](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rea/32/4669_2.png) [@Rea](https://discourse.gohugo.io/u/Rea)\
**Post date:** [November 28, 2017, 3:31pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/3 "2017-11-28T15:31:58Z")

</div>

> @alexandros wrote: Tip: Read the Forum Guidelines on requesting help: [https://discourse.gohugo.io/t/requesting-help/](https://discourse.gohugo.io/t/requesting-help/)

🙏

---

<div class="post-metadata">

**Author:** ![Rea](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rea/32/4669_2.png) [@Rea](https://discourse.gohugo.io/u/Rea)\
**Post date:** [November 28, 2017, 5:47pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/4 "2017-11-28T17:47:54Z")

</div>

> @alexandros wrote: [Static Index w/ Separate /blog?](https://discourse.gohugo.io/t/static-index-w-separate-blog/5665)

As that topic has more focus on RSS, I continue the question here. It’s mentioned there:

```
.
├── content
│ ├── _index.md
│ └── blog
│ ├── my-first-post.md
│ └── my-second-post.md
└── layouts
    ├── _default
    └── index.html

```

> @rdwatters wrote: You’ll also need layouts, etc, obviously… But index.html will pull content and front matter from `_index.md` plus whatever templating you put in.

But it’s not obvious to me! For example, I have chose [Bootstrap v4 Blog](https://themes.gohugo.io/hugo-theme-bootstrap4-blog/) theme for my blog. I use `hugo new` to create a new site and put it within themes. it works well and serves posts that are located in `/content/post`. this site is available via [example.com](http://example.com).

Now I have a template based on bootstrap that I want it to be the index of my site. the template has a part that can presents recent blog post that is implemented in Hugo codes. assets, such as CSS, are in common for both the template (site index) and the theme (blog).

From now, what are steps that I should follows?

If I put index.html of the template in /layouts, the index.html of `/themes/Bootstrap-v4-Blog` will be ignored!

---

<div class="post-metadata">

**Author:** ![alexandros](https://avatars.discourse-cdn.com/v4/letter/a/ecc23a/32.png) [@alexandros](https://discourse.gohugo.io/u/alexandros)\
**Post date:** [November 28, 2017, 5:59pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/5 "2017-11-28T17:59:09Z")

</div>

> [@Rea](#):
>
> If I put index.html of the template in /layouts, the index.html of /themes/Bootstrap-v4-Blog will be ignored!

Of course it will because you are overriding the theme’s `index.html` template. See: [Theme components | Hugo](https://gohugo.io/themes/customizing/#override-template-files)

To understand which template refers to what, you need to read about the templates lookup order [Template lookup order | Hugo](https://gohugo.io/templates/lookup-order/#readout)

---

<div class="post-metadata">

**Author:** ![hnarayanan](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/hnarayanan/32/4547_2.png) [@hnarayanan](https://discourse.gohugo.io/u/hnarayanan)\
**Post date:** [November 29, 2017, 8:58pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/6 "2017-11-29T20:58:26Z")

</div>

Here is the complete source code for my website that might be a helpful example: [https://github.com/hnarayanan/harishnarayanan.org](https://github.com/hnarayanan/harishnarayanan.org)

Some things to note:

1. `content/_index.md` and `layout/index.html` correspond to the home page of the site.
2. `layout/writing/list.html` corresponds to the “blog” section of the site, and the actual content for this is in `content/writing/`.

Hope that helps!

---

<div class="post-metadata">

**Author:** ![Rea](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/rea/32/4669_2.png) [@Rea](https://discourse.gohugo.io/u/Rea)\
**Post date:** [December 4, 2017, 12:08pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/7 "2017-12-04T12:08:55Z")

</div>

Thanks guys.

- The main index of site is handled by `/layouts/index.html`.
- The blog layout is handled by `/layouts/_default/list.html` and contents are grabed from files in `/contents/blog/post-*.md`.

It has implemented what I was asking for. Please read [this comment](https://discourse.gohugo.io/t/9466/2) if you want to have a site with an index and a blog.

Now, the only remained problem: post URLs are lack of date. It was expected for `[DOMAIN]/blog/2017/12/post-A.html`, but I get: `[DOMAIN]/blog/post-A.html`.

---

<div class="post-metadata">

**Author:** ![alexandros](https://avatars.discourse-cdn.com/v4/letter/a/ecc23a/32.png) [@alexandros](https://discourse.gohugo.io/u/alexandros)\
**Post date:** [December 4, 2017, 12:57pm UTC](https://discourse.gohugo.io/t/what-if-you-need-to-have-an-index-page-and-a-blog-for-your-site/9401/8 "2017-12-04T12:57:53Z")

</div>

> [@Rea](#):
>
> Now, the only remained problem: post URLs are lack of date. It was expected for [DOMAIN]/blog/2017/12/post-A.html, but I get: [DOMAIN]/blog/post-A.html.

See URLs configuration: [URL management | Hugo](https://gohugo.io/content-management/urls/)

You configure these in your `config`.

For example TOML looks like this:

> ```
> [permalinks]
> post = "/:year/:month/:title/"
> 
> ```
