네이버 밴드 워드프레스 글 공유 시 썸네일 안 보이는 이유와 해결 방법
네이버 밴드를 시작 한지 약 4개월 정도 되었습니다. 그동안은 구글 블로거에 있는 글을 네이버 밴드에 공유 했었는데요.
워드프레스를 시작하면서 작성된 글을 네이버 밴드에도 공유하기 시작했습니다.
그런데 문제가 생겼습니다. 네이버 밴드에 공유한 글에 썸네일이 보이지 않는 것입니다. 구글 블로거 할 땐 이러지 않았는데 말입니다.
도대체 네이버 밴드에 워드프레스 글을 공유하면 썸네일이 보이지 않는지 원인과 해결 방법을 알아보겠습니다.
워드프레스 글 공유, 썸네일 안 보이는 원인
진짜 많은 곳을 찾아 보며, 다양한 원인을 알게 되었는데요. 저는 워드프레스 글, 네이버 밴드에 공유 시 썸네일이 안 보이는 문제를 딱 4가지로 추렸습니다.
- 대표 이미지 설정 안함
- OG 태그 설정 안됨
- 지원하지 않은 이미지 확장자 사용
네이버 밴드 공유 시 썸네일 보이게 만든 방법
다양한 검색 사이트에 찾은 글들은 어려운 단어들과 복잡한 설명으로 이해가 어려웠습니다.
며칠 동안 전문 용어를 하나하나 찾아 알아보며, 결국 문제를 해결하는데 성공했습니다.
블로그 글 공유 시 보이지 않던 썸네일을 어떻게 보이게 만들었는지 지금 바로 쉽게 설명해 보겠습니다.
대표 이미지 설정 확인
워드프레스 대표 이미지는 글이나 페이지를 대표하는 썸네일 사진을 뜻합니다.
블로그 목록, 메인 화면, SNS 공유, 검색 결과 미리 보기 등에 자동으로 표시되는 핵심 이미지를 설정 했는지 확인해봐야 합니다.
글 편집 모드에 들어가서 우측 상단 ‘설정’을 누르면 우측 창이 나옵니다. 상단에 ‘글’을 클릭하면, 바로 ‘대표 이미지 설정’이 보이게 됩니다.
이곳에 아무 사진이 보이지 않는다면, 대표 이미지 설정을 하지 않은 겁니다. ‘대표 이미지 설정’을 마우스로 클릭해 사진을 등록 해 줍니다.
OG (Open Graph Tag) 확인
가장 먼저 확인 해 보실 건 OG 태그 입니다.
OG 태그란 Open Graph Tag 약자로 페이스 북, 네이버(카페, 블로그, 밴드), 카카오 톡 등, 공유할 때 어떤 제목, 이미지, 설명이 보여야 하는지 정해주는 HTML 메타 그 입니다.
예컨대, 아래 코드가 첨부되 있어야 썸네일이 제대로 표시 되는 것이죠.
<meta property="og:title" content="글 제목" />
<meta property="og:description" content="글 설명" />
<meta property="og:image" content="https://example.com/image.jpg" />
<meta property="og:url" content="https://example.com/post" />자세한 설명이 없어 찾는데 어려웠지만, 결국 알아냈습니다. 확인하는 방법은 매우 간단합니다.
첫 번째로 블로그 글을 중 확인하고 싶은 걸 보기로 띄웁니다. 키보드 ctrl + U 누르면, html이 가득한 어려운 글들이 나오게 되는데요.
ctrl + F 눌러 찾기로 위 코드 ‘og:title’, ‘og:description’, ‘og:image” content=’, ‘og:url” content=’를 차례대로 찾아 확인해 봅니다.
만약 코드가 없다면, 썸네일이 표시되지 않는 원인을 찾은 겁니다.
‘og:title’은 썸네일 제목을 ‘og:description’은 블로그 설명 글을 나타내는데 쓰입니다.
또한 ‘og:image” content=’은 썸네일 이미지 경로를 나타내며, ‘og:url” content=’은 사이트 이름을 입력하는 곳입니다.
결론적으로 이곳을 정확하게 입력되어 있어야만, 블로그 글을 공유했을 때, 이미지와 제목 그리고 설명이 제대로 표시 되는 것입니다.
지원하지 않는 이미지 확장자 사용
이미지 확장자 WEBP는 압축 효율이 좋으면서 화질이 뛰어납니다. 그래서 글을 작성할 때 자주 사용되는 이미지 확장자 중 하나 입니다.
하지만, 무슨 이유인지는 모르겠지만, WEBP 확장자 파일로 대표 이미지를 지정하면, 썸네일이 제대로 표시되지 않는 경우가 발생됩니다.
실제로 네이버 밴드의 경우는 워드프레스에서 대표 이미지와 OG(Open Graph Tag) 모두 정상 등록 되어있는데 불구하고 썸네일이 표시되지 않았습니다.
구글 블로그는 WEBP를 사용해도 네이버 밴드에 썸네일 표시가 잘 되는데 말이죠.
이유는 이렇습니다. 원래 WEBP는 네이버 밴드에서 썸네일로 등록이 되어도 표시되지 못하는 확장자 입니다.
다만 구글 블로그의 경우 WEBP를 사용해도 자체 시스템에서 자동으로 JPEG 확장자로 변경해 보여지게 만듭니다.
워드프레스의 경우 구글 블로그처럼 자동으로 변환해주는 기능이 없어 네이버 밴드 썸네일에 사진이 표시되지 않았던 겁니다.
귀찮더라도 공유 시 대표 이미지가 잘 보이도록 만들려면 확장자를 JPEG로 바꿔 등록 하는 게 좋습니다.
마치며
JPEG보다 뛰어난 WEBP를 워드프레스 대표 이미지에 사용하지 못한다는 점은 굉장한 단점이라 생각됩니다.
사진 용량의 크기가 작으면 작을 수록 트래픽 용량에 대한 부담이 적어집니다. 그래서 블로거 들은 JPEG보다 WEBP 확장자 사용을 더 선호합니다.
워드프레스에도 대표 이미지를 WEBP 사진으로 업로드 해도 자동으로 JPEG로 인식되도록 만드는 플러그인이 있을지 모르겠습니다.
