티스토리 버튼링크 바로가기 만들기 서식만들기

 

티스토리 버튼링크 바로가기 만들기 서식만들기를 알려드릴까 합니다.

전에는 미리캔버스로 일일이 

이렇게 만들어서 사용했었는데 여간 힘들게 아니더라구요

 

이렇게 티스토리 버튼링크 하나 서식으로 만들어 두면 간단한 것을 모르고 고생을 했습니다.

 

여러분의 고생을 줄여들이고 시간을 아껴드리겠습니다.

천천히 따라만 오세요~~

 

 

티스토리 블로그 HTML 코드를 활용해 버튼 링크 생성하기

 

티스토리 블로그 서식을 만들면

이렇게 최종 화면이 생성됩니다.

 

 

 

글쓰기를 하다가 이렇게 

원하는 곳에 링크 버튼을 만들고 싶으시면

서식에 들어가서 링크 바로가기 서식을 삽입하시면 됩니다.

 

 

 

 

이렇게 간단하게 글도 변경해서 사용이 가능하고

버튼의 길이도 알아서 늘어나고 줄어들어

매우 편리합니다.

 

 

서식 만들기에 삽입해야할 버튼링크 HTML 코드

 

<p style="text-align: center;" data-ke-size="size16"><a class="myButton" href="#"><button style="height: 80px; padding: 0px 20px; background-color: #FFFF00 ; font-size: 23px; font-weight: bold; color: black; border: 0; border-radius: 30px; text-decoration: none; margin: auto;" type="button">코로나 지원금 바로가기 click !!</button></a></p>
<p style="text-align: center;" data-ke-size="size16">&nbsp;</p>

 

이 HTML 코드를 티스토리>관리>서식관리>서식쓰기>HTML에 들어가셔서 붙여넣기 하시면 됩니다.

 

그러면 기본 모드로 돌아오시면

이렇게 버튼 링크가 생성된 모습을 확인하실 수 있습니다.

 

 

 

 

버튼 색상 내맘대로 바꾸는 방법

위의  HTML 코드에서 

 background-color: #FFFF00 이 부분을 변경하시면 됩니다.

 background-color:              우선 이렇게 #이하 색상 코드표를 지웁니다.

 

 

색상	색상코드표
레드	#FF0000
다크레드	#8B0000
엘로우	#FFF00
그린	#008000
라이트스카이블루	#87CEFA
블루	#0000FF
바이올렛	#EE82EE
다크그레이	#A9A9A9
블랙	#000000

 

 background-color: 다음에 원하는 색상코드표를 집어넣으시면  됩니다.

 

 

 좀더 다양한 색상을 원하시면  제 다른 포스팅 바로가기 이용하시면 됩니다.

 

 

 

 

 

 

 

 그러면 이렇게 원하는 색깔의 이쁜  티스토리 버튼 링크를 만드실 수 있습니다.

 

 

티스토리 링크버튼 바로가기 글씨색깔 변경하기

 

엘로우에는 흰색글씨가 안보여서 검은색 글씨로 변경했는데요

 

이때 코드에서 버튼 링크 글씨색을 변경하는 것도 역시 쉽습니다.

이때는 색을 그냥 영어로 입력해 주시면 됩니다.

 

 

<p style="text-align: center;" data-ke-size="size16"><a class="myButton" href="#"><button style="height: 80px; padding: 0px 20px; background-color: #FFFF00 ; font-size: 23px; font-weight: bold; color: black; border: 0; border-radius: 30px; text-decoration: none; margin: auto;" type="button">코로나 지원금 바로가기 click !!</button></a></p>

 </p style="text-align: center;" data-ke-size="size16">

에서

 

font-weight라는 부분을 찾아줍니다.

 

기존 코드에서 폰트색이 white 흰색이라고 되어 있으니 엘로우 버튼에서는 black으로 변경해 주었답니다.

 

 

 

버튼링크 바로가기 글씨색깔 변경하기

 

그래서 기존 HTML코드에서 font-black이라고 변경만 해주시면 글씨색깔 폰트색깔이 변경됩니다.