[HUGO] 글작성, 문법, 이미지업로드 하기
개요
- 본 게시물은 hugo 의 Mainroad 테마를 기준으로 작성되었습니다.
- 이는 아래 작성된 내용들이 환경이나 표준과 다를 수 있음을 의미합니다.
파일 생성
수행 경로:
hugo 사이트 생성 경로 (hugo/my-site)hugo new {경로/파일명.md}를 통해 작성할 게시물 파일을 생성하는데,
이렇게 생성된 파일은hugo/my-site/
content폴더 아래 자동으로 생성됩니다.
생성 된 파일은hugo/my-site/archetypes/default.md에 작성된 템플릿을 기반으로 기본적인 내용이 작성되어져 있습니다..
hugo new dev/hugo/hugo.md- hugo/my-site/
content/dev/hugo/hugo.md 에 파일 생성.
내용 작성
해당 md 파일에 게시할 내용을 markdown 문법으로 작성함으로써 글 작성에 대한건 사실 끝입니다. (... 별거 없..)
다만, 문법을 알고 작성해야 텍스트 편집기로 대충 쓴 것 처럼 나오지 않으므로 아래 문법을 참고하여 작성하도록 합니다.
문법
하기 문법은 hugo-Mainroad 테마 (https://mainroad-demo.netlify.app/post/basic-elements/) 을 참고하여 작성되었으며
해당 테마에 최적화 되었으므로 일반적인 마크다운 문법과 약간 다를 수 있습니다.글자색 굵기 (BOLD)
** 별표2개 **글자 기울이기 (ITALIC)
* 별표1개 * _ 또는 밑줄 _링크
[대괄호에노출문구](괄호에주소)공간 한줄 띄우기
... 앞 문장에서 엔터처리 후.. 순번 리스트
1. First line 2. Second line 3. Third line순번없는 리스트
* First line * Second line * Third line중첩 리스트
* first line * first - 1 line * first - 1 - 1 line
목차
hugo.toml 파일 수정
... [Params] toc = true ...
## 1 뎁스 ### 2 뎁스 #### 3 뎁스인용
# 한줄 표현 > 인용 부분. > 여기가 인용이에요.. # 여러줄 표현 (붙여쓰기) > 한줄쓰고 오른쪽에 띄어쓰기를 두번 해줘야해요 (스페이스바)(스페이스바) > 그리고 여기에 쓰면 두줄이 붙어서 보이게 됩니다. # 여러줄 표현 (한줄 띄우기) > 여기도 인용이고 > > 여기도 인용이네요? > > 이렇게 그냥 빈줄을 놔두시면 돼요.. >
* 테이블
```markdown
# 기본 테이블
| COL_1 | COL_2 | COL_3 | COL_4 |
| ------- | ------- | ------- | ------- |
| ROW_1_1 | ROW_1_2 | ROW_1_3 | ROW_1_4 |
| ROW_2_1 | ROW_2_2 | ROW_2_3 | ROW_2_4 |
# 테이블 정렬 ( 콜론 (:) 위치에 따라서 정렬된다)
| COL_1 | COL_2 | COL_3 |
| :------ | :-------: | ------: |
| 좌측정렬| 가운데정렬| 우측정렬|
# 테이블에 마크다운 적용도 가능
| 기울이기 | 굵게 | 취소선 | 강조 |
| *italic* | **bold** | ~~cancel~~ | `effect` |코드 블럭
```markdown 여기는 마크다운 코드블럭입니다. Mainroad theme 에서 ```{타입} 으로 설정 시 해당 타입에 맞는 코드블럭 스타일로 작성됩니다. ```html 이렇게 하면 HTML 코드블럭이 되는거죠...강조
`back quote` 으로 씌어진 곳은 옅은 회색 배경과 빨간색으로 문구가 강조됩니다
이미지 업로드
이미지를 별도 웹사이트에 존재 하는걸 노출할게 아니라면 현재 테마 폴더 내에 위치시켜야 합니다.
Mainroad 기준 이미지가 위치할 기본 경로는
hugo/my-site/theme/mainroad/static/img/입니다.그리고 경로는
/img부터 작성하도록 합니다. (아래 예시는 위 기본 경로 아래로posts/hugo폴더를 생성하여hugo-image.png파일을 위치 시킴) 예시) 