Papermod

TODO 아이콘 표시 및 구조 파악해서 이를 적용하기 2022-09-08 - 내용 수정, 그림파일 링크 관련 추가 PaperMod screen shot Intro hugo의 테마 중에 가장 간결하고 안정적이며 많은 사람들이 사용하고 있다. hugo 프로젝트는 ~/www로 가정한다. 주의할 것은 hugo의 구조가 ~/www/contents/이하에 markdown 파일을 넣어주어야 하고, 이하 폴더는 적절히 만들되 index.md파일은 만들면 웹페이지 메인 화면에 내용이 뜨질 않는다는 점이다. 설정은 ~/www/config.yml이다. 설정을 변경하면 hugo -D server 동작시 자동으로 반영된다. 만약 설정 변경 사항이 브라우저에서 보이지 않으면 서버를 재실행 한다. Install and Update Install $ cd ~/www $ git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod --depth=1 Update $ cd themes/PaperMod $ git pull Setup 관련 링크 아래 사이트에 config.yml 및 post.md 샘플이 있으니 참고한다. https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-installation/ 테마 설정 papermod 의 테마는 light/dark/auto 가 있다. 홈화면 좌측 상단에 해/달 아이콘 클릭 baseURL: "https://your_idname.github.io/" # 자신의 깃페이지 URL title: My Blog and wiki # 블로그홈 제목 paginate: 5 # 홈에서 보여줄 블로그 표시 갯수 theme: "PaperMod" # 테마 PaperMod로 지정 params: # defaultTheme: light # defaultTheme: light defaultTheme: auto # auto로 설정하면 사용자가 바꿀 수 있다. # disableThemeToggle: true # 해/달 아이콘을 보이지 않게 하기 메뉴설정 홈 우측 상단 메뉴를 다음과 같이 추가한다. menu: main: - identifier: categories # 블로그 카테고리 메뉴 name: categories url: /categories/ weight: 10 - identifier: search # 블로그 검색 메뉴 name: Search url: /search weight: 30 - identifier: tags # 블로그 태그 메뉴 name: tags url: /tags/ weight: 20 - identifier: archives # 블로그 태그 메뉴 name: tags url: /tags/ weight: 20 Archive Page - 아카이브 페이지, 날짜별로 올린 포스트문서가 정리됨 $ cat << EOF > ~/www/content/archives.md --- title: "Archive" layout: "archives" # url: "/archives" summary: "archives" --- EOF Search Page - 검색페이지, 퍼지 스타일의 빠른 검색 $ cat << EOF > ~/www/content/search.md --- title: "Search" # in any language you want layout: "search" # is necessary # url: "/archive" # description: "Description for Search" summary: "search" placeholder: "검색어를 입력하세요" --- EOF tags와 categories는 올릴 포스트문서 post.md 등의 frontmatter에 기록하면 자동으로 분류되고 홈 상단 메뉴에서 볼 수 있다. Post Cover Image ~/www/config.yml에 설정해주고 아래 설명대로 포스트문서에 링크를 걸어주면 된다. cover: image: "<image path/url>" # can also paste direct link from external site # ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png alt: "<alt text>" caption: "<text>" relative: false # To use relative path for cover image, used in hugo Page-bundles 이미지 사이즈를 줄이고 처리속도를 높이려면 아래 설정 추가 params: cover: responsiveImages: false 그러나 실제로 적용해도 페이지는 변화하지 않는다. ...

