티스토리 블로그 링크 버튼 움직이게 만들기

 

 

 

초보일 때 링크 버튼을 만드는 건 생소하기 때문에 적용의 미숙함과 시간이 많이 드는 단점이 있어요. 하지만 반복하다 보면 익숙해지고 다음번은 매번 쉬워지더라구요. 블로그를 계속 만들 거라면 거쳐야 하는 과정 같아요. 천천히 따라서 적용해보세요.

 

 

 

 

 

 

 

 

 

자세히 알아보기👆

 

위 네모칸에 마우스를 가져가보세요.  링크버튼인데 약간 움직이고 색깔이 바껴요 ^^

 

 

 

만든 링크 버튼 

 

 

만드는 데 하루 종일 걸렸습니다

초보자라 물어볼 곳 없고, 책도 이해가 어려워서 

검색해서 css code 찾느라 오래 걸리고,

 

어떤 블로거가 알려주는 내용은 적용하다가 실패하고 

원하는 조건으로 겨우 찾아서 이것저것 만들어보다 겨우 완성했어요

 

그 과정을 알려드릴게요.

근데,,, 저는 초보자라서 댓글로 물어보시면 답변 못해드릴 확률이 90% 이상이니까 

따라할 수 있는 만큼만 해보세요

 

초보가 아니시라면 고급자 분들은 패스하세요~

미리 공지하는 다음번 포스팅은 목차만들기 할 거에요.

 

 

 

 

링크버튼 code적용

 

티스토리 메뉴 html블럭을 이용해서 넣었는데요. 

서식에 적용해서 반복해서 쓰면 되니까 1번만 만들면 되요

html블럭에 넣을 내용을 bestcssbuttongenerator.com 사이트에서 코드를 무료로 제공해줘요.

찾는 게 있다면 그대로 쓰셔도 되요. 

 

 

 

 

hover 적용

 

움직이는 걸 원하면 기초 코드에 hover를 넣어줘야 해요

효과를 주는 건데 할 수 있는 종류가 많아요

구글에서 button css code hover를 누르면 많은 무료 사이트가 나와요

 

하지만 저는 html/css를 잘 몰라서 알려줘도 100% 모르니까 떠먹여줘야 해요

그래서 전문 블로거들이 써놓은 포스팅을 참고했어요

 

 

 

 

서식에 입력하고 반복사용

 

서식에 있는 걸 적용하면서 색깔이나 크기를 조금 더 수정하기도 해요 

버튼에 화살표 이모티콘도 넣고 싶은데 찾아보다 더 못 찾았어요. 

계속 해야 하는데 하루종일 너무 매달려 있었더니 힘들어서 다음번에 하려구요.

 

 

책보면서 배우고 적용해도 되겠지만 홈페이지 만드는 게 아니라서

필요한 걸 그때그때 조금씩 배워나가는 게 더 좋고 편해요

오래 공부할 수 있는 방법은 꾸준히 하는 게 답이잖아요

초보자 여러분 스트레스 받으면 하기 어려우니까 스트레스 조절하면서 하세요 ^^

 

 

 

 

함께 읽으면 좋은 글

티스토리 블로그 스킨 북클럽 소제목 꾸미기 h2 h3

티스토리 블로그 글 제목 위 메뉴 아래 광고 넣기

블로그 제목 배경 사진 1가지로 고정하기