라벨이 블로그인 게시물 표시

[JavaScript] 모바일 여부 체크하기

이미지
자바스크립트에서 모바일 여부를 체크하는 간단한 함수를 안내해 드리겠습니다. 함수를 호출하여 true인 경우, 모바일 환경으로 간주하여 설정하시면 된답니다. 사이드, 내비게이션 등 모바일과 데스크탑 환경에서 별도로 설정이 필요한 경우에 유용하게 활용할 수 있을 것입니다. <script> function isMobile() { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); } </script> 모바일 여부 체크 함수 호출하기를 다음과 같은 예제를 참고하여 실행해 보세요. if (isMobile()) { <!--모바일--> } else { <!--데스크탑--> }

블로그 섬네일 만드는 방법, 미리캔버스 소개~

이미지
블로그 섬네일을 만드는 방법에 대해 고민 중이신가요? 그림판을 다룰 수 있는 정도의 실력만 있다면 누구든지 할 수 있답니다! 오늘 소개해드릴 것은 바로, '미리캔버스'라고 하는 섬네일을 간단히 만들 수 있도록 해주는 서비스 사이트입니다. 참고로, 섬네일은 엄지손톱을 뜻하는 단어인데요, 게시물을 대표하는 이미지라는 뜻으로도 사용한답니다. 미리캔버스 소개 블로그를 운영할 때, 게시하는 글만큼 중요한 게 무엇일까요? 바로 섬네일과 같은 이미지가 아닐까요? 그 중에서도 디자인이 잘 된 섬네일은 방문자를 끌어들이고, 더 많은 관심을 가져오는 데 도움이 될 것입니다. 그러나 디자인 소프트웨어를 다루는 데 익숙하지 않은 사람은 섬네일을 만드는 것이 어려울 수 있습니다. 저 또한 그림판이나 파워포인트를 사용하여 시도해 보았으나, 예쁜 그림이 나오지 않아서 포기한 적이 많습니다. 😭 이런 상황에서 미리캔버스는 초보자도 손쉽게 섬네일을 만들 수 있도록 해주는 훌륭한 온라인 서비스 중 하나랍니다. 저는 미리캔버스를 알고 섬네일을 만드는 방법에 대해 많이 배웠습니다. 지금도 자주 이용하는 편이며, 이렇게 여러분께 소개도 하고 있는 것이지요. 😊 한 번 써보세요~ 다만, 미리캔버스를 사용하기 위해서는 회원가입 절차가 필요하답니다. 그리고 유료 서비스가 별도로 있기에 무료 버전에는 한계가 있다는 점을 참고해 주세요. 저작권 걱정 없이 사용하라는 표어를 내세우고 있다는 것이 장점 중 하나입니다. 미리캔버스는 앞에서 말씀드렸던 것처럼, 컴퓨터를 다루는 기초적인 실력만 있다면 누구나 이용할 수 있습니다. 사용자 친화적인 인터페이스와 다양한 템플릿, 그리고 계속 업데이트 되는 여러가지 재밌는 기능을 활용하여 섬네일 제작을 효율적으로 부담 없게 해드릴 것입니다. 미리캔버스의 주요 기능 주요 기능에 대해 간단히 알아보도록 합시다. 다양한 템플릿 미리캔버스는 다양한 템플릿을 제공하여 사용자가 원하는 스타일에 맞게 선택할 수 있습니다. 다양한 카테고리의 템플릿이 있기 때문에 어

티스토리 vs 구글 블로그 (블로거, 블로그스팟) 비교하기, 블로그 추천

