hexo 블로그를 꾸며보자!! 블로그의 위젯을 다루어보자!!

안녕하세요.

굳헬로 @goodhello 입니다.

어제는 hexo 블로그의 로고도 바꾸어 보고, 상단과 하단의 navbar와 footer를 고쳐보면서 블로그를 꾸며 봤는데요.

오늘은 이어서 hexo 블로그의 위젯들을 한번 살펴보고 수정해보도록 하겠습니다.

hexo 블로그에 접속해보면 다음과 같이

왼쪽 오른쪽으로 다양한 위젯들이 보입니다.

이 위젯들은 역시 테마의 _config.yml 파일을 수정하여 관리할 수 있는데요.

_config.yml을 열어보면 widgets 이라는 항목에 블로그의 위젯들이 배치되어 있습니다.

위젯의 이름은 type으로 정의 되어 있고, 왼쪽 오른쪽에 배치하는 position을 정하고, 추가적인 정보를 넣을 수 도 있습니다.

# https://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/
widgets:
    -
        # Widget name
        type: profile
.
.
.

    -
        # Widget name
        type: links
        # Where should the widget be placed, left or right
        position: left
        # Links to be shown in the links widget
        links:
            Hexo: 'https://hexo.io'
            PPOffice: 'https://github.com/ppoffice'
.
.
.
    -
        # Widget name
        type: recent_posts
        # Where should the widget be placed, left or right
        position: right
.
.
.

그리고 각각의 위젯은 - 으로 구분되어 있는데요.

시험삼아 필요없어 보이는 위젯인

LINKS 위젯을 지우려면

-를 포함한 type이 links인 위젯 코드를 삭제하면 되겠습니다.

    -
        # Widget name
        type: links
        # Where should the widget be placed, left or right
        position: left
        # Links to be shown in the links widget
        links:
            Hexo: 'https://hexo.io'
            PPOffice: 'https://github.com/ppoffice'

위의 links 위젯 부분을 모두 삭제하면

블로그에서 LINKS 위젯이 삭제된 걸 확인할 수 있습니다.

그리고 현재는 위젯이 좌우 양쪽으로 나와서 본문 내용이 작아 보이는데, 모든 위젯을 왼쪽으로 이동시키고 싶어지네요.

간단하게 위젯 중에 position 이 right인 위젯들을 left로 바꿔 주면 되겠습니다.

이제 제가 좋아하는 스타일인 왼쪽에는 메뉴, 오른쪽에는 본문이 나오게 되었네요.

각자 취양에 맞게 조절하시면 될 것 같습니다.

그나저나 저기 CATEGORIES 가 비어 있네요.

카테고리는 앞으로 블로그에서 중요한 역할을 담당할 것 인데요.

카테고리에 대해서는 다음 시간에 제대로 다루어 보기로 하겠습니다.

그럼 오늘은 여기까지!!!

오늘 하루도 파이팅 하시고~ 행복한 하루 보내시길 바래요~