본문 바로가기
디지털 노마드 공부/블로그스팟

구글 블로그스팟 대표 이미지 설정하기

by 애드센드 2023. 2. 3. 06:17

블로그스팟은 대표 이미지가 무조건 첫 이미지가 나오게 되어있다. 이 부분을 우리가 원하는 이미지로 변경을 해 줄 수 있다. html 코드를 사용한 일종의 편법이라고 할 수 있다.

 

 

블로그스팟 대표 이미지 가져오기

블로그 스팟의 대표 이미지는 무조건 첫 번째 이미지이다. 내가 업로드를 한 이미지 일 수도 있고, 링크를 가져온 이미지 일 수도 있고, 쿠팡 광고 코드를 타고 온 이미지 일 수도 있다. 하지만, 마지막 이미지를 대표 이미지로 사용하고 싶다.

 

1) 대표 이미지 코드

이미지를 가져오는 코드를 포스팅의 맨 첫 줄에 넣어 준다. 이게 전부이다.

<img src="이미지 주소" style="display: none;" alt="n" />

2) 사용예

- 코드 삽입

블로그스팟 텍스트 편집기의 HTML 보기 화면의 첫 번째 줄에 위의 코드를 삽입한다. 

- 이미지 주소 넣기

이미지 주소라고 적혀있는 부분에 본인이 넣고자 하는 이미지 주소를 복사해서 붙여 넣으면 된다. 이미지 주소는 코드화가 되어 있어서 "jpeg"와 같은 이미지 확장자를 검색해서 찾는 것이 빠르다. 보통은 "고양이 장화"와 같이 그림 설명 옆에 있다. 이미 사진인 업로드되어 있는 상태여야 한다.

- Alt

이 부분은 내가 추가 한 부분이다. 구글에서 검색해서 나오는 다른 분들 코드에는 없다. Alt 내용은 오리지널 사진이 있는 곳에 넣으면 된다. 그런데, 이 코드를 사용하면 빙 Seo 체크기 같은 데서 alt 에러가 나온다. 때문에 그냥 alt="n"을 넣어줌으로써 슬쩍 문제없이 넘어가는 것이다. 어차피 이미지 재사용 코드이기 때문에 크게 문제가 되지 않는다.

 

대표 이미지 설정 코드와 고양이 사진
이미지 올린 후 HTML 화면 보기

이게 검색 노출에 크게 영향을 주는 것은 아니지만, 그래도 디자인 관점에서 필요한 것 같다. 개인만족이라고 하는 것이 맞는 것 같다. 알아두면 좋은 코드 한 줄이다.

 

구글 블로그스팟 설정 방법 가이드 - 블로그 기본 셋팅

 

구글 블로그스팟 설정 방법 가이드 - 블로그 기본 셋팅

구글 블로그인 블로그스팟을 처음 사용할 때 느끼는 가장 큰 문제는 "설정을 어떻게 하는가"이다. 블로그 설정 메뉴에 들어가면 티스토리와는 다른 생소한 용어들과 설정 방법이 블로그스팟을

nodigitalmad.tistory.com

포토스케이프X, 블로그 이미지 편집을 위한 콜라주 마스터

 

포토스케이프X, 블로그 이미지 편집을 위한 콜라주 마스터

포토스케이프 X는 블로그를 사용자를 위해서, 최적화된 이미지 편집 프로그램입니다. 사진이나, 일러스트 등 이미지를 빠르고 편하게 사용할 수 있으며, 프로그램 자체도 포토샵 같이 무겁지 않

nodigitalmad.tistory.com

 

댓글


loading