이미지
데이터센터 화재사고 및 점점 노출도가 하락하는 애드센스 때문에 티스토리를 떠나 다른 플랫폼을 고려하는 분들이 많이 보입니다. 그 중 대안으로 하나가 구글 블로그입니다. 구글 블로그 플랫폼의 정식 명칭은 블로거(blogger)인데 블로거는 블로그를 하는 사람(blog + er) 정도로 해석할 수 있기에 블로그스팟이라고 지칭하는 분도 있습니다. 블로그스팟은 구글 블로그의 도메인 프로바이더이긴 하나, 보통 블로거를 대용해서 자주 쓰이곤 합니다. 이하 본문에서는 구글 블로그를 블로거라 하겠습니다. 이번 주제는 구글 블로거 를 생각하시는 분께 티스토리와 비교 하여 어떠한 점에서 차이가 있는지 안내해드리는 시간 을 가져보도록 하겠습니다. 모든 것을 비교할 수는 없겠으나 당장 눈에 띄는 부분을 다음과 같이 비교해보겠습니다. 제가 블로그를 하면서 겪을 점을 토대로 작성하였기에 틀린 부분도 있을 수 있는 점을 양해해 주세요. 참고로 저는 티스토리보다 블로거로 먼저 시작했습니다. 상단에 보이는 화면 자료는 블로거의 통계 화면입니다.  에디터 업데이트 여부 티스토리 카테고리 vs 블로거 라벨 게시일자 퍼머링크 위치 검색 설명 맞춤 로봇 태그 페이징 통계 스킨 vs 테마 서치 엔진 등록 블로그 정보 얻기, 티스토리 vs 구글 블로거 맞춤 robots.txt (크롤러 및 색인 생성) 에디터 에디터 티스토리 장점 티스토리 에디터가 훨씬 한국인에 입맛에 맞게 잘 되어 있습니다. 블로거를 먼저 시작했을 때는 비교대상이 없어서 몰랐는데 티스토리와 병행하니, 편집을 하거나 게시물을 작성할 때 너무도 비교가 됩니다. 심지어 사진 하나를 올려도 원본크기로 설정하면 블로거는 전체 사진을 확인하기도 힘듭니다. 티스토리측에 편의성 측면에서 한 표를 드리겠습니다. 제목 태그 설정에도 차이가 있습니다. SEO(검색엔진최적화)에서는 h1 헤더 태그는 핵심 문장에 1번 정도 쓸 것을 권장합니다. 그래서 h1태그를 여러번 쓰면 최적화에 좋지 못한 결과를 가져옵니다. 티스

H1 요소가 2개 이상 발견 해결 방법

이미지
<H1> 요소가 2개 이상 발견이 SEO에서 문제가 발생하였을 때, 해결 방법을 안내해드리려고 합니다. 주 제목 사용하지 않기 제목 등 특정 태그에 H1 태그를 보이도록 설정하였다면, 본문에서는 [주 제목]을 사용하시면 안 됩니다. 구글 블로그에서 [주 제목]이 H1 태그이기에 제목에 H1을 이미 사용하였다면 중복이 된답니다. 이 경우에는 [주 제목] 대신 [제목] 태그부터 시작해 주세요. 아티클 태그 등 반복문에서 H1 태그 사용 확인 블로그 포스트를 반복하여 보여주는 구간이 있을 것입니다. 이때, H1태그를 설정하는 경우, 모든 아티클이 H1태그로 이루어 지기 때문에 H1 태그를 한 페이지에 여러번 사용한 것처럼 인식이 됩니다. 아래는 구글 블로그 '컨템포' 테마를 기준으로 하여 수정한 것입니다.

워드프레스 블로그 시작할까? 말까? 시작 전 확인사항 알아보기

