ry.cl. blog

글

라벨이 blogger인 게시물 표시

구글 블로거에서 css를 사용하여 블로그 상단에 드롭다운 메뉴 만들기

9월 29, 2020

이전 사용하던 메뉴에 문제가 있어서 다시 만들기로 했다. 1. 쓸 만한 디자인의 메뉴를 찾아보자. http://cssmenumaker.com/css-menus 에서 쓸 만한 메뉴 디자인 css파일을 다운받을 수 있다. 2. 블로거 레이아웃의 가젯 추가에서 HTML/JavaScript 를 추가한다. 메뉴에 보일 리스트들을 콘텐츠 창에 추가한다. 위 1번에서 다운받은 메뉴 css가 몇 개의 서브 리스트를 지원하는지 확인하고 리스트를 구성해야 한다. 다운받은 파일내에 예제로 사용할 수 있는 index.html 파일이 있으므로 이를 참조하자. <div id='cssmenu'> <ul> <li class='active'><a href='#'><span>Home</span></a></li> <li class='has-sub'><a href='#'><span>Products</span></a> <ul> <li><a href='#'><span>Product 1</span></a></li> <li><a href='#'><span>Product 2</span></a></li> <li class='last'><a href='#'><span>Pro...

자세한 내용 보기

블로그에 Google 애드센스 맞춤 검색 엔진 추가

9월 12, 2020

블로그에 Google 애드센스 맞춤 검색 엔진이라고 하는 것을 추가해 보았다. 블로그내 혹은 웹 검색 엔진이며 동시에 검색 결과와 관련성 높은 광고를 게재하는 Google의 고품질 검색 광고 환경이라고 한다. 추가 방법은 구글 애드센스에서 검색 엔진 환경을 설정하고 코드를 생성한 후 블로그에 그 코드를 추가하면 된다. 검색 엔진 환경 설정과 코드 생성 Google AdSense 페이지에서 검색 엔진 환경 설정 및 코드를 생성할 수 있다. '검색용 광고' 메뉴의 '맞춤 검색 엔진' 항목에서 '새프로그래밍 검색 엔진'을 통해 검색 엔진 환경을 생성하고 설정하고 코드를 생성한다. 새프로그래밍 검색 엔진을 클릭하면 아래 이미지와 같이 나온다. 환경 이름, 검색 범위, 키워드 등을 설정하고 마지막으로 저장 및 코드 생성을 클릭하면 아래와 같이 스크립트 코드가 생성된다. 이 생성된 코드를 블로그에 추가하면 검색 엔진을 사용할 수 있다. 검색창의 스타일 등도 따로 설정할 수 있다. 블로그에 코드 추가 검색 창 코드를 블로그에 추가할 때 HTML/Java Script 가젯을 사용했다. 위에서 생성된 코드를 가젯의 콘텐츠내용에 붙여 넣고, 페이지 레이아웃의 적당한 부분에 올려 놓았다. 검색 엔진 창을 추가한 화면은 아래와 같다. 검색하면 검색 엔진 설정처럼 새로운 페이지에 검색 결과가 나타난다. 검색은 잘되는 것 같은데, 광고는 모르겠다. 검색이 잘되는 것 만으로도 만족한다.

자세한 내용 보기

구글 Blogger 애드센스 연결

8월 29, 2020

블로그가 애드센스에 연결 수익 탭에 블로그에 광고 게재 준비중이라는 메세지가 뜨고 5주정도 지났다. 구글 Blogger 애드센스 블로그에 광고 게재 준비 중 5주가 지나도록 아무런 변화가 없었다. 혹시나 하는 마음에 AdSense 페이지에서 '사이트 추가'를 했더니 아래처럼 '사이트의 광고 게재 가능 여부 검토 중'이라고 나오고 하루만에 애드센스에 연결되었다. 전에는 '사이트 추가'를 해도 블로그는 추가가 되지 않았다. 자동 광고 설정 사이트 추가가 끝나면 AdSense에서는 자동으로 광고를 게재하는 것을 추천한다. '코드 가져오기'를 클릭해 표시되는 창의 코드를 사이트의 <head></head>태그 사이에 복사해 넣으면 된다. html코드는 구글 블로거 테마 탭에서 'HTML 편집 '을 통해 편집할 수 있다. 위 그림의 펜 모양 아이콘을 클릭하면, 별도의 광고 설정도 가능하다. 광고 형식이나 표시될 광고 개수 등을 설정할 수 있다. 자동 광고만을 사용할 경우 수익 탭의 '블로그에 광고 표시 방법 관리'를 활성화하지 않아도 된다. '블로그에 광고 표시 방법 관리'를 활성화하면, 블로그 테마에서 지정한 위치에 광고가 게재된다. ads.txt 애드센스에 블로그가 연결되면, 애드센스에서는 '수익 손실 위험' 이라며 ads.txt파일을 사이트에 업로드하라고 나온다. Ads.txt 가이드 방법은 간단한다. 위 이미지처럼 나온 정보 창에서 '다운로드'를 클릭하여 ads.txt.파일은 받은 후 파일 내용을 블로거 설정 탭의 수익 창출 부분에서 맞춤 ads.txt 사용 설정에서 ads.txt.파일의 내용을 복사해 넣어주면 된다. ...

