티스토리 스킨 편집해서 프로필에 github 아이콘 추가하기

먼저 svg 파일을 다운받아 파일 업로드 탭에 업로드한다.

나는 귀찮아서 그냥 png

출처표기: <a href="https://www.flaticon.com/kr/free-icons/github" title="github 아이콘">Github 아이콘  제작자: Dave Gandy - Flaticon</a>

 

HTML 탭

 

box-sns 클래스에 아래 코드를 추가하엿음

<a href="https://github.com/nrkcode" class="link-sns link-github">
	<img src="./images/githubicon.png" width="60%" height="60%"/>
</a>

 

CSS 탭

 

.area-aside .box-profile .link-github {
  line-height: 46px;
  align-items: center;
  padding: 2px;
}

 

 

적용되었다.

 

참고한 블로그

https://0828lucy.tistory.com/6

티스토리 프로필에 SNS 아이콘 삽입하기

 

 

사담

html 적용이 안돼서 보니 와이파이가 끊겨있었음

아오~~

 

+)

.area-aside .box-profile .img-profile {
  width: 140px;
  height: 140px;
  margin: 49px 0 14px 0;
  border-radius: 140px;
}

 

border-radius는 네모 모서리를 둥글게 깎는 코드이다.

css탭에서 .area-aside .box-profile .img-profile 를 검색해서 조절하면 프로필 사진 모양을 바꿀 수 있다.

프로필 이미지 배경이 없어서 모서리 둥글기를 조금 조절했다.