History 2025-06-27 - tip 추가: tags, categories list에 cover image 표시하기 2022-09-08 - 내용 수정, 그림파일 링크 관련 추가 PaperMod screen shot Intro hugo의 테마 중에 가장 간결하고 안정적이며 많은 사람들이 사용하고 있다. hugo 프로젝트는 ~/www로 가정한다. 주의할 것은 hugo의 구조가 ~/www/contents/이하에 markdown 파일을 넣어주어야 하고, 이하 폴더는 적절히 만들되 index.md파일은 만들면 웹페이지 메인 화면에 내용이 뜨질 않는다는 점이다. 설정은 ~/www/config.yml이다. 설정을 변경하면 hugo -D server 동작시 자동으로 반영된다. 만약 설정 변경 사항이 브라우저에서 보이지 않으면 서버를 재실행 한다. Install and Update Install $ cd ~/www $ git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod --depth=1 Update $ cd themes/PaperMod $ git pull Setup 관련 링크 아래 사이트에 config.yml 및 post.md 샘플이 있으니 참고한다. https://adityatelange.github.io/hugo-PaperMod/posts/papermod/papermod-installation/ 테마 설정 papermod 의 테마는 light/dark/auto 가 있다. 홈화면 좌측 상단에 해/달 아이콘 클릭 baseURL: "https://your_idname.github.io/" # 자신의 깃페이지 URL title: My Blog and wiki # 블로그홈 제목 paginate: 5 # 홈에서 보여줄 블로그 표시 갯수 theme: "PaperMod" # 테마 PaperMod로 지정 params: # defaultTheme: light # defaultTheme: light defaultTheme: auto # auto로 설정하면 사용자가 바꿀 수 있다. # disableThemeToggle: true # 해/달 아이콘을 보이지 않게 하기 메뉴설정 홈 우측 상단 메뉴를 다음과 같이 추가한다. menu: main: - identifier: categories # 블로그 카테고리 메뉴 name: categories url: /categories/ weight: 10 - identifier: search # 블로그 검색 메뉴 name: Search url: /search weight: 30 - identifier: tags # 블로그 태그 메뉴 name: tags url: /tags/ weight: 20 - identifier: archives # 블로그 태그 메뉴 name: tags url: /tags/ weight: 20 Archive Page - 아카이브 페이지, 날짜별로 올린 포스트문서가 정리됨 $ cat << EOF > ~/www/content/archives.md --- title: "Archive" layout: "archives" # url: "/archives" summary: "archives" --- EOF Search Page - 검색페이지, 퍼지 스타일의 빠른 검색 $ cat << EOF > ~/www/content/search.md --- title: "Search" # in any language you want layout: "search" # is necessary # url: "/archive" # description: "Description for Search" summary: "search" placeholder: "검색어를 입력하세요" --- EOF tags와 categories는 올릴 포스트문서 post.md 등의 frontmatter에 기록하면 자동으로 분류되고 홈 상단 메뉴에서 볼 수 있다. Post Cover Image ~/www/config.yml에 설정해주고 아래 설명대로 포스트문서에 링크를 걸어주면 된다. cover: image: "<image path/url>" # can also paste direct link from external site # ex. https://i.ibb.co/K0HVPBd/paper-mod-profilemode.png alt: "<alt text>" caption: "<text>" relative: false # To use relative path for cover image, used in hugo Page-bundles 이미지 사이즈를 줄이고 처리속도를 높이려면 아래 설정 추가 params: cover: responsiveImages: false 그러나 실제로 적용해도 페이지는 변화하지 않는다. ...

소개 마크다운 문서를 vimwiki로 작성하여 간단한 메모에서 부터 블로그, 리포트, 기술 문서에 이르기까지 손쉽게 만들 수 있다. 이를 기반으로 하여 깃허브에서 제공하는 무료 웹사이트에 올리는 방법을 설명하고자 한다. 아래는 간략한 개요이다. vimwiki + hugo + github.io 를 연결하는 프로젝트이다. vim의 vimwiki 플러그인을 사용하여 위키문서를 작성한다. 위키문서의 작성은 마크다운(markdown) 문법으로 한다. hugo를 사용하여 임시 로컬웹서버를 띄우고 위키문서를 html로 변환하고 브라우저에서 확인한다. 변환된 정적 html 문서를 깃허브에 올린다. 깃허브 페이지에서 이를 확인한다. UTF-8인코딩이라면 한글도 특별히 문제가 없고 잘 된다. 다만 마크다운 파일명에 공백이 들어가면 관리가 좋지 않으니 -등으로 연결해서 쓴다. 설치 환경 OS 및 프로그램 버전 ...

소개 마크다운 문서를 vimwiki로 작성하여 간단한 메모에서 부터 블로그, 리포트, 기술 문서에 이르기까지 손쉽게 만들 수 있다. 이를 기반으로 하여 깃허브에서 제공하는 무료 웹사이트에 올리는 방법을 설명하고자 한다. 아래는 간략한 개요이다. vimwiki + hugo + github.io 를 연결하는 프로젝트이다. vim의 vimwiki 플러그인을 사용하여 위키문서를 작성한다. 위키문서의 작성은 마크다운(../markdown) 문법으로 한다. hugo를 사용하여 임시 로컬웹서버를 띄우고 위키문서를 html로 변환하고 브라우저에서 확인한다. 변환된 정적 html 문서를 깃허브에 올린다. 깃허브 페이지에서 이를 확인한다. UTF-8인코딩이라면 한글도 특별히 문제가 없고 잘 된다. 다만 마크다운 파일명에 공백이 들어가면 관리가 좋지 않으니 -등으로 연결해서 쓴다. 설치 환경 OS 및 프로그램 버전 ...