이미지
네이버 블로그, 티스토리 블로그 등의 대안으로 고려해 볼만한 것이 '워드프레스 블로그'입니다. 이번 시간에는 워드프레스를 블로그로 시작할 때 어떤 점을 고려해야 하는지 생각해 보도록 합시다. 워드프레스 블로그란? 워드프레스 블로그로 갈까? 워드프레스 시작 시 확인사항 워드프레스 블로그란? 여러분의 블로그에 있는 게시물을 흔히 디지털 저작물이라고 합니다. 그리고 해당 저작물을 관리하는 시스템을 CMS(Content Management System: 콘텐츠 관리 시스템)라고 합니다. 워드프레스는 전 세계 40% 이상의 웹사이트를 점유하고 있는 가장 인기 있는 CMS입니다. 블로그를 한다면 대중적인 것으로 보통 네이버, 다음 티스토리, 구글 블로거, 워드프레스를 생각해 볼 수 있는데, 구글 블로거나 워드프레스가 생소한 분도 계실 겁니다. 이번 주제는 블로그 플랫폼으로 워드프레스를 선택할 시 확인사항에 대해 알아보는 시간입니다~ 워드프레스 블로그로 갈까? 워드프레스 블로그를 시작하고자 한다면 다음의 것을 생각해 볼 수 있습니다. 게시물이 완전히 나의 것이었으면 좋겠다. 구글 검색 엔진에 더 많이 노출되고 싶다. 저품질에 대한 불안 해소 내 블로그 '완전한 내 것'이 갖고 싶으신가요? 티스토리는 회사의 판단에 의한 사용자의 제재(이용 정지 포함), 그리고 이용약관의 변경과 같은 위험요소가 많습니다. 티스토리 약관의 거부는 다음에서 명시하는 바와 같이 탈퇴밖에 없기에 티스토리를 계속 이용하고자 한다면 결국 약관을 따르는 수밖에 없기도 합니다. 블로그의 모든 게시물에 대한 완전한 소유를 원하신다면 워드프레스를 고려해 보세요. 저 또한 이번 2023년 2월 약관 변경 이후 고민을 많이 해보았답니다. 제2조 (약관의 명시, 효력 및 개정) 회사는 본 약관의 내용을 회원이 알 수 있도록 서비스 화면(www.tistory.com)에 게시함으로써 이를 공지합니다. 회사는 콘텐츠산업 진흥법, 전자상거래 등에서의 소비자보호에

구글 블로그 페이지, 페이징, 페이지네이션 소스 (json-in-script)

이미지
구글 블로그에서 페이지 기능을 구현하는 소스 예제에 대한 안내입니다. 페이지는 페이징, 페이지네이션이라고도 하는데, 해당 예제에서는 페이징이라고 하겠습니다. 소스 구현 중 특이사항은 다음과 같습니다. 1차적으로 구글 블로그 테마 사이트를 사용하다가 보완하는 것이라, 블로거들이 기본적으로 공유한 소스를 토대로 합니다. json-in-script와 콜백을 사용하며, 해당 부분은 구글에서 사용하지 않을 것을 권장하는 편입니다. 그렇다고 한글로 된 문서가 많이 공유되는 편이 아니라, API를 사용하려고 해도 뭘 어떻게 해야 할지 짐작이 가지 않아서, 그냥 예전 자료를 보완하여 사용하려고 합니다. 구글 블로그 페이지 (페이징, 페이지네이션) json-in-script를 조회하면 최대 150개의 결과 배열을 가져옵니다. 그리하여 9999와 같이 max-results를 늘리더라도 소용이 없답니다. 기존의 소스는 최대 150개 자료만 가져오기 때문에 해당 부분을 보완했습니다. 다만, 다큐먼트 라이트를 모두 진행한 다음에 콜백이 진행하며, 현재 블로거의 게시물 개수를 확인하는 부분을 따로 넣지는 않고 하드코딩 해놓았습니다. 보완할 수 있다면 공유 좀 해주세요~ 페이징 때문에 시간을 많이 허비하고 싶지 않아서 임시로 처리하였답니다. 특히, 페이징 시 점프브레이크의 사용이 중요합니다.

HTML 요소에 LANG 속성이 없음 해결하기

이미지
HTML 요소에 LANG 속성이 없음은 말 그대로 HTML 태그에 LANG 속성이 누락되어 발생하는 문제입니다. HTML 요소에 LANG 속성이 없음 [테마] 탭으로 이동하여 [HTML 편집]으로 이동해 주세요. 그리고 최상단에 있는 HTML 요소에 lang="ko"와 같이 lang 속성을 추가하여 해결할 수 있습니다. 해당 사이트에서 사용하는 기본 언어를 설정하는 부분이니, 속성의 철자를 정확하게 지정해야 합니다. <html lang='ko'> HTML태그에서 LANG 속성은 해당 사이트의 웹 접근성을 위해 필요합니다. 어떠한 값을 넣더라도, 심지어 명시적으로 입력하지 않더라도 사이트가 구동하는 데에는 문제가 없으나, 스크린리더와 같은 최적화를 위해 필요한 값입니다.

