본문 바로가기

Window

티스토리 링크 버튼 만들어 적용하기 1편

티스토리 블로그 또는 워프레스 블로그를 이용할 때 본문에 옵션으로 만들어야 하는 기능이 있습니다. 아마 동감하실 거라 생각합니다. 바로 티스토리 또는 워프레스 본문에 눈에 확 보이는 링크 버튼을 만드는 것입니다. 오늘은 링크 버튼 디자인하는 방법을 알려드릴까 합니다. 게임에서 캐릭터를 선택한 다음 머리 모양과 피부색과 같은 것을 정하는 것처럼 링크 버튼도 아주 쉽게 정하고, 만들고, 블로그에 적용할 수 있습니다.

 

1. 버튼을 만들어 주는 버튼 제네레이터 이용하기

  • 본 사이트를 이용하면 정말 간단하게 기본 양식이 본인이 원하는 옵션을 변경하며 이쁜 링크 버튼을 만들 수 있습니다.
  • 버튼 제네레이터를 이용하시려면 아래 버튼을 클릭하세요.

 

링크 버튼 만들기

 

 

2. 버튼 제네레이터에서 버튼 선택하기

  • 접속하면 다양한 버튼이 보입니다. 
  • 마음에 드는 버튼 선택하기.
  • 그리고 세부 설정하기.
  • 모든 항목을 완료 했으면 "Get Code"를 클릭하세요.
  • 작성된 코드를 블로그에 적용하세요.
  • 끝.

 

위 사항을 따라서 순서대로 항목을 완료하세요.

아주 쉽습니다.

 

 

모든 사항을 완료했다면 위 사진과 같이 "Get Code"를 클릭하세요.

그러면 버튼 만들기는 끝입니다.

이제 "Get Code"클릭한 후 만들어진 코드를 블로그에 적용하면 됩니다.

 

 

Get Code를 클릭하면 위와 같은 코드가 생성됩니다.

티스토리에서는 위 항목을 각각 "html"과 "CSS"에 복사한 후 적용하시면 링크 버튼을 쉽게 사용할 수 있습니다.

 

위 설명이 어렵게 느껴지신다면 제가 작성한 코드를 공유해 드리도록 하겠습니다.

아래에서 다운로드하시길 바랍니다.

 

버튼 만들기.txt
0.00MB

 

 

티스토리 블로그 관리 항목에서 "스킨편집"으로 들어가면 "html""css"를 수정할 수 있습니다. 참고하세요. 더 자세한 내용은 다음 편에서 계속됩니다.


/* 링크버튼a */ 대체 텍스트 /* 링크버튼a 끝 */ /* 링크버튼b */ 대체 텍스트 /* 링크버튼b 끝 */