2024-09-29 21:48:56 +00:00
+++
description = "Adding Custom Output Formats"
2024-10-08 20:28:16 +00:00
title = "Output Formats"
weight = 6
2024-09-29 21:48:56 +00:00
+++
2024-10-07 13:30:53 +00:00
In addition to the [output formats coming with the theme ](configuration/sitemanagement/outputformats ), you can create your own [output formats ](https://gohugo.io/templates/output-formats/ ).
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
## Starting from Scratch
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
If you want to add a new output format called `myformat` that outputs HTML and you want to build everything yourself without using the theme's components:
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
1. Create a file `layouts/_default/baseof.myformat.html`
2. Implement all the necessary code in this file
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
## Using the Theme's Structure
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
If you want to keep the general framework and only change specific parts, you can override these files:
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
- `layouts/_default/views/article.html` : Controls how a page's content and title are displayed
- `layouts/_default/views/body.html` : Determines the page body structure
- `layouts/_default/views/menu.html` : Defines the sidebar menu layout
- `layouts/_default/views/storeOutputFormat.html` : Stores the output format name for use in the framework
2024-09-29 21:48:56 +00:00
2024-10-07 13:30:53 +00:00
For a real-world example, check out the `print` output format implementations
- [`layouts/_default/views/body.print.html` ](https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/views/body.print.html )
- [`layouts/_default/views/menu.print.html` ](https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/views/menu.print.html )
- [`layouts/_default/views/storeOutputFormat.print.html` ](https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/views/storeOutputFormat.print.html )