본문 바로가기

전체 글

 (49)
[MBTI테스트(20)] 카카오톡 오른쪽 상단 공유하기버튼으로 공유할 때 이미지 수정 (캐시삭제로 해결 완) 내가 만든 공유하기 버튼으로는 위처럼 잘 뜨는데 카카오자체의 공유하기버튼으로 공유하면 판다코딩 기본이미지로 뜬다. 메타태그를 손봐주면 되는듯해서 수정했는데도 그대로다 ㅡㅡ 혹시나해서 깃허브의 default 브런치를 변경해주었다. 그런데도 안바뀌었다. (당연함) https://dev-jwblog.tistory.com/48 [HTML] 카카오톡 URL 공유시 미리보기 meta 정보 등록하기 카카오톡을 통해서 어떠한 정보를 공유하기 위해서 URL을 공유하는 일이 많이 있다. 카카오톡에 URL을 공유하게 되면 위의 그림과 같이 썸네일 이미지와 제목, 내용 등을 보여주게 되는데, 이는 dev-jwblog.tistory.com 그런데, 서칭하다가 발견한 블로그에서.. 카카오 서버 상 반영되기까지 최대 24시간이 걸..
[MBTI 테스트(19)] 카카오톡 공유이미지가 안바뀐다... (=> 해결 git hub 로 작업 시 상위경로표시를 할 필요가 없다!!) 분명 미리보기 이미지를 삭제하고 새로운 이미지를 등록해줬는데도... 공유하면 계속 이전 이미지가 뜬다. 결국 바꾸기 전으로 돌렸는데 index.html 부분이 겹쳐서 에러가 발생한다.. 결국에는 바꾸기 전 commit부분을 다운받아서 다시 git에 연결해주도록 한다. 별의별 짓을 다 했는데 결론은 상위경로를 표시했기 때문에 ... 이게 무슨말이냐면 나는 그동안 이 파일을 여러번 받으면서 컴퓨터 상에 image-1 부터 11까지 여러개의 파일이 생성된 상태였는데, 판다코딩 유튜브에 나온 대로 그대로 따라하니 img 파일을 변수로 지정해줄 때 ../img/image 이런식으로 표현했었다. 위에서처럼 말이다. 근데 중요한점은, 판다코딩 유튜브에서는 '로컬'에서 작업한 뒤 해당 내용을 netlify에 수정될때마..
[MBTI 테스트(18)] 구글폰트 > 귀여운 도트폰트로 바꿔주기. https://wooncloud.tistory.com/m/53 [폰트] 한글 픽셀폰트, 도트폰트 Neo둥근모 폰트 소개 옛날에 DOS창이나 픽셀 게임을 하다 보면 저화질의 폰트를 가끔 본 적이 있습니다. Neo둥근모 폰트는 이런 레트로 한 느낌을 주는 폰트입니다. 이런 느낌의 폰트입니다. 둥근모 폰트는 레트 wooncloud.com 이 폰트를 돈받고 파는게 아니라면 상업적사용도 상관없다고 한다. 구글폰트도 상업적사용이 가능한 폰트가 대부분이지만 악명높은(?) 디자인회사가 보여서 패스.. html 파일의 head 부분에 위 코드를 복사붙여넣기 해주고.. 아래 코드는 css 파일에 붙여넣어준다. *{ font-family: 'NeoDunggeunmo Pro'; } 최신 업데이트된 버전을 사용하기 위해서는 위..
[MBTI 테스트 (17)] 로컬에서 github 불러온이후 netlify에서 변화가 인식되지 않을때 > unlink 하고 다시 link 해주면 됨 말 그대로... github에 저장했던 내용을 로컬로 불러왔는데, netlify에서 github의 어떤 내용도 적용이 되지 않을 때... 그냥 unlink 해서 링크 끊고 다시 연결해주면 된다 =_=;; 위화면이랑 똑같이 들어가서 가장 아래있는 분홍색 unlink로 링크 끊어주고 다시 연결해주면 된다. 참쉽죠? *(겁나헤매다가 찾은 방법...)
[MBTI 테스트(16)] 페이지에 광고 넣어주기 https://youtu.be/hiflpXzcuEs 위 영상을 보고 따라해본다. 카카오 애드핏에 가입하고 생성하는 단계는 영상을 보고 빠르게 따라해본다. 생성하고 나면 다음과 같은 코드가 뜬다. 나의 index.html 파일에 광고를 넣어줄 위치에 위 코드를 삽입해준다. 잘 출력되는 것을 확인할 수 있다! 근데 위치가 왼쪽에 치우쳐져있어 정렬해줄 필요가 있다. 근데 일단 이게 급한게 아니라.. 나중에 수정하면 추가하겠다 ㅎㅎ
[MBTI 테스트(15)] git hub와 netlify 연동하기 + 수정 후 적용하기 + 새 브랜치 만들어 별도로 저장해보기 git에서 수정하면 netlify에 잘 적용되는지 테스트 우선 git과 netlify를 연동시키고 이게 잘 작동되는지 체크해본다. 위에서보면 시작하기와 나만의 mbti테스트 두 문장을 바꾸고싶다. 위와 같이 입력하고, 터미널에서 저장해준다. 참고로 replit에서는 저장하지 않아도 자동저장이되었지만, 로컬에서 작업 시 (VS Code 사용 중) 항상 저장을 해야 변경사항이 적용된다. (당연함) 그래서 첫 번째 커밋을 저장할 때는 변경사항이 없다고 떴지만 저장 후에 커밋을 저장하니 변화가 있는 내용을 출력해준다. 이후 git push 로 변경사항을 적용해보도록 한다. 약간의 시간(1분 미만)이 지나고나면 변경사항이 잘 적용된 것을 확인할 수 있다. 새로운 브런치를 만들어서 변경사항을 저장해보는 것은 아래 ..
[MBTI 테스트(14)] Kakao is not defined 문제 해결하기 (카카오톡 공유하기 api 어떻게 쓰는건지 참=_=?) 카카오 developers에 있는 질문 게시판에서도 내가 원하는 방법을 못찾다가, https://developers.kakao.com/tool/demo/message/kakaolink?method=send Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다. developers.kakao.com 여기 나온 코드를 따라해보기로 한다. 기능 미리보기 및 테스트에서는 잘 실행된다. 근데 분명 잘 입력했는데 자꾸 에러가뜬다. 도메인도 등록 했는데 =_=... https://www.youtube.com/watch?v=BpAe8d-CXKk 그러다가 발견한 이 영상!!! 따라하니까 진짜 바로뜬다. 내..
[MBTI 테스트(13)] 카카오 API 활용해서 카카오톡으로 공유하기 버튼 만들기 (기록용이며, 이거 따라해도 카카오 공유하기를 하실 수 없습니다) 아마 2년 전 영상이라 바뀐점이 많은 듯 합니다............ https://justforfundoit.tistory.com/61 Kakao is not defined 문제 해결하기 (카카오톡 공유하기 api 어떻게 쓰는건지 참=_=?) 카카오 developers에 있는 질문 게시판에서도 내가 원하는 방법을 못찾다가, https://developers.kakao.com/tool/demo/message/kakaolink?method=send Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해 justforfundoit.tistory.com 여기서 비스무리한 것을 찾았습니다. 차라리 위 포스팅의 첨부영상..

티스토리툴바