티스토리 버튼 만들기 – 아주 쉬워요

바로가기 버튼을 만들어 봅시다

티스토리 블로그 작성 시에 서식으로 링크 버튼 생성하는 방법입니다.

아래와 같은 버튼이 만들어지고, 버튼 이름을 변경 후에 링크 정보 입력하시면 간단히 버튼 완성이 됩니다.

만약 다른 디자인으로 변경을 하고 싶으시면 코드를 변경하시면 됩니다. 아래 링크의 사이트로 접속을 하시면 아주 쉽게 원하는 색상, 모양, 글씨체 등으로 변경이 가능하고 코드 또한 쉽게 생성이 됩니다.(아래 버튼을 누르시면 사이트로 이동합니다.)

위 링크를 클릭하시면 아래창이 뜨는데 Button Generator를 이용해서 버튼 디자인이 가능합니다.

사이트에 접속을 하셔서 원하시는 디자인으로 변경하신 후에 디자인된 버튼(위 캡쳐의 ‘Green’)을 클릭을 해보시면 오른쪽 화면에 코드가 생성이 됩니다. 아래와 같이 코드가 생성이 되는데 빨간 줄 아래 부분(.myButton{)을 모두 복사를 하신 후에 티스토리 > 스킨편집 > html편집 > CSS 메뉴에서 가장 하단에 붙여넣기 하시면 됩니다.

아래와 같이 붙여넣기를 하시고, color 오른쪽에 색상코드 뒤에 !important; 를 입력하고 저장하기 하세요.

그러고 나서 다음 작업을 해주시면 됩니다.

관리 > 서식관리 > 서식쓰기 > 오른쪽 메뉴에서 HTML 선택 한 후, 아래의 코드를 입력한 후 저장하세요.

버튼 만들기가 완료가 되었습니다. 그러면, 이제 확인을 해봐야겠죠?

블로그 글쓰기에서 우측 상단에 있는 메뉴를 누르시고, 서식을 눌러 보시면 바로가기 버튼이라는 제목의 서식이 있을겁니다. 그걸 누르시면 아래와 같이 ‘버튼이름 바로가기’가 생성이 됩니다. 그리고, 왼쪽 하단의 미리보기를 눌러 보시면 직접 디자인한 버튼이 화면에 나타나는 것을 확인가능하십니다.

댓글 남기기

위로 스크롤