전체 글96 [오픈그래프] 티스토리 공유할 때 표시되는 이미지와 텍스트 변경하기 오픈그래프를 것을 추가해서 블로그의 기본 설정을 바꾸지 않고 티스토리 블로그를 공유할 때 표시되는 대표 이미지와 제목, 설명을 변경하는 방법입니다. html편집이 익숙하지 않으신 분들도 어렵지 않게 하실 수 있습니다. 아래는 제 티스토리 블로그를 페이스북에 공유했을 때의 모습입니다. 티스토리의 블로그 설정 메뉴에서 입력한 대표 이미지, 블로그 이름, 블로그 설명이 표시됩니다. 블로그 설정은 그대로 유지하면서, 공유할 때 표시되는 내용을 변경해 보도록 하겠습니다. 1. 이미지 등록하기 대표이미지로 사용할 이미지를 티스토리에 업로드합니다. 티스토리에서 설정 > 꾸미기 > 스킨편집 으로 이동합니다. 원하는 이미지를 업로드하고, 업로드된 이미지를 우클릭 해서 새 탭에서 열기를 선택합니다. 저는 셔터스톡에서 구입.. 2019. 8. 1. 티스토리 검색엔진 최적화하기 - 구글 서치콘솔에 사이트맵 등록하기 이 글에서는 구글에서의 블로그 검색 인지도를 개선시키기 위해서 (구글에서 블로그가 잘 검색되도록) 1. 사이트맵을 생성하고 2. 블로그에 사이트맵을 업로드한 후에 3. 업로드된 사이트맵을 구글 서치콘솔에 제출합니다. 1. 사이트맵 생성하기 무료로 사이트맵을 생성할 수 있는 사이트는 여러 곳이 있습니다. https://www.xml-sitemaps.com 을 이용해 보도록 하겠습니다. 사이트에 접속에서 블로그 주소를 https:// 부터 적고 START를 클릭합니다. 사이트맵이 곧 생성되면, DOWNLOAD YOUR XML SITEMAP FILE 버튼을 클릭해서 사이트맵 파일을 다운로드 받습니다. 파일명은 sitemap.xml 입니다. 2. 블로그에 사이트맵 업로드 하기 사이트맵 제출은 다운받은 파일을 블.. 2019. 7. 31. 티스토리 검색엔진 최적화하기 - 구글 서치콘솔 등록하기 홈페이지나 블로그 그리고 그 안에서 작성한 글이 검색 결과의 상단에 노출되기 위해서는 다양한 요인이 필요하지만, 검색엔진최적화(Search Engine Optimization, SEO)는 그 중에서도 가장 기본적이고 필수적이라고 생각합니다. 이 글부터는 티스토리 블로그에서 작성한 글이 구글에서 더 잘 검색되기 위해 (구글에서의 검색 인지도를 향상시키기 위해) 할 수 있는 간단한 작업들을 공유합니다. 이 글에서는 우선 구글 서치콘솔 속성을 만들고 블로그의 소유권을 인증하는 절차까지 진행합니다. 1. 구글 서치콘솔에 속성 만들기 가장 먼저 구글 서치콘솔(구 웹마스터)에서 블로그에 대한 정보를 관리할 속성을 만듭니다. https://search.google.com/search-console/ 시작하기를 클릭하.. 2019. 7. 31. CSS)모든 브라우저에 적용되는 Full-size Video 만들기 * * 동영상을 배경으로 사용하고자 할 때 가장 편한 방법은 object-fit 속성을 사용하는 것이지만, IE와 몇몇 브라우저에서는 해당 속성을 인식하지 못합니다. 이 글은 object-fit 속성 없이 css에서 object-fit: cover를 적용한 것과 같은 결과물을 만드는 방법입니다. 동영상을 화면에 가득 차는 배경으로 사용하고 앞에 다른 요소를 배치할 수 있습니다. 크롬, IE, Edge, 파폭, UC브라우저에서 확인해 보았습니다. 우선 JSFiddle에서 작성한 예시입니다. Edit fiddle - JSFiddle jsfiddle.net 아래는 작성한 예시 중 관련된 내용입니다. html 1 2 3 4 5 6 7 8 9 10 11 Big Buck Bunny a full-size backgr.. 2019. 7. 29. 'Google 지도를 제대로 로드할 수 없습니다.' 구글 맵 API 문제 해결 구글 지도 API를 웹사이트에 사용하려고 할 때, API키를 맞게 입력해도 지도가 표시되지 않을 때가 있습니다. 화면에 아무것도 표시되지 않는다면 API 키 설정에서 도메인 연결이 제대로 되지 않았거나 스크립트 내에 SSL 인증이 안 된 http 링크가 있는 것이 이유일 수 있습니다. 이 글은 아래처럼, Google 지도를 제대로 로드할 수 없습니다. 메시지가 나오고, 지도에 For development purpose only 글자가 표시될 때의 해결 방법입니다. 구글 클라우드 플랫폼에서 화면 중앙의 콘솔로 이동 클릭 구글 지도 API는 구글 클라우드 플랫폼의 일부로 제공되고 있습니다. 왼쪽 상단의 메뉴 > 결제 > 결제수단 으로 이동합니다. 위 페이지에서는 국민 7807이라는 결제수단이 등록되어 있지만.. 2019. 7. 29. 구글 맵 API 키 확인하기/ API를 사용할 도메인 연결하기 구글 지도는 GCP(구글 클라우드 플랫폼) 내에서 API로 제공되며, 사용자는 지도, 길찾기, 장소 정보를 홈페이지에 사용할 수 있습니다. 이 글의 내용은 이미 발급된 API 키 정보를 확인하고, 해당 키를 사용할 도메인을 연결하는 방법입니다. '구글 맵 API'를 검색해서 나오는 링크를 타고 들어왔습니다. API 키의 위치를 찾기가 쉽진 않아 보입니다. 화면 왼쪽 상단의 Google Cloud 클릭 이미 발급받은 API 키를 찾으러 가는 것이므로 콘솔로 이동 버튼 클릭. 만약 발급 받은 키와 생성한 프로젝트가 없다면, 콘솔로 이동 대신 무료로 GCP 사용해 보기 버튼이 표시됩니다. 생성된 프로젝트에 대한 API 키의 위치는 왼쪽 상단의 메뉴 > API 및 서비스 > 사용자 인증 정보 에서 확인할 수 있.. 2019. 7. 28. 이전 1 ··· 4 5 6 7 다음 728x90
