로그인

검색

Extra Form
추천지수 7

애드센스.jpg

 

 

라이믹스 다크모드 일때 애드센스 어두운배경 광고 출력하는 것의 팁을 작성해 드렸는데요.

https://rxtip.kr/rx_tip/6910

 

현재 Body class만 확인해서 간단하게 할 수 있는 방법이 있어 간단 버전의 팁을 작성 합니다.

 

라이믹스에서 현재 Body class의 값을 배열로 반환해주는 함수를 개발자버전에서 신규로 제공했습니다.

https://github.com/rhymix/rhymix/commit/bd075ee409099a20d405a5fa6b92f2fe637781bc

 

위 함수를 이용하는 방법도 기술해 드릴테니 해당 패치 적용 후 코드를 교체할 지는 결정하시면 될 것 같습니다.

 

우선 위 패치와 상관없이 가능한 버전입니다.

 

현재 body의 class가 다크모드, 라이트모드 의 값을 가지고 있는지 확인해서 결과를 세션으로 공유하는 방법을 사용합니다.

 

{@
if(preg_match('/color_scheme_light/', Context::getBodyClass())): $_SESSION['__body_class_name__'] = 'color_scheme_light';
endif;
if(preg_match('/color_scheme_dark/', Context::getBodyClass())): $_SESSION['__body_class_name__'] = 'color_scheme_dark';
endif;
}

 

레이아웃 위쪽에 위와 코드를 작성해주세요.

 

위와 같이 $_SESSION['__body_class_name__'] 상황에 맞게 color_scheme_light 또는 color_scheme_dark 를 가지게 됩니다.

 

 

이제 애드센스 코드를 밝은색, 어두운색 2가지 를 준비하 신 후 위 세션의 값으로 조건을 걸어주시면 됩니다.

 - 어두운색상으로 스타일을 지정할 수 있는 애드센스 광고단위는 인피드,컨텐츠삽입,일치하는 광고 세가지 입니다.

 

저희 라이믹스 꿀팁과 제가 운영하는 커뮤니티 중 라이믹스2 다크모드를 사용하는 사이트는 이미 적용했습니다.

 

 

애드센스 코드를 아래와 같이 조건을 걸어줍니다.

 

<!--@if($_SESSION['__body_class_name__'] === 'color_scheme_dark')-->
어두운 배경의 애드센스 코드
<!--@else-->

밝은색 배경의 애드센스 코드
<!--@end-->

 

 

세션이 저장된 후 해당 세션이 있을때 부터 값이 확인되니 새로고침 없이 body class가 변경되면 새로고침이 발생한 이후에 매칭된 애드센스로 전환이 됩니다.

 

 

 

* 서두에 언급해 드린 라이믹스 패치가 적용된 이후에 사용할 수 있는 코드는 아래와 같습니다.

 

{@
if(in_array('color_scheme_light', Context::getBodyClassList())): $_SESSION['__body_class_name__'] = 'color_scheme_light';
endif;
if(in_array('color_scheme_dark', Context::getBodyClassList())): $_SESSION['__body_class_name__'] = 'color_scheme_dark';
endif;
}

 

첫번째 작성해드린 코드만 위와 같이 바꾸고 애드센스의 조건을 그대로 사용하시면 됩니다.

body 가 가진 class를 배열로 반환해주는 Context::getBodyClassList() 가 신규로 만들어졌습니다.

 

 

*쿠키를 이용하는 것에 비해 단점이 세션 생성단계가 쿠키 이용때 보다 1단계 더 필요해서 쿠키사용때 보다 한단계 늦게 반영됩니다.

*디바이스 다크모드 쿠키, 라이믹스 다크모드 쿠키 두개를 이용하는게 더 좋은 선택입니다. 저희는 이방식으로 다시 회귀 했습니다.

 

Who's 꿀팁관리소장

profile

라이믹스로 커뮤니티 사이트를 운영하는 비개발자 운영자 입니다.

커뮤니티를 운영하면서 필요한 간단한 것을 만들고 공유하고 운영에 필요한 노하우나 기술을 공유합니다.

하지만 따로 의뢰를 받거나 하지 않으니 문의 등을 하실 필요는 없습니다.

Atachment
첨부 '0'

라이믹스 팁(76)

라이믹스 운영과 사용에 관한 팁을 공유 합니다.

  1. read more
  2. read more
  3. Read More
  4. Read More
  5. Read More
  6. Read More
  7. Read More
  8. Read More
  9. Read More
  10. Read More
  11. Read More
  12. Read More
  13. Read More
  14. 라이믹스 회원(팝업)메뉴에 아이콘 추가해주기

    Date2021.05.11 Category기능 Views54 Votes0
    Read More
  15. Read More
  16. Read More
  17. Read More
  18. 신규 회원 가입 사실만 메일로 전달 받고 싶을때

    Date2021.05.06 Category기능 Views45 Votes0
    Read More
  19. Read More
  20. Read More
  21. 스케치북5 스킨 검색어 하이라이트 효과 주기

    Date2021.05.02 Category기능 Views52 Votes0
    Read More
  22. Read More
  23. Read More
  24. 댓글 주소 클립보드에 복사하는 기능 추가하기 10

    Date2021.04.25 Category기능 Views46 Votes0
    Read More
  25. Read More
  26. Read More
  27. Read More
  28. 스케치북 빵조각 '메뉴 아이콘' 적용해 보았습니다.

    Date2021.04.21 Category기능 Views34 Votes0
    Read More
  29. Read More
  30. 본문 게시글 주소 복사 버튼 여러곳에 추가해 주기 17

    Date2021.04.10 Category기능 Views49 Votes0
    Read More
  31. input 입력창 크기가 작거나 이상한가요? css box-sizing

    Date2021.04.09 Category기타 Views43 Votes0
    Read More
  32. 본문 게시글 주소 클립보드 복사 기능 만들기 8

    Date2021.04.06 Category기능 Views73 Votes0
    Read More
Board Pagination Prev 1 2 3 Next
/ 3