워드프레스 2.7이상에서 작동하는 새로운 플러그인이 있습니다.

몇가지 오류를 수정하고 정신없는 내용들을 한번에 정리하고자 또다시 판올림 하게 되었습니다. 이전 글들과 중복되는 내용이긴 하지만 영문 설명글 등록과 더불어 한번은 해야 할 시기인듯 하여…

기본이 된 플러그인

• Simple Spoiler: http://waikay.net/2005/03/plugin-spoiler/
• 워드프레스나 PHP를 전혀 모르던 때 무작정 effects.js 효과를 적용해 보려고 만지작 거리기 시작했던 플러그인 입니다. Ajax-Spoiler플러그인 말고 단순히 Show/Hide기능을 이용하실 분들께서는 위 플러그인을 사용해 보세요.

설치하기

• 아래 링크된 파일(wp-aj-spoiler.zip)을 내려받아 압축을 풀면 생성되는 aj-spoiler 폴더를 wp-contnet/plugins 폴더에 업로드 합니다.
• aj-spoiler.php파일을 열어 상단의 설정 부분을 자신에 맞게 조정 한 뒤 다시 업로드 합니다.(아래 “설정하기” 참고)
• 관리자 화면(Admin) > 플러그인(Plugins) 화면에서 Ajax-Spoiler 를 활성화(Activate)시킵니다.
• 기본적인 설치가 끝났습니다.

설정하기

• $feed_visibility: (‘show‘ 또는 ‘hide‘) 피드 리더기에서 보여질 방법을 선택합니다. ‘show’를 선택했을 경우 모든 내용이 숨겨지지 않고 보여지지만, ‘hide’로 설정하면 내용이 숨겨지며 숨겨진 내용을 확인하려면 블로그를 방문해야만 합니다.

  

• $use_html_tagset: (true 또는 false)v0.7 이후로는 기본적으로 < spoiler >태그를 지원하지 않습니다.(계속 사용하려면 이 값을 true 로 설정하세요.
• $js_library: (‘mootools’ 또는 ‘prototype’) 라이브러리의 특징상 두가지를 동시에 사용 할 수 없습니다.
  • 따라서 기존에 플러그인이나 테마에서 prototype.js, effects.js를 이미 로딩하였다면 ‘prototype’ 으로 설정해서 사용하시기 바랍니다.
  • Wp-Scripts 플러그인 사용할때 ‘mootools’를 사용하려면 wp-scripts 설정 화면에서 Base(기본)을 ‘mootools’로 선택하고, 추가적으로 Fxpack.js, Fxutils.js, Fxtransitions.js를 선택해 주어야만 합니다.

    

  • Wp-Scripts 플러그인 사용할때 ‘prototype’를 사용하려면 wp-scripts 설정 화면에서 Base(기본)을 ‘prototype’로 선택하고, 추가적으로 effects.js를 선택해 주어야만 합니다.

    

• $default_effect: spoiler태그에서 효과를 지정하지 않을경우 기본적으로 사용할 효과를 선택 할 수 있습니다. 사용 할 수 있는 효과에는 'appear', 'blind', 'apblind', 'phase', 'slide', 'simple' 이 있습니다.

사용하기

• 기본적인 사용방법은 [spoiler][/spoiler]사이에 숨기고자 하는 내용을 넣는 겁니다.
• 추가적으로 ‘Show »’, ‘Hide »’ 문구나 효과(effect)를 다르게 하려면 각각의 설정값들을 넣어주면 됩니다.
• [spoiler '효과''보여주기문구''감추기문구'][/spoiler] 또는 [spoiler '보여주기문구''감추기문구'][/spoiler]
• [spoiler ‘appear”appear 이펙트 사용예”예제 숨기기’]스포일러 제목이 예제 숨기기 로 변합니다.
  다시 스포일러 링크를 클릭하시면 내용이 사라지면서 원래 제목으로 돌아갑니다.
  [spoiler ‘apblind”apblind 효과 사용예”예제 숨기기’]
  apblind 효과는 이렇게 작동합니다.

  

  [/spoiler][/spoiler]
  [spoiler ‘blind”blind 이펙트 사용예”예제 숨기기’]
  blind 효과는 이렇게 작동합니다.

  

  [spoiler ‘phase”phase 효과 사용예”예제 숨기기’]
  phase 효과는 이렇게 작동합니다.

  

  [/spoiler][/spoiler]
  [spoiler ‘slide”slide 효과 사용예”예제 숨기기’]
  slide 효과는 이렇게 작동합니다.

  

  [spoiler ‘simple”simple 효과 사용예”예제 숨기기’]
  phase 효과는 이렇게 작동합니다.

  

  [/spoiler][/spoiler]

• 위 예제 2번째의 입력값은 다음과 같습니다.

  
  [spoiler 'phase''phase 효과 사용예''예제 숨기기']
  phase 효과는 이렇게 작동합니다.
  [/spoiler]
  [/spoiler]

• 효과의 속도를 조절하려면 입력값의 마지막 부분에 3~9 사이의 숫자를 넣으면 됩니다.
  [spoiler 'blind''보여라''숨겨라''4'][/spoiler]
  숫자가 작을수록 속도가 빠릅니다.
• 위 예제와 같이 계층형으로 사용하실때는 태그가 알맞게 닫혀있는지를 꼭 확인하시기 바랍니다.
• 내용이 보여진 뒤에 감춰지지 않고, 처음부터 감춰지게 하려면 효과의 뒷부분에 ‘_hidden’을 붙여주시면 됩니다.
  [spoiler 'blind_hidden''보여라''숨겨라''4'][/spoiler]
  동영상과같이 로딩에 영향을 주는 내용 등에 적용하시면 유용할듯 합니다.

스타일 바꾸기

• plugins/aj-spoiler/css폴더 안의 aj-spoiler.css파일을 수정하시면 됩니다.
• a.spoiler-tgl, a:hover.spoiler-tgl, a.spoiler-tgl.collapsed는 spoiler링크 스타일이며, div.spoiler-body는 보여지는 내용의 스타일입니다.

Ajax-Spoiler를 응용한 효과 적용

• 적용 방법에는 두가지가 있습니다. 예전의 방법대로 onclick 부분을 직접 입력하는 방법이 있고, v0.7이후의 Ajax-Spoiler처럼 DOM을 이용해서 화면이 로딩된 이후에 숨겨지는 방법이 있습니다.
• 이전의 방법을 사용하려면 : http://082net.com/2006/535/effects-w-aj-spoiler/
  새로운 방법을 사용하려면 : http://082net.com/2006/753/effects-w-aj-spoiler-3/

이 플러그인과 관련된 정보들을 보시려면 이 링크를 확인해 보세요.

플러그인 판올림 이후에는 브라우저에서 새로고침을 하거나 캐쉬를 비우시는게 좋습니다. 이전 판(version)의 파일들이 캐쉬에 남아있어서 오류가 발생 할 수 있습니다.

추가::v0.9로 판올림했습니다. 변경된 파일은 js 폴더안의 두개의 자바스크립트 파일입니다.