태그 보관물: 웹프로그래밍

워드프레스에서 문자열에 어귀마다 하이픈을 추가하기

sanitize_title_with_dashes()

위 워드프레스 API 함수를 쓰면 문자열에서 어귀마다 하이픈을 추가해서 리턴해줍니다.


<?php
echo sanitize_title_with_dashes("임의의 문자열을 인자로 넘겨주세요");
?>

<?php

echo sanitize_title_with_dashes("임의의 문자열을 인자로 넘겨주세요");

처럼 실행하면

임의의-문자열을-인자로-넘겨주세요

로 변환된 문자열을 화면에 표시합니다.

위의 예제에서는 echo 함수에 sanitize_title_with_dashes() 함수의 리턴값을 넘겼는데요. echo 함수로 표시하는 기능 외에도 다른 용도로도 응용하면 다른 기능을 구현하는 용도로도 쓸 수 있습니다. 예를 들면 글 제목을 슬러그 형태로 변환하는 기능이 그 예입니다. 워드프레스 슬러그는 문자열을 어귀로 분리해서 하이픈이 사이사이에 들어가야 하므로 위의 함수로 문자열을 조정하면 슬러그 변환이 되게 됩니다.

여기에 더해서 PHP 함수로 rawurlencode() 와 rawurldecode() 를 적절히 써서 위에서 얻어진 문자열을 처리하면 URL 인코딩/디코딩 된 문자열이 얻어집니다. 플러그인 제작을 할때 필요할 수 있네요.

https://www.php.net/manual/en/function.rawurlencode.php
https://www.php.net/manual/en/function.rawurldecode


<?php
$str = sanitize_title_with_dashes("임의의 문자열을 인자로 넘겨주세요");
$encoded = rawurlencode($str);
$decoded = rawurldecode($encoded);
?>

<?php

$str = sanitize_title_with_dashes("임의의 문자열을 인자로 넘겨주세요");

$encoded = rawurlencode($str);

$decoded = rawurldecode($encoded);

위와 같이 하면 $encoded 에는 %EC%9E%84%EC%9D%98%EC%9D%98-%EB%AC%B8%EC%9E%90%EC%97%B4%EC%9D%84-%EC%9D%B8%EC%9E%90%EB%A1%9C-%EB%84%98%EA%B2%A8%EC%A3%BC%EC%84%B8%EC%9A%94 가 들어가게 되구요.
$decoded에는 임의의-문자열을-인자로-넘겨주세요 와 같은 디코딩된 문자열이 들어갑니다.

결론:
https://developer.wordpress.org/reference/functions/sanitize_title_with_dashes/
https://www.php.net/manual/en/function.rawurlencode.php
https://www.php.net/manual/en/function.rawurldecode

이들 함수를 잘 활용하면 슬러그 처리시 유익하게 쓸 수 있습니다.

아스트라 프로에서 카테고리별로 다른 디자인 보여주는 방법 아이디어

댓글 남기기

요즘 만들고 있는 사이트에서 블로그 카테고리별로 글보여주는 레이아웃을 카테고리마다 각각 바꾸어봐야 하는데 보류하고 있습니다.

궁리닷컴 이전 버전 사이트처럼 하나의 인문학서 감성으로 디자인을 해서 레이아웃을 보여주고 싶은데요. 지금은 블로그 테마에 내장된 카테고리 표시 기능으로 글을 보여주느라, 카테고리마다 다른 디자인으로 보여주려면 archive.php와 같은 파일을 직접 고쳐야 합니다.

이게 코딩을 요하는 작업이라 타이핑도 그렇고 이미지 연결도 귀찮으니 다른 방법을 써야 합니다.

아스트라 프로를 스펙트라 무료 버전과 함께 쓰는데요. 다음과 같은 방법으로 카테고리마다 다른 디자인으로 보여주는 방안을 실천해봐야 합니다. 이는 archive.php를 고치는 방법과 다르게 페이지를 생성해서 각각 다른 카테고리를 연결하게 만들어 보여주는 방법입니다.

우선 아스트라 프로가 프로 라이선스로 활성화된 상태에서 스펙트라를 설치하고 페이지 메뉴에서 페이지를 생성하면 됩니다.

