미넴 스킨 제작 프로젝트/업데이트

티스토리 미넴 스킨 2.6.0 업데이트 - 글 중간 광고 자동 삽입

아미넴 2021. 12. 20.
반응형

안녕하세요. 오랜만에 업데이트를 합니다.

 

이번에도 광고 수익 향상에 도움될 만한 몇 가지 기능과 폰트 변경, 편의 기능 등 업데이트가 많이 이루어졌으니 관심 있으신 분들은 충분히 확인해 보시고 적용 부탁드리겠습니다.

테스트 블로그에 먼저 적용하여 어느 정도 테스트를 거친 후 운영 중인 블로그에 적용하시는 것을 권장합니다.

 

(추가 수정)

2022.01.06 모바일 뷰에서 다크 모드에서 라이트 모드로 전환 시 사이드바는 다크 모드 색으로 그대로 남아있는 현상을 수정하였습니다.

2022.02.05 사파리(웹킷 엔진) 브라우저에서 이미지 지연 로딩이 정상 동작하지 않는 문제를 해결하였습니다. 

 

이미 적용하신 분은 다음 파일만 다시 업로드 하시면 되고 새로 업데이트 하실 분들은 무시하셔도 됩니다.

common.min.js
0.04MB

 

목차

     

     

    개선 사항

    1. 글 중간 자동 애드센스 광고 삽입 기능을 추가하였습니다.

    2. 전체 글의 리스트 형태 출력 기능을 추가하였습니다.

    3. 이롭게 바탕체 외의 다른 폰트는 제외하고 리디바탕 폰트를 추가하였습니다.

    4. 애드센스 검색 광고 설정을 추가하였습니다.

    5. 사이드바 애드센스 일치하는 광고 자동 스크롤 기능을 추가하였습니다.

    6. 애드센스 광고 설정 시 공통 코드는 한 번만 입력하도록 개선하였습니다.

    7. URL에 의한 자동 번역 기능을 추가하였습니다.

    8. 로딩 스피너가 표시될 때 스크롤 되지 않도록 개선하였습니다.

    9. 댓글 작성으로 바로 이동할 수 있도록 플로팅 버튼을 추가하였습니다.

    10. 광고 코드 미입력 시 사이드바 일치하는 광고가 표시되지 않도록 하였습니다.

    11. 강제 다크 모드 설정 시 모든 다크/라이트 모드 전환 버튼이 표시되지 않도록 하였습니다.

    12. 카테고리 접힘 기능 이용 시 펼칠 카테고리만 입력하도록 변경하였습니다. (기본은 모두 접힘)

    13. 스킨 편집 페이지의 스킨 설정 항목들을 정비하였습니다.

    14. 기타 자잘한 문제점을 개선하였습니다.

     

    설정 화면 미리보기

    주요 설정 화면을 미리 살펴 보겠습니다.

     

    글 중간 애드센스 광고 자동 삽입

    사용 여부 및 광고 빈도를 설정할 수 있습니다. 기본 값은 30라인 마다 삽입입니다. 애드센스 기준으로 기존 삽입 광고가 있으면 무시되도록 하는 기능도 있는데 광고를 어떻게 적용시켰는지에 따라서 적용이 되지 않을 수도 있으니 참고 바랍니다.

    광고 종류는 콘텐츠 내 삽입 광고 및 디스플레이 사각 광고가 기본이고 이 둘을 랜덤으로 출력시키는 기능까지 구현해 놓았습니다. 다른 종류의 광고 slot 값을 넣으면 정상적으로 표시되지 않을 수 있으니 주의 바랍니다.

     

    개별적으로 적용하고 싶으신 분은 다음 게시물 참고 바랍니다.

     

    광고 수익 향상 꿀팁, 글 중간 애드센스 광고 자동 삽입 업그레이드 버전

     

    광고 수익 향상 꿀팁, 글 중간 애드센스 광고 자동 삽입 업그레이드 버전

    얼마 전에 글 중간에 광고를 자동으로 삽입하기 위해 간단하게 작성한 로직이 있었는데 한계점이 보여서 좀 더 고민하여 새로 작성해 보았습니다. 최초 작성한 글이 궁금하신 분은 다음 링크 참

    sangminem.tistory.com

     

    전체 글 리스트 형태 출력

    기존에는 그리드 형태만 지원을 하였는데 리스트 형태도 출력이 되도록 기능을 추가하였습니다. 아래 빨간 박스 부분에서 설정 가능합니다. 전체 글 뿐만 아니라 카테고리 별 글도 지원이 됩니다.

     

    다음과 같이 리스트 형태로 잘 표시가 됩니다. 리스트 형태 사용 시 인피드 광고도 적용할 수 있으므로 참고 바랍니다.

     

    리디바탕 폰트 추가

    이번 버전부터는 기본, 이롭게 바탕체, 리디바탕 3가지 종류만 지원하오니 참고 바랍니다.

    여담이지만 리디바탕 폰트를 사용하는 블로그가 많아서 저는 가급적 사용하고 싶지 않았으나 직접 사용을 해보니 생각보다 더 깔끔해 보이고 가독성이 뛰어나서 채택을 하게 되었습니다.

     

    폰트가 별도로 필요하신 분은 다음 글 참고하세요.

     

    리디바탕 폰트 용량 축소 파일 (otf, woff, woff2)

     

    리디바탕 폰트 용량 축소 파일 (otf, woff, woff2)

    리디바탕체를 이용해 보고 싶었는데 웹폰트로 이용하기에는 용량이 너무 커서 좀 줄일 필요성을 느꼈습니다. 다른 분들이 줄인 파일이 있는지 찾아 보았는데 찾기가 어려워서 그냥 제가 줄였습

    sangminem.tistory.com

     

    애드센스 검색바 광고 추가

    cx 파라미터에 들어가는 코드만 입력하면 자동으로 셋팅될 수 있도록 구현해 놓았습니다.

     

    검색 광고 설정 시 레이아웃을 꼭 두 열로 설정해 주셔야 정상적으로 동작합니다. 나머지 설정은 적절히 해주시면 됩니다.

     

    저장 및 코드 생성 버튼을 누르면 나오는 코드에서 아래 초록색 부분 값만 가져와서 입력하시면 됩니다.

     

    애드센스 일치하는 광고 자동 스크롤

    일치하는 광고의 길이를 길게 할 경우 자동 스크롤 되는 기능을 구현하였습니다. 플로팅 광고를 사이드바 일치하는 광고로 설정했을 경우 동작합니다.

     

    다음과 같이 동작합니다. 예시는 데이블 광고지만 방식은 같습니다.

     

    자동 번역 기능 추가

    URL 뒤에 trans_lang 파라미터 값을 주면 자동 번역되도록 기능을 추가하였습니다.

     

    다음과 같이 주소를 입력하면 진입하자마자 블로그가 영어로 번역이 됩니다.

    https://sangminem.tistory.com?trans_lang=en 

     

    영상으로도 확인해 보세요.

     

    따로 구현하고 싶으시면 다음 글 참고 바랍니다.

     

    티스토리 블로그 자동 번역 URL 생성하는 방법

     

    티스토리 블로그 자동 번역 URL 생성하는 방법

    예전에 번역 기능은 이미 소개한 적이 있지만 여기서 만족하지 않고 필요에 따라 블로그 링크를 오픈하자마자 바로 번역이 된다면 더욱 유용할 것 같아서 생각해 보았습니다. 이를 위해 다음 기

    sangminem.tistory.com

     

    댓글 입력 바로 이동 버튼 추가

    댓글 입력 칸으로 바로 이동할 수 있는 플로팅 버튼을 추가하였습니다.

     

    소개 및 설치 방법

    다음 게시물을 참고하여 설치 바랍니다.

     

    친효 스킨, 고래 스킨 뒤를 이을 티스토리 무료 스킨 제작 프로젝트, 미넴 스킨 소개 및 설치 방법

     

    친효 스킨, 고래 스킨 뒤를 이을 티스토리 무료 스킨 제작 프로젝트, 미넴 스킨 소개 및 설치 방

    기본 제공 스킨을 나름대로 고쳐 쓰다가 만족하지 못하고 그냥 새로 만들었습니다. 여태까지 블로그를 하면서 적용한 많은 기능들을 대부분 포함하였으니 누군가에게는 상당히 유용한 스킨이

    sangminem.tistory.com

     

    업데이트 후 적용이 잘 안 되신다면 강제(강력) 새로고침을 해보세요. 단축키는 윈도우10 크롬 기준 Ctrl+Shift+R, 맥 크롬 기준 Command+Shift+R 입니다.

     

    궁금한 점이 있으시면 자주 묻는 질문 게시물 먼저 확인 바랍니다.

     

    미넴 스킨 자주 묻는 질문(FAQ)

     

    미넴 스킨 자주 묻는 질문(FAQ)

    미넴 스킨 게시물에 대부분 설명이 나와 있지만 내용이 많아서 찾기 어렵거나 빨리 훑어 보고 싶으신 분들을 위해 작성하였습니다. 지속적으로 추가해 나가도록 하겠습니다. 목차 사이드바 기

    sangminem.tistory.com

     

    미넴 스킨 2.6.0 버전 다운로드

    Mynem Skin V2.6.0.zip
    2.57MB

    반응형

    댓글

    💲 추천 글