가입하기

노트



코드 및 디자인 레퍼런스


  • 워드프레스 구텐버그 로드 비활성화
    워드프레스 구텐버그 로드 비활성화
    노트@867.210806 
    function smartwp_remove_wp_block_library_css(){
   wp_dequeue_style( 'wp-block-library' );
   wp_dequeue_style( 'wp-block-library-theme' );
}
add_action( 'wp_enqueue_scripts', 'smartwp_remove_wp_block_library_css' );

    특정 목적에 따라 워드프레스의 Gutenberg 에디터가 불필요할 경우가 있다. 그럴때 보통 Classic Editor 를 설치하기도 한다. 하지만 프론트엔드에서는 여전히 Gutenberg 관련 스크립트가 로드 되는것을 볼 수 있다. 확실히 Gutenberg를 비활성화 하여 사이트 로드를 조금더 빠르게 하고자할때 사용하면 좋다.

    # # #
  • OpenLiteSpeed 엔진에서 퍼멀링크 재정의
    OpenLiteSpeed 엔진에서 퍼멀링크 재정의
    노트@813.210718

    OpenLiteSpeed 엔진 사용시 워드프레스 퍼멀링크를 변경하면 오류가 생기는 경우가 있다.  Nginx 또는 Apache 엔진은 퍼멀링크 규칙을 변경하면 .htaccess 자동으로 재작성하여 별다른 작업 없이 적용 가능하다. 하지만 LiteSpeed 엔진 계열 같은 경우는 반드시 엔진을 다시 시작해 주어야 변경된 .htaccess가 정상 적용된다.

    # # #
  • 캐시 예외 설정
    캐시 예외 설정
    노트@786.210715 
    index.php?rest_route=/contact-form-7/v1/contact-forms/759/refill

    워드프레스 각종 캐시 설정시 Contact Form 7 관련 예외처리 URL

    # #
  • the_content() 본문 이미지 추출
    the_content() 본문 이미지 추출
    노트@766.210618 
    function get_first_image() { 
   global $post, $posts; $first_img = '';
   ob_start(); ob_end_clean();
   $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
   $first_img = $matches[1][0];
   return $first_img;
}

    특성 이미지를 사용하지 않을때 목록에서 썸네일로 활용

    # # #
  • TXT Record로 Let’s Encrypt SSL 인증서 발급
    TXT Record로 Let’s Encrypt SSL 인증서 발급
    노트@761.210616 
    certbot certonly -d domain.com --manual --preferred-challenges dns

    인증서 발급시 A레코드 갱신 대기, 누락 등의 이유로 인증되지 않을 때 TXT레코드로 시도하여 정상 발급하기

    # # #
  • Search Meter와 Relevanssi 연동
    Search Meter와 Relevanssi 연동
    노트@760.210616 
    function switch_search_meter_priority() { 
  remove_filter( 'the_posts', 'tguy_sm_save_search', 20 );
  add_filter( 'the_posts', 'tguy_sm_save_search', 100 ); 
}
add_action( 'init', 'switch_search_meter_priority' );

    Search Meter 업데이트 중단으로 보안 이슈 발생하여 코드 폐기

    # # # #
  • Android 웹뷰 구글 로그인 이슈
    Android 웹뷰 구글 로그인 이슈
    노트@645.201119 
    webView.getSettings().setUserAgentString("app.name");

    웹뷰 사용시 UserAgent 추가하여 구글 로그인 지원

    # # # #
  • 포스트 메타로부터 유튜브 동영상 추출
    포스트 메타로부터 유튜브 동영상 추출
    노트@464.201102 
    function onPlayerReady(event) {
 $("ul#vidlist li").click(function(){
  $('ul#vidlist li.active').removeClass('active');
  $(this).addClass('active');
  var ytid = $(this).data('ytid');
  player.loadVideoById(ytid);
 });
}
function onPlayerStateChange(event) {
 if (event.data == YT.PlayerState.ENDED) {
  alert('이벤트 트리거');
  $('ul#vidlist li.active + li').trigger('click');
 }
}

    포스트 메타 유튜브 추출

    개별 포스트 메타에 속해 있는 유튜브 영상을 추출 및 취합하여 하나의 플레이어와 플레이리스트로 출력합니다.

    구글 ‘자동재생’ 정책 변경

    2018년 4월 발표한 구글 정책 변경에 따라 페이지 진입시 첫 번째 플레이어의 ‘자동재생’은 음소거 상태에서만 실행 될 수 있습니다.

    플레이리스트의 ‘자동재생’

    첫 번째 플레이어 영상 재생 종료 시 트리거 이벤트를 발생시켜 플레이리스트의 다음 재생 정보를 불러와 ‘자동재생’을 실행 합니다. 이는 구글 ‘자동재생’ 정책의 영향을 받지 않습니다.

    [포스트 메타… 추출] 의미와 활용

    유튜브 서비스내에서 플레이리스트를 생성하여 외부 사이트에 임베드 형식으로 추가하는 것과는 다른 개념입니다. 개별 영상 또는 포스트 메타에 속해있는 영상을 사이트 내부에서 추출 및 취합하고 플레이 하는 방식입니다. 이로 인해 영상 서비스에 대한 트래픽 비용 절감 및 다양한 미디어 관련 로직에 활용 될 수 있습니다.

    # # #