(1) 페이지를 각각 만들어 각각 다른 카테고리 표시하도록 설정 (위젯 이용)
(2) 네비게이션 메뉴에 페이지 URL을 링크

이렇게 해두면 카테고리마다 다른 페이지 디자인으로 보여주는게 WYSIWYG 방식으로 지정이 됩니다. (1) 페이지 제작을 할때 페이지 디자인을 달리 해서 저장하면 되죠. 각각의 페이지마다 각각 다른 카테고리를 연결하구요.

여기에

(3) 글 목록 표시시 오프셋 설정이 가능하다면 컬럼으로 나누어 글 제목표시가 가능

인데 (3) 오프셋 설정은 지원되는지 살펴봐야하네요.

이해 잘 되게 해설한지는 모르지만 핵심은 archive.php에 의존하기보다 페이지를 써서 페이지를 각각 만들고 위젯으로 개별 카테고리 글 목록을 표시되게 하면 카테고리마다 다른 디자인으로 보여주는게 된다는 것이네요.

아이디어로 올려봅니다.

(2)를 할때는

<a href=”https://examples.com/category/카테고리명”>카테고리명</a>

보다

으로 링크를 하드코딩하거나 디자인 메뉴의 하위 메뉴에서 메뉴 설정을 해서 링크가 걸리게 하면 됩니다.

Flex Posts 플러그인 사용시 발췌문 길이 조정도 안되고 아주 길게 표시될때 해결법

댓글 남기기

Flex Posts 플러그인은 사이드바에 위젯으로 등록해서 랜덤 포스트, 최신글 표시 등을 담당하는 플러그인입니다.

모종의 이유로 발췌문 표시 조절이 안되고 아주 길게 표시될때 해결법은요.

여러 연쇄적인 실행이 있을테니 이 글에서 말한 것과 다른 원인일 수 있으나, 일단 아래와 같은 플러그인 파일을 들여다보세요.

Flex Posts 디렉토리 아래 template-tags.php

이 파일에서 flex_posts_excerpt() 함수가 직접적으로 발췌문을 표시하는 코드입니다.

제 경우 이 파일과 이 파일 위에 기재된 함수를 고쳐서 해결했는데요.


function flex_posts_get_excerpt_length() {
    if ( ! empty( $instance['excerpt_length'] ) ) {
        return $excerpt_length = absint( $instance['excerpt_length'] );
    }
    return 15;
}

function flex_posts_get_excerpt_length() {

if ( ! empty( $instance['excerpt_length'] ) ) {

return $excerpt_length = absint( $instance['excerpt_length'] );

}

return 15;

}

를 추가하고

flex_posts_excerpt() 함수를 아래와 같이 대체했습니다.


if ( ! function_exists( 'flex_posts_excerpt' ) ) {
    function flex_posts_excerpt() {
        $output = get_the_excerpt();
        $output = wp_trim_words($output, flex_posts_get_excerpt_length());
        echo $output;
    }
}

