본문 바로가기

티스토리15

티스토리 블로그 북클럽 스킨, 유튜브 영상을 반응형으로 만드는 법 오늘은 블로그에 유튜브 영상을 반응형으로 올릴 수 있는 방법을 소개하겠습니다. 반응형이란? '반응형'이라는 단어의 사전적 의미는 '유전자와 환경의 상호 작용에 따라 동일한 표현형을 나타내는 개체의 무리'입니다. 블로그의 스킨들 중에서 유튜브의 영상을 올렸을 때 영상이 작게 올라가는 스킨들이 있습니다. 위의 이미지와 같이 지금 이 블로그의 스킨인 북클럽 스킨도 그렇습니다. 딱 봐도 뭔가 답답해 보이죠. 스킨은 반응형 스킨인데, 왜 유튜브는 반응형으로 나오지 않는지 모르겠습니다. 티스토리의 또 다른 반응형 스킨인 #2 스킨입니다. 이 스킨 같은 경우에는 별도로 수정을 하지 않아도 처음부터 이렇게 유튜브의 영상이 반응형으로 올라갑니다. 딱 봐도 #2 스킨이 훨씬 보기에 좋습니다. 지금부터 북클럽 스킨의 이러한.. 2021. 10. 1. 14:39
블로그에 CSShake 효과 주기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 드리머 미스티 음악・악기・독서・여러가지 생활 정보 등을 제공합니다 mystee.tistory.com 저의 메인 블로그에 가보셔서 블로그의 이름인 "드리머 미스티"라고 쓰여있는 곳에 마우스 커서를 올려주면 블로그의 이름이 춤을 추는 듯이 움직이는 것을 보실 수가 있습니다. 그 효과를 주는 방법을 알려드겠습니다. HTML과 CSS를 전혀 모르시는 분들은 무슨 내용인지 이해를 할 수 없는 글이 될 수도 있습니다. 무슨 말인지 전혀 모르겠지만 이 효과를 꼭 주고 싶은 분들은 이 블로그의 카테고리 html과 css를 통해서 공부를 해보시기를 권해드립니다. 참고 포스트 CSS 트랜스폼 중심축 바꾸기 이 포스팅.. 2021. 1. 16. 14:26
블로그 로딩 속도를 줄이기 위한 팁 (feat. 이미지 사이즈) 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 블로그나 웹사이트에 올린 사진의 용량이 크면 클수록 페이지를 로딩하는 시간이 길어진다는 것은 상식입니다. 하지만 블로그 초보자들은 이 상식을 대충 알고는 있지만 간과하기 쉽죠. 이번에는 포토샵을 이용해서 사진의 용량을 줄이는 방법을 공부해보겠습니다. 포토샵으로 이미지 파일의 크기와 용량 줄이기 포토샵, 사진 크기 변경하기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 줄 바꿈이나 문단의 나눔 등이 어색하게 보일 수 있습니다. 포토샵을 실행시킨 후, 상단 메뉴의 File > Open... 을 클릭하거나 단축키 mystee.tistory.com mystee.tistory.com/576 .. 2021. 1. 15. 17:08
구글 애드센스 일치하는 콘텐츠 광고 다는 방법 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 일치하는 콘텐츠 광고를 달 수 있는 조건이 성립되다 구글 애드센스에 로그인을 해서 좌측 메뉴를 보면 사이트 > 일치하는 콘텐츠 가 있습니다. 제가 전부터 관리하던 메인 블로그에는 예전부터 일치하는 콘텐츠 광고를 달아뒀지만, 이 블로그는 아직 일치하는 콘텐츠 광고를 달 수 있는 조건이 성립이 되지 않았었죠. 그런데, 오늘 구글 애드센스에서 '일치하는 콘텐츠'를 확인하니.. 이 블로그에도 이제는 일치하는 콘텐츠 광고를 달 수 있다고 이렇게 나와있었습니다. 일치하는 콘텐츠 광고를 달 수 있는 조건이 정확이 뭔지는 모르겠으나, 저의 이 블로그 같은 경우에는 방문자 수도 많지 않음에도 불구하고 총 게시글이 .. 2021. 1. 9. 11:29
티스토리 블로그 CSS로 폰트 변경하는 방법 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 오늘은 티스토리 블로그의 폰트 글꼴과 사이즈를 변경하는 방법을 알아보겠습니다. CSS 폰트 사이즈는 rem 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 지난 포스트 CSS 선택자 공부 사이트, 같이 풀어봅시다. (feat. flukeout.github.io) 이 포스 gogogameboy.tistory.com 제 블로그의 CSS 카테고리에 위와 같은 글이 있습니다. 대충 요약하자면 '웹페이지 사용자의 편의를 위해 폰트의 단위는 픽셀(px)을 쓰는 것보다 rem을 쓰는 것이 좋다'라는 것인데, 이 블로그 말고 저의 메인 블로그가 스킨 편집.. 2021. 1. 6. 12:30
구글 애드센스 검색엔진 광고 달기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 생긴지 시간이 좀 흐른 광고 단위지만 뒤늦게 한번 달아보았습니다. 구글 애드센스에서 광고 > 광고 단위 기준 > 검색엔진을 클릭합니다. 검색 범위를 설정할 수 있습니다. '선택한 사이트만'을 택하고 검색사이트의 주소를 입력하면 다른 검색사이트를 사용할 수도 있나 봅니다. 하지만 저는 처음 선택되어있던 전체 웹을 선택했습니다. 만들기를 클릭합니다. 소스 코드를 복사하고 완료를 클릭합니다. 광고 단위가 성공적으로 생성되었습니다. 블로그 관리에서 사이드바로 들어갑니다. (플러그인에서 태그 입력기를 사용하고 있지 않으신 분은 먼저 태그 입력기를 사용 중 상태로 만들어주세요.) 태그 입력기를 클릭해서 사이드.. 2020. 12. 22. 16:40
티스토리 북클럽 스킨에서 인스타그램 새 창으로 뜨게 하기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 티스토리 북클럽 스킨의 홈 프로모션, 새 창으로 뜨게 하기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 티스토리 스킨 편집으로 글 작성 시간 숨기거나 나타내기 이 포스팅은 PC로 작성되 gogogameboy.tistory.com 지난번의 스킨 편집은 북클럽 스킨에서 홈 프로모션 링크를 새 창으로 뜨게 하는 법을 배웠습니다. 오늘도 비슷한 내용입니다. 북클럽 Book Club 스킨에서 인스타그램을 새 창으로 뜨게 하는 법을 알아보겠습니다. 다른 스킨에서도 인스타그램이 새 창으로 뜨지 않는다면 이 글을 참고해주세요. 인스타그램이 새 창으로 .. 2020. 12. 17. 06:33
티스토리 북클럽 스킨의 홈 프로모션, 새 창으로 뜨게 하기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 티스토리 스킨 편집으로 글 작성 시간 숨기거나 나타내기 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 티스토리 스킨 편집으로 썸네일 크기 정사각형으로 조절 이 포스팅은 PC로 작성되 gogogameboy.tistory.com 저번의 스킨 편집은 글 작성 시간을 숨기거나 나타나게 하는 법을 배웠습니다. 이번에는 저의 블로그 스킨인 북클럽 Book Club 스킨에서 홈 프로모션을 새 창으로 뜨게 하는 법을 알아보겠습니다. 다른 스킨에도 홈 프로모션이라는 것이 있는지 모르겠지만, 있다면 이 글을 참고해주세요. 홈 프로모션이 새 창으로 뜨지 않는.. 2020. 12. 16. 21:05
티스토리 블로그 html 편집 들어가는 법 이 포스팅은 PC로 작성되었습니다. 모바일로 보시는 분들에게는 가끔 줄 바꿈이 어색하게 보일 수 있습니다. 이번 포스팅은 포스팅 거리도 못 되는 정말 민망할 정도로 쉬운 내용입니다. 하지만 누군가에게는 당연한 상식인 것이 누군가에게는 그렇지 않을 수도 있습니다. html, 태그, 코딩 등등.. 단어도 생소한 처음 접하시는 분들에게는 하나하나 다 자세하게 알려주지 않으면 이해를 못할 수도 있지 않을까 하는 마음에서 오늘의 포스팅을 합니다. 티스토리 html 편집을 하려면 어디로 들어가야 하는지 알려드리겠습니다. 티스토리 블로그 html 편집하기 티스토리 블로그 관리로 가셔서 좌측에 스킨 편집 메뉴로 들어갑니다. 그러면 위와같은 새창이 뜹니다. 화살표가 가리키는 html 편집을 클릭하시면 스킨의 소스 코드를.. 2020. 12. 16. 18:03