구글 블로그는 티스토리와 네이버 블로그와 달리 에디터가 아주 구식이다. 예로 티스토리에서 글에 사진을 삽입한 후 에디터에서 간단히 테두리를 만들 수 있지만 구글 블로그에서는 그렇게 할 수 없다. 이 문제를 어떻게 해결할까 고민했다.
리눅스에서 캡쳐 프로그램인 셔터에도 테두리 만드는 기능이 없어 플러그인으로 해결 아니면 김프로 해결하느냐 문제에 직면했다. 구글 블로그는 티스토리와 같이 CSS를 지원하므로 CSS로 해결하고자 했다.
관리 > 테마의 HTML 편집에서 CSS 삽입으로 이 문제를 해결하고자 했다. 문제는 글 내용 부분의 태그를 아는 것이었는데 HTML 편집 부분을 보니 post-body가 내용 같은 생각이 들었다.
그래서 HTML 편집에 .post-body img { border:2px solid #d2d2d2; } 이라는 문구를 넣었다. 그랬더니 아래 그림을 보듯이 테두리가 만들어졌다. 참고로 아래 그림은 테두리가 없다.
그리고 마우스 포인터를 사진에 올리면 테두리가 변하게 하기 위해 .post-body img:hover { border:2px solid #000000; }라고 테두리 색을 변경했다.
이런 것이 블로그에서 HTML을 지원하면 장점이 된다. 내가 티스토리를 운영해서 애드센스 수익보다 멋스러운 것을 강조하는 경향이 있다.
다른 테마에서도 내용이 post-body인지 모르겠다. 내가 구글 블로그를 오래했지만 자세히 모른다. 맺으면서 테두리가 없는 흰색 사진을 삽입한다. CSS로 테두리를 만들었으니 흰색 사진이 보인다.
0 댓글