새 에디터 인용구 적용 되지 않는 문제 해결

Tistory/전달 사항 2020. 2. 11.

네.. 또 티스토리에서 바꿔서 이런 문제가 생겼습니다.

(아니 쓰잘데기 없이 왜 자꾸 바꾸는지 도통 이해가 안되네)

 


쉽게 설명하면

 

.tx-quote-tistory 는 기존 에디터(구에디터)의 인용구

 

#tt-body-page blockquote[data-ke-style='normal'] 는 기존 새 에디터의 인용구 1

#tt-body-page blockquote[data-ke-style='style2']는 변경된 새 에디터의 인용구 1

 

#tt-body-page blockquote[data-ke-style='box'] 는 기존 새 에디터의 인용구 2

#tt-body-page blockquote[data-ke-style='style3']는 변경된 새 에디터의 인용구 2

 

 

간단하게 normal을 sytle2로, box를 style3으로 바꾸면 적용이 될 것 같겠지만.
기존에 새 에디터로 작성하신 글은 여전히 normal과 box로 적용이 되기 때문에, 기존에 새 에디터로 인용구를 사용하여 작성한 글이 있다면 변경 할 경우 그 글은 적용이 안되게 됩니다. 그러니까 normal과 box 와는 별개로 옆에 콤마를 붙여 추가해주면 됩니다.

 

아래 안내를 참고하여 css 수정을 하세요.

수정 후에는 스킨에 따라 다른 곳에 더 있을 수 있으니 위에 안내드린 주황색 부분을 검색해서 추가로 수정합니다.


(더보기와 마찬가지로 또 수정할지 모르니 어느정도 안정이 되었다 싶으면 기존 스킨들 업데이트 하겠습니다.. 제가... 스킨이 너무 많네요....)

 

/* 인용구1 */
.tx-quote-tistory,
blockquote[data-ke-style='normal'],
#tt-body-page blockquote[data-ke-style='normal'] {
	~
	~
	~
}

/* 기존 소스가 위와 같이 있다면 아래와 같이 수정 */

.tx-quote-tistory,
blockquote[data-ke-style='normal'],
#tt-body-page blockquote[data-ke-style='normal'],
blockquote[data-ke-style='style2'],
#tt-body-page blockquote[data-ke-style='style2'] {
	~
	~
	~
}

.tx-quote-tistory:before,
blockquote[data-ke-style='normal']:before,
#tt-body-page blockquote[data-ke-style='normal']:before {
	~
	~
	~
}

/* 기존 소스가 위와 같이 있다면 아래와 같이 수정 */

.tx-quote-tistory:before,
blockquote[data-ke-style='normal']:before,
#tt-body-page blockquote[data-ke-style='normal']:before,
blockquote[data-ke-style='style2']:before,
#tt-body-page blockquote[data-ke-style='style2']:before {
	~
	~
	~
}

/* :before가 아니더라도 ~~~:after / a / a:hover 등이 있으면 위와 같은 방식으로 추가하면 됩니다 */


/* 인용구2 */
blockquote[data-ke-style='box'],
#tt-body-page blockquote[data-ke-style='box'] {
	~
    ~
    ~
}

/* 기존 소스가 위와 같이 있다면 아래와 같이 수정 */

blockquote[data-ke-style='box'],
#tt-body-page blockquote[data-ke-style='box'],
blockquote[data-ke-style='style3'],
#tt-body-page blockquote[data-ke-style='style3'] {
	~
    ~
    ~
}

/* 마찬가지로 뒤에 :before / :after / a / a:hover 등이 있으면 위와 같은 방식으로 추가하면 됩니다 *
 
728x90
반응형