네이버 웹마스터 도구의 웹 페이지 최적화 검증을 하는 경우 다른 항목은 모두 잘 인식되고 있는데 모바일 상용성의 앱링크 부분만 붉은색 엑스자가 뜨면서 '페이지와 연동되는 모바일 앱 링크가 존재하지 않습니다'라고 뜨는 경우가 있습니다.
이 부분은 실제 연동된 앱이 없기 때문에 당연히 빨간색으로 엑스가 뜨는 것이 정상입니다. 그럼에도 모두 그린 라이트인데 한 가지라도 빨간불이면 찝찝한 기분이 남기 때문에 이 부분을 해결해하는 방법을 알아보겠습니다.
이 부분을 해결하기 위해서 먼저 앱링크의 물음표를 클릭해 봅니다. 그러면 두 가지 경우가 나옵니다.
먼저 위와 같이 나오는 경우 아래 매타 태그 소스를 복사합니다.
<meta property="al:ios:url" content="applinks://docs" />
<meta property="al:android:url" content="applinks://docs" />
복사를 완료 했다면 티스토리 블로그 관리탭으로 옵니다. 꾸미기 탭에서 스킨 편집을 누루고 html 편집에 들어가 <head> 아래 적당한 곳에 복사한 태그 소스를 붙여 넣습니다.
head 부분에는 메타태그가 많기 때문에 구분을 할 수 있도록 해주는 것이 헷갈리지 않고 나중에 찾기 쉽습니다.
적용을 누루고 창을 닫고 나오면 앱링크 오류 해결 작업이 완료된 것입니다.
앱링크에 관한 자세한 정보는 https://applinks 에서 확인할 수 있습니다.
혹시라도 'HTML 문서와 연결되는 모바일 앱링크입니다. 자세한 내용은 웹표준 HTML 마크업 가이드를 참고하세요' 라고 나오는 경우 라면 '웹 표준 HTML 마크 업 가이드' 부분에 밑줄이 있는 것을 확인할 수 있을 것입니다.
이경우네는 '웹표준 HTML 마크업 가이드' 부분을 클릭해 들어갑니다.
클릭을 하면 다음과 같은 화면으로 연결되며 '모바일 앱 연결' 항목에 다음과 같은 코드가 나올 것입니다.
<head>
<meta property="al:ios:url" content="applinks://docs">
<meta property="al:ios:app_store_id" content="12345">
<meta property="al:ios:app_name" content="App Links">
<meta property="al:android:url" content="applinks://docs">
<meta property="al:android:app_name" content="App Links">
<meta property="al:android:package" content="org.applinks">
<meta property="al:web:url" content="http://applinks.org/documentation">
</head>
<head>부터 </head>까지의 사이에 있는 태그를 모두 복사합니다.
다음으로 티스토리 블로그 관리항목으로 와서 꾸미기-스킨 편집을 클릭해 줍니다. 스킨 편집을 클릭하고 다시 html 편집을 클릭한 다음 메타태그들이 있는 <head>와 </head> 적당한 곳에 붙여 넣습니다. 적용을 눌러주면 작업이 완료된 것입니다.
다음으로 다시 네이버 웹마스터 도구로 돌아와 웹페이지 최적화 검증에서 확인을 누르면 앱링크 부분이 그린으로 바뀐 것을 확인할 수 있을 것입니다.
이로써 앱링크의 '웹 페이지와 연동되는 모바일 앱 링크가 존재하지 않습니다'라는 오류를 해결할 수 있습니다.
'IT > 티스토리 블로그 관리팁' 카테고리의 다른 글
티스토리 맞춤법 검사 오류 해결 (0) | 2020.06.16 |
---|---|
티스토리 글쓰기 본문 특정 영역 복사 허용 방법 (1) | 2020.06.14 |
사이트 소유권 확인 간단하게 하기(네이버 웹마스터 도구 사이트 등록 ) (0) | 2020.06.12 |
RSS 제출 오류 'RSS 본문크기를 줄여주세요' '올바른 rss 가 아닙니다.' (0) | 2020.06.12 |
네이버 웹마스터 도구 사이트 등록 , 사이트 맵, Rss 등록하기 (0) | 2020.06.11 |