티스토리 공감버튼 주변에 글자 써넣기 - feat.공감구걸

블로그 활동 열심히 하는데, 댓글도 없고 공감하는 분들도 없고..

다른 분들에게 조금이라도 도움이 되었으면 하고 +알파의 이유로

블로그를 시작했어도

무공감, 무플의 섭섭함은 이루 말할 수 없습니다.

그래서 티스토리를 사용하시는 블로거 분들은 방문자 분들께서 공감 버튼을 눌러주십사

공감 버튼이 눈에 잘 띄도록 이미지나 글자 등으로 

공감버튼을 눌러달라고 부탁을 하기도 합니다.

제 블로그도 일일 방문자 수가 형편없기에.. 한번 시도해 보려고 합니다. ㅜㅠ

티스토리 관리자 모드에서 

꾸미기 -> HTML/CSS 편집 메뉴로 이동 하면 위 화면이 나옵니다.

거기에서 CSS 를 선택하고 맨 아래로 이동을 한 후에 아래의 css code를 붙여 넣기 하시면, 지금 보시는 제 블로그 처럼 공감 버튼 위에 글자를 찍을 수 있습니다. 만약 아래쪽에 공감버튼을 넣고 싶으실 때는 top: -1.5em;을 top: 2.5em; 등으로 플러스값으로 잘 조정해 보시면 됩니다.

.daum_like_wrapper {
	float: right;
	width: 320px;
	position: relative;
	margin-right: 30%;
}

.daum_like_wrapper:before {
	white-space: pre;
	color:red;
	content: '★ 도움이 되었다면 ▽ 공감으로 격려 ★';
	position: absolute;
	top: -1.5em;
	left: 0em;
	text-align: center;
}

@media screen and (max-width:620px) {
	.daum_like_wrapper {
		float:none;
		width:100%;
		position: relative;
		margin-right:0;
		padding-top:3.5em;
	}

	.daum_like_wrapper:before {
		white-space: pre;
		color:red;
		content: '★ 도움이 되었다면 ▽ 공감으로 격려 ★';
		position:absolute;
		top: 0;left: 0;right:0;
		text-align: center;
		padding-top:1em;
	}
}

도움이 되셨다면 아시겠죠? 힘을내요~슈퍼파워~~얼~