if ( ! function_exists( 'flex_posts_excerpt' ) ) {

function flex_posts_excerpt() {

$output = get_the_excerpt();

$output = wp_trim_words($output, flex_posts_get_excerpt_length());

echo $output;

}

이렇게 해두니 다시 잘 작동합니다.

get_the_excerpt()와 wp_trim_words()로 발췌문 길이 조정하기

댓글 남기기

발췌문은 플러그인과 같은 추가된 프로그램에서 조정하기도 하지만, 워드프레스 코어에서 제공하는 함수로 조정할 수도 있습니다.

우선 get_the_excerpt()로 발췌문을 가져오는게 가능하구요. 가져온 발췌문을 wp_trim_words()로 잘라내서 잘라진 발췌문을 표시하도록 코딩하면 됩니다.

아래와 같은 코드가 참고가 될 것입니다.


$length= 15;
$output = get_the_excerpt();
$output = wp_trim_words($output, $length);
echo $output;

$length= 15;

$output = get_the_excerpt();

$output = wp_trim_words($output, $length);

echo $output;

이 경우는

get_the_excerpt() 함수로 현재 처리되고 있는 글의 발췌문을 가져와서
wp_trim_words() 함수로 잘라내고 이를 echo()로 표시하는 코드입니다.

get_the_excerpt()의 잘라내는 기본값은 55글자구요. 위 코드를 쓰면 이를 15로 조정해서 처리할 수 있게 됩니다.

이를 응용해서


function our_excerpt_embed() {
    $output = get_the_excerpt();
    $output = wp_trim_words($output);
    return $output;
}
add_filter( 'the_excerpt_embed', 'our_excerpt_embed' );

function our_excerpt_embed() {

$output = get_the_excerpt();

$output = wp_trim_words($output);

return $output;

}

add_filter( 'the_excerpt_embed', 'our_excerpt_embed' );

처럼 테마 functions.php 파일에 기재해두면 워드프레스 코어의 포스트 임베드 위젯을 쓸때 표시되는 발췌문의 길이를 55로 제한해서 표시하는게 됩니다.

플러그인 위젯으로 발췌문을 표시하는 기능을 쓸때도 이 함수들을 잘 쓰면 좋습니다. 플러그인에서 자체적으로 구현하지 않았다면요. 자체적으로 구현한 코드가 버전이 오래된 등의 이유로 잘 작동하지 않을때도 위의 두 함수를 잘 활용하면 대체가 됩니다. 모종의 이유로 변조된 경우에도 해당됩니다.

웹브라우저 관련 유저 에이전트를 PHP를 써서 확인하고 기능 실행하기

1 댓글

wpcode 관련해서 PHP 코드를 포함시켜도 되는 조건에서 오류가 나기도 하는데요. 이 경우 wpcode 실행시 문제지만 코드 상에서 문제를 찾아야 할때 참고가 되시는 함수가 있네요.

$_SERVER 변수는 기정의 변수로 서버 환경에서 감지된 정보가 저장되어 있는 변수인데요. 저도 $_SERVER[‘HTTP_USER_AGENT’]와 같은 키로 테스트해봤는데 이 키로는 원하는 정보가 안나옵니다.

PHP에서 get_browser() 함수를 쓰는 방안이 있는데요. browscap.ini를 잘 설정하고 쓰면 웹브라우저 유저 에이전트를 알아낼때 필요한 정보가 배열 변수로 반환되어 쓰면 되네요.

https://www.php.net/manual/en/function.get-browser

를 참조하시길요. 함수에 넘기는 인자와 반환된 변수의 값도 나오고 browscap.ini를 설정하는 방법이 나온 링크도 나옵니다.

함수 리턴값으로 아래처럼 되었다면


return preg_match("패턴", $_SERVER['HTTP_USER_AGENT']);

return preg_match("패턴", $_SERVER['HTTP_USER_AGENT']);

browscap.ini 를 잘 설정하고 php.ini 에 경로를 기입후 웹서버를 재기동하고,


$agent = get_browser(null, true);
return preg_match( ... $agent['browser_name_pattern'] ...);

$agent = get_browser(null, true);

return preg_match( ... $agent['browser_name_pattern'] ...);

이런식으로 해두면 작동할 것 같습니다. 배열 변수 키는 위 링크에 나오니 참고하시길요.

아스트라 프로 4.7.0에서 검색결과 500 오류 해결

2 댓글

아스트라 프로 4.7.0으로 클라우드웨이즈에서 어플리케이션 추가를 했습니다. 검색결과를 테스트해보니 500 오류가 나서 아래와 같이 조치했습니다.

(1) wp-config.php 에 define(‘WP_DEBUG’, true); 추가후 관찰
(2) Fatal error: Uncaught ArgumentCountError: 3 arguments are required, 2 given in /var/www/html/wp-content/themes/astra/inc/core/common-functions.php:966 오류 발생
(3) 해당 파일을 테마 편집기로 열어서 보니 $title 변수에 add_filter()가 걸려있고 인자가 두개 관찰
(4) 그래도 작동해야 하지만, 세번째, 네번째 인자를 줘도 같은 오류라 다 966라인을 다 지우고
(5) 그다음 라인 어딘가의 echo $title; 구문을 지우고 $title = “검색 결과: <span>” . the_search_query() . “</span>”; 추가후 재실험
(6) 잘 작동함.
(7) wp-config.php에 define(‘WP_DEBUG’, false); 로 되돌림.

어떤 이유인지는 불명확하지만 이전 버전으로 돌아가는 다른 어플리케이션에서는 잘 되는 검색 기능이 최신 버전으로 새로 만든 어플리케이션에서 안되서 워드프래스 재설치, 플러그인 재설치, 테마 재설치를 해도 안되었습니다. 위와 같이 조치하니 되었네요.

위에 add_filter()는 아스트라 설정에서 제목을 읽어와서 표시할때 필요한 기능인데, 이 기능을 안쓰고 그냥 $title 변수를 하드코딩해서 해결했습니다.

일단 같은 문제가 있다면 참고해보세요. 아스트라 프로에서 구성한 사이트에서 검색기능 실행시 500 오류가 나면 해볼만한 사례입니다.

슬러그 보정 플러그인에 긴급추가할 기능

댓글 남기기

이제 셀 정렬 기능과 업데이트 확인 기능만 추가하면 끝날 것 같았는데요.

회원분께서 보고해주신 현상 중에 슬러그가 달라져서 영구주소가 변경되면 301 리디렉션을 반드시 해야 되는 것이 유의되네요.

제 플러그인의 기본 제작 방침은 슬러그 변조시 복호화 가능, 불가능 여부에 따라 400 오류나 404 오류가 나는 것을 보정하기 위함인데요. 이게 그냥 고치게 하면 SEO에 문제가 옵니다. 301 리디렉션을 반드시 구현하거나, 조치를 해서 400 오류나 404 오류난 경우를 감지해서 고치게 해야 하네요.

플러그인에 공지를 해서 400 오류나 404 오류가 아니면 하지 말라고 하는 방안도 있구요.
REST API 등으로 가능하면 헤더를 조사해서 400나 404가 반환되어야 슬러그 보정기능을 하게 한다든지요.

이 두가지 경우가 다 가능한 선택지인데 이 경우들에서도 구글에 색인된 정보를 알아내서 301 리디렉션을 자동으로 추가하는 기능이 필요해보이네요.

각각의 기능이 중첩되는 양태에 의해서는 사용상에 혼동이 있을 수 있어서 SEO가 안좋게 되면 큰일입니다.

그래서 출시를 밀어두고 있구요. 제 블로그에서 쓸 용도로만 해보려고 하기도 합니다.

출시할 플러그인은 이번 개발 끝내고 착수할 파워토이즈 개념의 플러그인으로 할까도 생각중이네요 ㅎㅎ SEO와 상관없는 기능을 구현할 플러그인이라 출시가 가능합니다.

여튼 슬러그 보정 기능 실행시 조건화해두어야 할 사안입니다. 301 리디렉션을 해야 한다는 것.

아스트라 프로 사용기

댓글 남기기

전에도 흡사한 글을 썼었는데 오늘도 또 써보겠습니다.

아스트라 프로가 클라우드웨이즈 사용자에게 무제한 사이트 첫해 무료, 다음해부터 매달 4불씩 내면 애드온으로 간편하고 저렴하게 이용이 가능합니다. 스펙트라나 엘리멘터 프로, 비버 빌더와 연동할 수 있구요. 클라우드웨이즈에서 제공하는 아스트라 프로는 아스트라 자체는 프로 버전인데, 다른 부속 플러그인은 따로 사야합니다. 전 스펙트라를 무료버전으로 해서 연동해서 쓰는데 무료버전이더라도 매우 쓸만하네요. 구텐베르크 에디터에서 위젯처럼 목록에 나오게 해서 쓰는 스펙트라 위젯이 있습니다.

엘리멘터 프로보다 제 생각에는 더 디자인이 잘 먹네요. 위젯들도 규칙적으로 메뉴 구성이 되어있구요. 엘리멘터 프로보다 세팅 항목이 많지 않더라도 컨테이너도 잘 먹히구요. 제가 엘리멘터 프로 쓸때보다 더 조작감도 편한 기분이 듭니다. 스펙트라 무료 버전으로 쓰고 있고 위젯은 워드프레스 위젯도 공유해서 씁니다.

대신 기본제공 테마 종류를 더 많이 쓰려면 유료로 써야 하는데 전 필요가 없는 것 같애요. 기본제공되는 것만으로도 제작이 되구요. 아예 다 지우고 새롭게 만드는 것도 기본제공 테마를 가지고도 되네요.

대충 작업순서를 정리해둡니다.

(1) 클라우드웨이즈 로그인
(2) 애드온 목록에서 Astra Pro 활성화
(3) 어플리케이션 추가할때 목록에서 Astra Pro 선택
(4) 설치가 완료되면 워드프레스 로그인
(5) 라이선스키 입력 ( https://wpastra.com 에서 로그인하면 나옴 )
(6) 아스트라 프로 대시보드에서 스펙트라 설치
(7) 워드프레스의 페이지 메뉴로 페이지 추가
(8) 그외 블로그 모드 레이아웃도 적절히 편집
(9) 게시

기억에 의존해서 (6)을 확인해봐야 하는데 그냥 씁니다. 핵심은 모든게 다 잘 설치되어 있으면 그 기반에서 워드프레스 페이지 메뉴로 새 페이지 추가해서 위젯 추가 방식으로 작업하면 된다는 것이구요. 이렇게 페이지를 만들고 대문에 표시하도록 설정해서 쓰면 된다는 것이네요.

한가지 문제가 있던 것은 Post Grid로 랜덤하게 표시 설정을 하면 Varnish 캐시를 안껐을때 제대로 동작을 안하던데요. 제 서버에서만 그런지는 미확인입니다. PC 문제일수도 있구요. 둘다 일수도 있네요. Varnish 캐시를 끄면 방문자가 많은 서버일때 속도가 느려질 수도 있는데 하루 100인 정도 오는 사이트라면 그냥 꺼두셔도 될듯하네요.

특기할만한 사실은 REST API를 보안상 꺼둔 경우, 아스트라 프로 세부 설정 UI가 안뜨고 무한딜레이가 됩니다. 라이선스키 입력도 그렇구요. 아스트라 프로 제작사에서도 확인해준 문제로 아스트라 프로 쓰시려면 REST API를 켜두어야 합니다. 꺼두는 플러그인에 따라서는 관리자 모드에서만 켜두는 기능이 있는게 있는데 전 안통해서 그냥 켜두고 쓰네요.

여튼 이렇게 해봤구요. 더 써보고 알게 된게 있으면 공유해보겠습니다. 클라우드웨이즈 쓰신다면 아스트라 프로 애드온을 써보시길 강력 추천합니다.

CSS가 안통할때 대처법 정리

댓글 남기기

보통 HTML 상태를 CSS가 잘 받아 처리한다면 잘 통합니다. 몇가지 규칙만 잘 지켜주면 되죠. 잘 작동할 것 같은 경우에도 잘 작동을 안할때도 있는데 이 경우 난감하기도 합니다. 이런 경우 몇가지 대처법을 정리해봅니다.

(1) 태그들의 겹쳐진 구조가 잘 반영되어 있는가?

아래와 같은 HTML 이면 아래와 같은 CSS로 되어 있어야 작동합니다.

이 경우

.entry-content p { font-size: 12px; }

이라고 순서를 지켜서 CSS 코드를 짜야합니다.

처럼 선택자가 세개라면 맨마지막에 온 선택자에 온 속성이 적용됩니다.

하나의 CSS 파일에 아래와 같은 순서로 위 HTML을 제어하면요.

.entry-compose { font-size: 12px; // class에 두번째 기재된 속성이지만 효력 상실 }
.entry-content { font-size: 15px; // 세번째에 온 속성이지만 효력 상실 }
.entry-outer { font-size: 18px; // 최종적으로 효력 획득 }

이 경우 폰트 크기는 18px이 될 것입니다.

물론 한 태그에 온 각각의 선택자 CSS 명세에 다른 선택자가 지정하지 않은 속성이 오면 그 속성은 적용됩니다.

.entry-compose { font-size: 12px; font-height: 160%; }
.entry-content { font-size: 15px; }
.entry-outer { font-size: 18px; }

로 되어 있다면 선택자 순서에 상관없이 font-height: 160%가 적용되죠.

(2) 단위가 잘 지정되어 있는가?

px이나 pt 말고도 rem이나 em 등의 단위로 길이나 크기 지정이 됩니다. em이나 rem의 경우 특히 상위 코드에서 온 값에 토대로 작동해서, 다른 테마에서는 제대로 되는 수치가 그대로 적용이 안되기도 합니다. 이 경우 px이나 pt 등으로 바꿔 적용해볼 수 있습니다.

rem은 HTML 태그에서 em은 상위 코드에 토대를 두고 조정됩니다. px이나 pt는 상위 코드에 독립적으로 조정됩니다. 화면 크기와 DPI같은 속성에도 영향을 받지만, 대개 px나 pt로 지정하면 rem이나 em으로 할때보다 숫자에 비례하는 수치가 잘 적용될 것입니다.

(3) HTML 태그가 지원하는 속성인가?

div 인 경우 display 속성이 inline-block 이어야 일렬로 되고

li 인 경우 display 속성이 inline 이어야 일렬로 됩니다.

예외인 경우도 있으나 HTML 태그에 따라 올 수 있는 CSS 속성값이 정해진대로 해야 합니다. 이 경우 CSS 해설을 찾아보고 대처하면됩니다.

(4) CSS 해석기에게 직접 문제없다고 알려야 하는 경우

문법도 잘못없고 꼭 맞는데 안되면 !important 라고 기재하면 되기도 합니다. 아래처럼 하세요.

.entry-content p { font-size: 12px !important; }

(5) 워드프레스에서 지정한 추가 CSS 의 최종 효력 문제

워드프레스에서는 외모 → 사용자 정의하기 → 추가 CSS 에 기재한 CSS 코드가 최종적으로 적용되는 것 같습니다. 그래서 CSS를 파일이나 타메뉴로 고칠때 적용이 안되면 추가 CSS 메뉴에 적용한 내용을 검토하면 될때가 있습니다.

가독성이 있는 해설인지요? 일단 이렇게 정리해둡니다.

이 외에도 오타가 난 부분이 화면에서 밀려나 있어서인 경우도 있구요. class로 온 선택자와 id로 온 선택자를 실수로 잘 못 기재해서일 수도 있습니다. class 선택자는 온점(.) 으로 시작하게 CSS 작성을 해야 하구요. id는 #으로 시작합니다.

.entry-content { font-size: 12pt; }
#entry-content { font-size: 12pt; }

또 한가지 정보를 드리자면요. 아래와 같은 능력도 기르면 좋습니다.

<center><div class=”box”>글자입니다</div></center>

라고 되어 있을때 div 태그 내에 있는 컨텐츠가 중앙으로 정렬되는 경우가 있는데 이 경우 아래처럼 CSS를 구성합니다.

.box { text-align: left !important; }

이런 보완법을 생각하는 능력이 CSS를 통하게 하는 용도도 되구요.

.box { width: 700px; margin: auto; }

로 하고 HTML코드에서

를 삭제하는 등의 방법도 가능합니다. 특히 이 후자의 예는 가운데 정렬을 컨테이너에 할때 잘 통합니다. (다른 코드가 저해하지 않을 때)

그리고 추가로 PC 상태나 서버 상태에 따라 바꾼 CSS가 작동하지 않을때도 있습니다. 이 경우 서버 캐시를 지우시고 웹브라우저 임시파일도 지우시고 페이지를 새로고침 버튼을 눌러 다시 불러오시면 반영이 될 것입니다. 다른 문제가 아니라면요.

코드 암기시 그냥 외어야 할 것과 서술적으로 외어야 할 것의 차이에 대한 해설

3 댓글

워드프레스도 테마 제작을 할때나 플러그인 제작을 할때, 워드프레스 코어를 바꿔야 할때 PHP나 자바스크립트, JSON 등의 지식이 필요합니다. 이 경우에 대면하면 비전공이신 경우 기호적인 것을 접하면 압도되기도 합니다. 이런 경우 압도되지 마시고 임하시면 되는데요. 보통 암기한다고 하는 기능을 잘 분별하는게 노하우인데, 많은 경우 기술자분들이 이를 잘 짚어주실 것 같아도 글의 구심점이나 여러 조건에 의해 잘 설명이 안되기도 해서 맞춤해설이 아니게 되어 불만도 있는데요. 기술자분들의 잘못이 일차적인 것은 아니구요. 철학적으로 통용되는 개념에 의해 말씀드려보겠습니다. (현상적으로 외어야 하나 서술적으로 외어야 하나의 구별법)

프로그래밍 언어의 구성 요소를 우선 봅시다. 보통 코드들은 아래와 같은 구조를 프로그래밍 언어마다 공유합니다.


함수명(매개변수) {
    함수 코드 /* 주석 */
}

함수명(매개변수) {

함수 코드 /* 주석 */

}

이 틀인데요. 이 경우에 암기를 해야 한다면 현상적으로 외어야 하는 부분과 서술적으로 외어야 하는 부분이 갈립니다. 주석의 경우 그자체로 이해가 되니 현상적으로 외우면 되구요. 함수명이나 매개변수, 함수코드들은 서술적(서술지식)으로 외어야 할 부분입니다.

이 말의 의미가 무엇이냐면요. 눈으로 봤을때 즉시 이해가 되는 부분은 현상적으로 그 형태를 통채로 외워서 이후에 조금씩 변형을 가하는 정도로만 외어도 좋은 것이 현상적으로 외우라는 것이구요. 서술적으로 외어야 할 것은 인지과학에서도 말하는 서술지식으로 외어야 한다는 것입니다. 즉 구문의 의미를 일단 서술화해서 시각화하고 이를 외우라는 것입니다.

PHP의 for 루프문의 예를 들면요.


for ($i = 0; $i < sizeof($var); $i++) {
    $i = $i + 1; /* 0부터 $var의 크기에 도달할때까지 1을 더함 */
}

for ($i = 0; $i < sizeof($var); $i++) {

$i = $i + 1; /* 0부터 $var의 크기에 도달할때까지 1을 더함 */

}

이 코드에서 현상적으로 암기할 것은 주석이구요. 그외 부분은 서술적으로 암기해야 합니다.

서술적으로 암기한다는 것은 문법적으로 정의된 것을 잘 세분화해서 말로 표현해보고 외우라는 것인데요. for 루프는 일단 for 구문 다음에 오는 조건들의 의미를 파악해서 서술해두고 외우면 됩니다.

$i = 0는 $i 변수를 0으로 초기화한다는 의미
$i < sizeof($var)는 $var의 크기보다 $i가 작은 동안 루프를 돌라는 의미
$i++는 $i를 1씩 증가시킨다는 의미

이렇게 표현해두고 암기하시라는 것이네요.

그리고나서 현상적으로 외웠든 서술적으로 외웠든 응용할때 조금씩 변경해보기도 하고 조합해보는 것을 터득하면 됩니다.

이 요령을 실재로 하나라도 체현하면 체현 확장이 되서 빠르게 판단이 될 것입니다.

해설이 짧아도 이해가 되시죠? 그렇다면 워드프레스도 쉽게 배우는 전거가 될 것입니다.

IT와 전인적 사고

공학인으로의 여정

태그 보관물: 웹프로그래밍

워드프레스에서 문자열에 어귀마다 하이픈을 추가하기

아스트라 프로에서 카테고리별로 다른 디자인 보여주는 방법 아이디어

Flex Posts 플러그인 사용시 발췌문 길이 조정도 안되고 아주 길게 표시될때 해결법

get_the_excerpt()와 wp_trim_words()로 발췌문 길이 조정하기

웹브라우저 관련 유저 에이전트를 PHP를 써서 확인하고 기능 실행하기

아스트라 프로 4.7.0에서 검색결과 500 오류 해결

슬러그 보정 플러그인에 긴급추가할 기능

아스트라 프로 사용기

CSS가 안통할때 대처법 정리

코드 암기시 그냥 외어야 할 것과 서술적으로 외어야 할 것의 차이에 대한 해설