1. 깃허브 아이콘 다운로드
2. 코드 수정
1. 깃허브 아이콘 다운로드
2. 위치확인
F12 관리자 페이지로 들어가 내가 넣고 싶은 위치를 확인 하고, 해당 위치의 코드에 깃허브 주소를 추가합니다.
3. html 편집
Font Awesome 아이콘 클래스를 사용하여 깃허브 아이콘을 추가합니다.
다른 sns 를 추가하고 싶으면 a태그를 추가하여 사용하면 됩니다.
- Font Awesome 라이브러리가 추가되어 있지 않으면, HTML 상단 header에 아래 코드를 추가하여 이미지를 다운로드하여 해당 펭이지에 업로드하는 과정을 거칠 필요 없이 라이브러리를 사용하여 코드만 추가하여 바로 가져와 사용 합니다.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
- 깃허브 주소를 추가하고, 아이콘를 추가합니다.
<div class="sns-links">
<a href="https://github.com/ppoosumi" target="_blank">
<i class="fab fa-github"></i>
<span>Github</span>
</a>
</div>
