[WP] 플러그인을 이용한 사용자 CSS 적용

워드프레스 관리자에서 사용자 CSS 코드를 입력할 수 있는 방법을 이미 제공하고 있지만.. 그럼에도 불구하고 플러그인을 만들어 본 것은 어찌보면 쓸데없는 짓일 수도 있다.

그런데 이렇게라도 워드프레스 관련 작업을 해보지 않으면 알던 것도 잊는 수가 있기 때문에 또 쓸데없는 코딩을 하고 있다. 추가하려는 CSS 코드는 아래와 같다. style.css 파일로 저장한다.

@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

body {font-family: 'Noto Sans KR', 'Open Sans',sans-serif}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {color: #DA4453;font-weight: 700;font-family: 'Noto Sans KR','Open Sans', sans-serif;}
blockquote {font-size: 14px}

다음으로 플러그인을 구성하는 PHP 코드는 아래와 같다.

<?php

/**
 * @package Add custom stylesheet
 * @version 1.0.0
 */
/*
Plugin Name: Add custom stylesheet
Plugin URI: https://ncube.net/
Description: This plugin add javascript code for shortcuts on footer.
Author: chicpro
Version: 1.0.0
Author URI: https://ncube.net/
*/

add_action( 'wp_enqueue_scripts', 'add_custom_stylesheet', 100 );

function add_custom_stylesheet()
{
    wp_enqueue_style( 'add-custom-stylesheet', plugins_url( 'style.css', __FILE__ ), array(), '1.0.0' );
}

위 코드를 적당한 이름으로 저장하고 위 style.css 파일과 동일한 폴더에 넣어 워드프레스 사이트에 업로드 한 후 플러그인을 활성화 시키면 CSS 코드가 적용된다. 만약 style.css 파일의 코드를 변경한 후 변경된 코드가 적용되지 않는다면 1.0.0 으로 표시된 버전을 1.0.1 등으로 변경해줘야 한다.

편리

PHP와 MariaDB, jQuery 등을 사용해 게시판, 쇼핑몰 솔루션을 개발합니다. 그누보드5와 영카트5 개발에 참여 했습니다. Linux와 Nginx는 물론 WordPress, Git 등에도 관심이 많습니다. 자전거 타기 및 사진 촬영을 취미로 하고 있습니다.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.