자세한 내용 보기

구글 Blogger 애드센스 블로그에 광고 게재 준비 중

7월 25, 2020

블로그에 광고 게재 준비 중 Google Blogger 시작한지 4개월 정도 되어간다. 어느 날 '수익' 탭을 클릭했더니, 애드센스 계정이 있으니 연결하라고 한다. 연결을 클릭하니 '블로그에 광고 게재 준비 중'이라고 뜬다. 보통 6개월 정도 걸린다고 알고 있었는데, 생각보다 빠른 것 같다. 방문자도 별로 없는 블로그에 광고라니. .. ... ..... 5일이 지났지만, 계속 준비 중이라고 뜬다. 사이트 목록에 있는 사이트의 상태 확인하기 찾아 보니 최대 2주가 소요될 수도 있다고 한다. Google 블로그 애드센스 애널리틱스 통합 광고를 달기전에 애널리틱스와 통합하기로 했다. 포스트 접속양과 수익 등의 관계 데이터를 체계적으로 보기 위함이다. 애널리틱스의 '관리'탭에서 애드센스 연결을 선택한다. 서비스'콘텐츠용 애드센스'와 링크를 설정하면 된다. 연결 완료되면 애드센스 사이트에서도 애널리틱스 분석 내용도 볼 수 있다.

자세한 내용 보기

구글 블로그 글 목록 (post list) 수정 버전

7월 17, 2020

google blogger 글 목록(post list) 자바 스크립트 수정버전. 원 스크립트 파일은 아래에서 받았다. 두 군데 모두 스크립트내용이 동일해 누가 원작자인지는 모르겠다. http://cremazer.blogspot.com/2013/09/blogger-post-list.html https://poisongodf.blogspot.com/2014/11/blog-post_28.html 수정 내용 - 리스트 항목 클릭 시 summary를 보여주던 문제를 포스트 페이지로 바로 이동하도록 수정 스크립트는 Blogger:레이아웃 > 가젯 추가 > HTML/JavaScript를 추가한 후 콘텐츠에 스크립트를 복사해 붙여 넣으면 된다. 수정된 스크립트 <div class='refer_box'> <div align="left" id="posts"></div> <div align="center" id="posts-pgno" style="cursor: pointer;"></div> </div> <script language="Javascript" type="text/javascript"> var request = { parameter: function(name) { return this.parameters()[name];}, parameters: function() { var result = {}; ...

자세한 내용 보기

구글 blogger 블로그 css 추가로 소스 코드용 박스 모델(html box model)을 만들다.

7월 10, 2020

지금까지 포스트 올릴 때 글과 소스 코드 구분이모호해 보기 좋지 않았다. 구글 blogger 테마 디자이너에서 'CSS 추가'를 이용해 '소스 코드'용 박스를 만들었다. 고급 메뉴의 'CSS 추가'에 아래 스크립트를 작성해 넣었다. .code_box { border-style: solid; border-color: #9090e0; background-color: #fefefe; border-width: 1px 3px 3px 1px; padding:10px; word-break; break-all;} 글을 작성할 때 'HTML 보기'로 전환 후 div 태그에 class="code_box"를 추가해 사용한다. 위 그림처럼 추가하면 아래 박스와 같이 보여 진다.

자세한 내용 보기

구글 blogger 방문자 확인을 위해 애널리틱스 가입

7월 02, 2020

구글 블로그 방문자 확인을 위해 애널리틱스 가입했다. 블로그를 시작한지 3달정도 지났다. 방문자도 늘지 않고(포스트 내용들이 사람들에게 관심 받지 못해 그런 것 같기도 하다.), 블로거 통계 메뉴에도 내가 페이지를 본 회수까지 포함돼 얼마나 방문하는지 알 수가 없었다. 그래서, 확실히 얼마나 사람들이 방문하는지 알아보기 위해 구글 애널리틱스(google analytics) 에 가입해 봤다. 가입 절차대로 진행하고 블로그 url도 넣어줬다. 애널리틱스 알림에서 search console과연결하고, 내부 트래픽 필터링을 하라고 나와서 그것도 해주었다. 1. search console 연결 알림 창의 링크를 따라 가거나 좌측 하단의 톱니바퀴 모양의 ' 관리 ' 아이콘을 클릭하여 ' 모든 제품 ' 메뉴에서 search console 연결 을 선택한다. search console 설정에서 '추가' 를 클릭해 아래 그림과 같은 창에서 search console을 연결해 준다. 2. 내부 트래픽 필터링 '관리' 메뉴의 ' 필터 '에서 아래 그림과 같이 내부 트래픽 필터를 추가할 수 있다. 고정 아이피를 쓰고 있어서 필터 유형은 아래 그림과 같이 '제외','해당IP주소에서유입된트래픽''일치'로 하고, 사용하고 있는 IP를 넣어주었다. 위 1,2 번을 끝내고 나면 애널리틱스 알림에서 아래와 같이 해결됨이라고 나온다. 3. google 애널리틱스 속성 ID 마지막으로 구글 블로거 설정에서 ' Google 애널리틱스 속성 ID '에 UA-XXXXX-XX 형식의 추적 ID도 입력했다. 이제 정확한 트래픽을 볼 수 있으리라 기대한다.

자세한 내용 보기