네이버 서치어드바이저 meta name description 설명 누락 해결하는 방법

이미지
블로그를 운영하시는 분들 중에 네이버 서치어드바이저에서 'meta name description' 오류가 나온다고 고민하시는 분들을 위한 게시물이랍니다. 저도 그런 적이 있었는데요, 해결 방법을 알려드릴게요. 방법은 의외로 간단하답니다. meta name description이란 무엇인가요? <meta name='description'> 태그에 설명을 작성해주세요. 라는 문제점에 대하여 하나하나 살펴보도록 합시다. 태그는 여러분이 현재 보고 있는 웹 페이지를 구성하는 요소(엘리먼트)라고 할 수 있습니다. 태그는 '<' 문자로 시작하여 '>' 문자로 종료합니다. 메타 태그는 <meta> 라고 할 수 있습니다. 메타의 뜻은 '데이터에 대한 데이터'를 의미하며, 메타 태그는 특별한 태그 중 하나입니다. 디스크립션은 문자 그대로 설명을 뜻합니다. name은 메타 태그에 관한 이름 속성입니다. 요약하면, 메타 태그 중 이름이 description에 설명을 작성해 달라는 것입니다. 간단히 말하면, 메타 태그(이름: 설명)는 블로그 포스트에 대한 간단한 설명을 담은 태그라고 할 수 있습니다. 이 태그는 검색엔진이 해당 게시물에서 어떠한 내용을 담고 있는지 알 수 있도록 합니다. 방문자에게 블로그의 내용을 직접 보여주지는 않지만 보이지 않는 곳에서 여러분이 작성한 게시물의 존재를 열심히 알리고 있는 존재라고 할 수 있습니다.

Can't find substitution for tag [post.lastUpdated.iso8601] 해결하기

이미지
{ "@context": "http://schema.org", "@type": "BlogPosting", "mainEntityOfPage": { "@type": "WebPage", "@id": "https://www.beomsang.com/2023/08/buy-save-google-blog-custom-domain-unable-to-verify-permissions-for-this-domain-to-solve.html" }, "headline": "구글 블로그 맞춤 도메인 구입, 저장하기, 이 도메인에 대한 권한을 확인할 수 없습니다. 해결하기.","description": "","datePublished": "2023-08-02T00:30:00+09:00", "dateModified": "<!--Can't find substitution for tag [post.lastUpdated.iso8601]-->","image": { "@type": "ImageObject","url": "", "height": 300, "width": 300},"publisher": { "@type": "Organization", "name": "Blogger", "logo": {

구글 블로그 One of the sections is missing the required id attribute. Every section should have a unique id. 해결하기

이미지
구글 블로그에서 섹션을 추가할 때 오류가 발생하는 문제에 대해 도움을 드리고자 기록을 남깁니다.😊 One of the sections is missing the required id attribute. Every section should have a unique id. 구글 블로그에서 섹션을 추가할 때, 각 섹션은 고유한 id 속성을 반드시 가지고 있어야 합니다. id 속성이 없으면, 해당의 오류가 발생할 수 있답니다. 예를 들어, 다음과 같이 섹션을 추가할 수 있습니다. 잘못된 섹션 추가 <b:section></b:section> --> 실패 One of the sections is missing the required id attribute. Every section should have a unique id. 올바른 섹션 추가 <b:section id='beomBot'></b:section> 여기서 'beomBot'은 섹션의 id로, 다른 섹션과 구분되는 고유값입니다. 이렇게 하면 오류를 해결할 수 있으며, 필요시 하단에 위젯을 추가하시면 됩니다. 또한, 가젯 추가 버튼을 없애고 싶다면, `showaddelement='false'` 속성을 섹션에 추가하면 됩니다. 예를 들어, 다음과 같이 섹션을 수정할 수 있습니다. <b:section id='beomBot' showaddelement='false'> 이렇게 하면 가젯 추가 버튼이 사라집니다. 참고로 섹션을 추가한 이유는 <main> 태그에 있던 인기 글을 하단으로 제외하여 본문에 해당하는 내용만 main으로 인식할 수 있도록 수정하기 위함입니다. 관련사항은 SEO(검색 엔진 최적화)의 일환이며 컨템포 기본 테마를 활용하였습니다.

구글 블로그 상단, 하단 광고 넣는 방법

이미지
구글 블로그 상단, 하단 광고 넣는 방법에 대해 알려드리겠습니다. 우선 구글 애드센스에서 등록할 광고 코드를 가져오는 방법은 다음과 같습니다. 구글 애드센스에 접속하여 로그인 합니다. 광고 탭에서 광고 단위를 가져옵니다. 코드 가져오기에서 코드를 바로 복사하는 방법이 제일 편하실 겁니다. 이제 복사한 광고 코드를 구글 블로그에 붙여넣을 차례입니다. 블로그 테마의 HTML 편집기에서 <data:post.body/>를 검색해 주세요. 게시물의 본문이 출력되는 부분이랍니다. 그리고 body의 상단과 하단에 광고코드를 추가하여 완료할 수 있습니다. 이렇게 하여 블로그의 상단과 하단에 광고를 표시할 수 있으며, 광고의 크기와 위치는 선택한 광고단위에 따라 자동으로 조정되게 할 수도 있을 것입니다. 😊 아래의 코드를 그대로 복사하지는 마세요! 본인의 광고 코드가 pub과 함께 별도로 있을 것입니다. 아래와 같이 data post body 태그 사이에 광고코드를 붙여넣으면 된답니다. <div><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-0" crossorigin="anonymous"></script> <!-- a-top-1 --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-0"

구글 블로그 Powered By Blogger, 테마 이미지 제공 삭제하는 방법

이미지
구글 블로그에서 테마 이미지를 삭제하였는데도, 하단의 테마 이미지 제공이 계속 남아있어서 불편하신가요? 더불어 Powered By Blogger를 삭제하고 싶으실 때 아래의 방법을 따라해 보세요~ 구글 블로그에서 해당 문구는 블로그의 푸터(footer)에 위치할 가능성이 매우 높습니다. 특히 기본 테마 중, 컨템포 테마를 사용하고 있다면 푸터를 찾아보시면 된답니다. 이번 게시물에서는 블로그의 테마를 수정하여 Powered By Blogger, 테마 이미지 제공 부분을 정리해 보겠습니다. 다음과 같은 단계를 따라해 보세요. 구글 블로그에 로그인합니다. 메뉴에서 테마를 선택합니다. 맞춤 설정의 HTML편집으로 이동합니다. poweredByBlogger를 검색하여 해당 div 부분을 정리합니다. imageAuthor를 검색하여 data 태그 내에 있는 imageAuthor 부분을 정리합니다. HTML을 저장하여 삭제한 내용을 반영하도록 합니다. <b:section class='footer' id='footer' name='Footer' showaddelement='false' tag='footer'> <b:widget id='Attribution1' locked='true' title='' type='Attribution' version='2' visible='true'> <b:widget-settings> <b:widget-setting name='copyright'/> </b:widget-settings> <b:includable id='main' var=

수익 손실 위험 - 수익에 심각한 영향을 미치지 않도록 사이트에서 발견된 ads.txt 파일 문제를 해결해야 합니다. 해결하는 방법 안내

이미지
안녕하세요! 애드센스에 합격하신 것을 축하드립니다. 다만, 수익 손실 위험 - 수익에 심각한 영향을 미치지 않도록 사이트에서 발견된 ads.txt 파일 문제를 해결해야 합니다. 오류 때문에 고생을 하고 계시리라 생각합니다. 이를 해결하는 방법에 대해 안내해 드릴 예정이니 천천히 따라오시기 바랍니다. ads.txt를 찾을 수 없음 ads.txt 상태가 '찾을 수 없음' 등의 문제가 발생한 사이트 URL을 선택하여 이동하세요. ads.txt? ads.txt는 내 인벤토리를 판매하도록 승인된 판매자를 선언하는 역할을 합니다. ads.txt를 해당 사이트의 루트 디렉터리에 업로드하여야 합니다.

구글 블로그 단점 알려 드립니다.

이미지
구글 블로그 단점을 실제로 사용하며 적어내려 가보겠습니다. 비교 대상은 네이버, 다음 블로그입니다. 에디터 불편성 에디터가 2000년대 정도의 편의 기능에서 멈추어 있습니다. 실제로 구글 블로그 공식 사이트 또한 활동을 하고 있지 않습니다. 아마 구글 블로그에 대해 수익성은 기대하기 힘들지만, 그렇다고 폐쇄하기에는 블로그라는 서비스가 계륵 같은 존재여서 그냥 남겨두지 않았나 싶기도 합니다. 이미지 삽입 이미지를 삽입할 때, 원본 크기를 설정하려면 별도의 작업을 해주어야 합니다. 그리고 에디터가 워낙 좁기 때문에, 사진이 조금만 커도 잘려버리는 현상이 있습니다. 이미지가 삽입이 되면, 이미지를 사이에 두고 div 태그와 br 태그가 연달아 생기는 현상이 있어서, 저는 이 부분을 HTML보기를 통해 수작업으로 지워주는 별도의 작업을 하고 있습니다. 다음 블로그 등은 원하는 이미지가 들어가고, 해당 이미지를 편집도 별도로 할 수 있으며, 이미지를 삽입하였다고 하여 필요 없는 태그가 추가되지는 않습니다. 이미지를 삽입하는 방법은 보통 드래그 앤드 드롭, 그리고 이미지 삽입 버튼을 누른 다음에 컴퓨터에서 업로드를 선택하는 방법 등이 있습니다. 그런데, 드래그를 통해 이미지를 올리다 보면 꽤 높은 확률로 이미지 업로드가 실패하는 현상이 많습니다. 이 때에는 글 수정을 새로고침 하여 다시 올려야 하는 불편함이 있습니다.

GET https://fonts.googleapis.com/css?family=Playfair+display net::ERR_ABORTED 400 해결하기

이미지
GET https://fonts.googleapis.com/css?family=Playfair+display net::ERR_ABORTED 400 오류가 발생하는 것은 보통 구글 폰트 API를 연동하려는 값이 없을 때에 발생합니다. 확인하여야 할 부분은 매개변수에 해당하는 물음표(?) 뒤쪽의 family=Playfair+display 입니다.

블로그 로딩 만들기, 로더 만들어서 기다리게 하기

블로그 로딩을 만들어서 방문자에게 로딩을 기다리도록 하는 방법에 대해 알아보도록 합시다. 로딩은 블로그의 콘텐츠가 로드 되는 동안 보여지는 애니메이션의 역할을 할 것입니다. 로딩을 만들기 위해서는 HTML, CSS, 그리고 자바스크립트를 사용할 것입니다. 다음과 같은 순서를 따라오시면 추가할 수 있습니다. 로딩 HTML (로더) HTML은 블로그의 구조를 정의합니다. 로딩을 표시할 div 요소를 만들고 id 속성을 부여합니다. 예를 들어, id="beom-loader"라고 합시다. 다음과 같이 div 태그를 간단히 추가하여 로딩 요소를 추가할 수 있습니다. body 태그 안에서 원하는 곳에 입력해 주세요. <div id='beom-loader'/> 로딩 CSS (로더) CSS는 블로그의 스타일을 정의합니다. 로딩 div 요소에 원형 모양과 회전 애니메이션을 추가해보겠습니다. 예를 들어, 다음과 같은 코드를 사용할 수 있습니다. 푸른색 동그란 로더가 생길 것입니다. 키프레임이 애니메이션 역할을 하게 되며 spin과 같은 이름은 제가 임의로 한 것이니 원하는대로 입맛에 맞추어 수정해 주세요. #beom-loader { position: fixed; left: 50%; top: 50%; z-index: 9999; width: 120px; height: 120px; margin: -76px 0 0 -76px; border: 16px solid #f3f3f3; border-radius: 50%; border-top: 16px solid #3498db; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(36

티스토리 API를 사용하여 모든 글 목록 가져오기 방법

이미지
티스토리도 다른 프로그램과 마찬가지로 오픈 API를 제공합니다. 이번 주제는 티스토리 API를 사용하여 블로그에 있는 모든 글 목록을 가져오기를 해보겠습니다. 원래 목적은 모든 글 목록과 구글 서치 콘솔에 등록된 색인을 비교하여 색인이 누락된 게시글을 찾는 것이었으나, 이번 게시물은 티스토리 API를 어떻게 사용하는지에 대해 중점적으로 다루어 보도록 하겠습니다. (색인 비교는 다음 시간에 만나요~) 티스토리 오픈 API 티스토리 오픈 API는 OAuth(Open Authorization) 표준 프로토콜을 사용합니다. 해당 기능은 별도의 비밀번호를 제공하지 않고 외부에서 인증하고 사용 권한을 위임 받습니다. OAuth 2.0에 관한 개념과 간단한 블로거 포스트 예제 자료는 블로그 검색을 부탁드립니다. 검색은 하단에 있습니다. 티스토리 우측하단으로 이동하면 오픈 API에 관한 정보를 볼 수 있습니다. 오픈 API를 선택합니다. 앱 등록 절차는 그렇게 어렵지 않습니다. 서비스명과 설명 및 URL 등을 간단히 입력하면 바로 등록이 가능합니다. 그리고 앱등록, 앱관리 우측상단에는 오픈 API 가이드가 있습니다. 앱 아이디와 키는 노출이 되지 않도록 주의하셔야 합니다. 오픈 API 흐름 티스토리 오픈 API 흐름은 다음과 같이 진행하겠습니다. 오픈 API 인증 받기 API 인증코드 받기 인증코드를 이용하여 액세스 토큰 발급 받기 티스토리에서 모든 글 목록 가져오기 오픈 API 인증 받기 애플리케이션 기능을 사용하려면 접근 허가를 통해 인증을 받아야 합니다. 허가하기를 눌러 주세요. 다음은 인증을 받기 위해 티스토리 OAuth로 이동하는 프로그램입니다.

구글 블로그 파비콘이 안 나올 때 해결 방법

이미지
구글 블로그에서 테마를 변경하고 파비콘이 나오지 않는 현상을 발견하였습니다. 이에 대한 수정 방법에 대한 안내를 해드리려고 합니다. 😘 파비콘이란 무엇일까요? 파비콘은 웹 브라우저의 탭에 표시되는 작은 아이콘입니다. 파비콘은 웹 사이트의 식별자 역할을 하며, 방문자들에게 인상을 남기는 데 도움이 됩니다. 구글 블로그 또한 다른 사이트와 마찬가지로 자신에게 대표하는 파비콘을 설정할 수 있답니다. 하지만 가끔 파비콘을 변경해도 웹 브라우저에 반영되지 않는 경우가 있습니다. 이럴 때는 어떻게 해야 할까요? 간단한 해결 방법이 있습니다. 구글 블로그 파비콘 안 나옴 해결하기 해결 방법은 구글 블로그의 파비콘을 설정하고, 테마에서 HTML을 수정하여 파비콘을 연결하는 것입니다. 다음의 단계를 따라해 보세요. 파비콘 설정하기 구글 블로그에 로그인하세요. 왼쪽 메뉴에서 '설정'를 클릭하세요. '기본' 메뉴에서 '파비콘' 버튼을 클릭하세요. 사용하려는 파비콘을 저장합니다. HTML 편집하기 이제 HTML을 편집할 차례입니다. '테마' 탭으로 이동하여 HTML편집을 클릭해 주세요. 그리고 <head> 태그 부분에 다음과 같이 입력을 합니다. 코드를 입력하고 우측 상단의 '저장' 버튼을 누르면 이제부터 파비콘이 반영될 것입니다. <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/> <link rel="icon" href="/favicon.ico" type="image/x-icon"/> 이렇게 하면 파비콘이 웹 브라우저에 정상적으로 표시가 될 것입니다. 구글 블로그 파비콘 변경에 대해 알아보았습니다. 생각보다 간단한 방법으로 설정할 수 있으니, 여러분도 도전해 보세요! 파비콘을 자신의 취향에 맞게 바꿔

구글 블로그 신고하기 가젯 삭제하는 방법 (테마)

이미지
구글 블로그에서 기본으로 제공하는 테마 중에 컨템포가 있습니다. 해당 테마를 사용하게 되면, 신고하기 가젯이 사이드바에서 고정된 상태로 수정을 할 수가 없는데요, 신고하기 가젯을 삭제하는 방법에 대해 알아보도록 합시다. 다음은 이 기능을 삭제하기 위한 단계입니다. 블로그 테마 HTML 편집 먼저 구글 블로그에 로그인하여 테마로 이동한 후, HTML 편집을 선택하여 HTML을 수정하는 화면을 열어 주십시오. 테마로 이동하기 전에 레이아웃 탭에서 섹션과 위젯의 이름을 어느 정도 확인하고 이동하는 것도 수정하는 데 도움이 많이 될 것입니다. 신고하기 코드 삭제하기 레이아웃에서 볼 수 있는 신고하기 가젯입니다. 해당 가젯은 블로그 테마에서 다음과 같은 코드로 존재할 것입니다. 이 코드는 구글 신고하기 기능을 위한 필요한 요소들을 포함하고 있습니다. 삭제를 원하신다면 주석처리 또는 정리하고 HTML 편집 저장하기를 눌러 변경 사항을 저장합니다. <b:section class='sidebar_bottom' id='sidebar_bottom' name='Sidebar (Bottom)' preferred='yes'> <b:widget id='ReportAbuse1' locked='true' title='' type='ReportAbuse' version='2' visible='false'> <b:includable id='main'> <b:include name='reportAbuse'/> </b:includable> </b:widget> </b:section> 구글 블로그 컨템포 테마에서 신고하기 기능을 삭제하는 방법에 대해 알

티스토리 블로그 번역기 추가하는 방법 (GTranslate)

이미지
유입통계에서 의외로 많은 외국인이 방문한다는 것을 확인하였습니다. 오스트레일리아, 필리핀, 중국, 독일, 프랑스, 캐나다, 일본 등등 각 나라에서도 저의 글이 서칭이 되나 봅니다. 그리하여, 외국인 방문자를 위하여 티스토리 번역기를 추가해 보기로 하였습니다. 추가에 사용한 프로그램은 GTranslate입니다. 구글 번역은 옛날에는 무료였는데, 현재는 몇 글자 이상은 유료로 사용하여야 해서 다른 방법을 찾아본 결과, GTranslate를 사용해 보기로 하였답니다. 다음의 과정을 따라 하시면 쉽게 번역기를 추가할 수 있을 것입니다. 요금제 선택 GTranslate 홈페이지로 이동하면 요금제를 선택하는 화면이 나옵니다. 원하시는 요금제를 선택하면 되는데, 저는 무료로 사용할 예정이라 제일 왼쪽 요금제를 선택하겠습니다. 유형 선택 줌라, 드루팔, 워드프레스, 쇼피파이, 그리고 다른 HTML을 선택하는 화면이 나옵니다. 티스토리 블로그에 추가할 예정이면 Other HTML을 선택하시면 됩니다. 혹시라도 워드프레스에서 추가하려면 상단의 WordPress 부분을 통해 손쉽게 플러그인을 추가할 수 있습니다. Other HTML에서 Website Translator Widget을 선택하여 이동해 주세요. 설정하기 위젯(widget)은 인터페이스 요소를 뜻합니다. widget look, translate to 등의 정보를 원하는 대로 선택하고 'UPDATE PREVIEW'를 클릭하면 현재 설정값으로 프리뷰를 최신화해서 보여드립니다. TRANSLATE FROM 은 'Korean'을 그대로 설정하세요. 저는 이것저것 눌러보다가 이 부분을 실수로 'en'으로 바꿨는데, 원문을 'ko'이 아니라 'en'으로 인식하여 번역이 이상하게 되어 버립니다. 처음 설정했을 때, 번역이 너무 이상하게 되어 확인하다 보니 찾았답니다. HTML 편집하기 티스토리 관리자 페이지로 이동하여 스킨 편집하기를