WeatherSlider WP 플러그인 이용한 날씨정보 삽입하기

WeatherSlider WP 플러그인 이용한 날씨정보 삽입하기

코드캐뇬이나 다른 마켓플레이스에서 유료로 구매한 플러그인을 살펴보면 플러그인 이외의 여러 가지 파일 및 디렉토리가 있습니다. 이 중 어떤 것이 플러그인이며 워드프레스에 어떻게 적용하는지 앞 장 코드캐뇬마스터에서 구매한 WeatherSlider WP 플러그인으로 알아보겠습니다.

1. 유료 플러그인 압축 파일 구조 확인
유료 플러그인은 압축 파일을 그대로 워드프레스에 올리면 플러그인 추가가 되지 않습니다.
codecanyon-1250593-weatherslider-wp-jquery-anim-wordpress-widget.zip 파일을 압축 프로그램을 이용해서 열어보면 3개의 디렉토리와 zip 파일이 있습니다.

WeatherSlider1
<codecanyon-1250593-weatherslider-wp-jquery-anim-wordpress-widget.zip 화면>

codecanyon-1250593-weatherslider-wp-jquery-anim-wordpress-widget.zip 파일의 압축을 풉니다

  • 디렉토리 : __MACOSX , assets, documentation, WeatherSlider 2.0 (non-wordpress, standalone version)
  • 압축파일 : WeatherSlider-WP-2.0.0-installable.zip(플러그인)

 

WeatherSlider2
<codecanyon-1250593-weatherslider-wp-jquery-anim-wordpress-widget 디렉토리 화면>

WeatherSlider-WP-2.0.0-installable.zip 파일을 반디집으로 다시 열어보면 WeatherSlider 디렉토리안에 플러그인과 관련된 php파일, css, js 디렉토리 등이 있습니다.

WeatherSlider3
<2-3-02-003 WeatherSlider-WP-2.0.0-installable.zip 화면>

WeatherSlider-WP-2.0.0-installable.zip 파일의 압축을 풉니다

WeatherSlider4
<WeatherSlider-WP-2.0.0-installable 디렉토리 화면>

2. FTP 업로드
압축을 다 풀어서 플러그인과 관련된 디렉토리(WeatherSlider)를 FTP 업로드합니다.
업로드될 WeatherSlider 플러그인은 워드프레스 플러그인들이 있는 /www/wp-content/plugins 디렉토리입니다.

WeatherSlider5<2-3-02-006 플러그인이 업로드될 디렉토리 화면>

3.  플러그인 활성화 및 사용방법
WeatherSlider WP 플러그인이 등록되었습니다. 이제 활성화(Activate) 링크를 클릭합니다.
WeatherSlider WP 플러그인을 활성화 시키면 왼쪽 메뉴목록에 WeatherSliderWP 메뉴가 추가됩니다.
또, WeatherSlider WP를 사용하기 위해선 Online API key를 등록해야 한다는 안내문이 나타납니다.

WeatherSlider6
<WeatherSlider WP 플러그인 활성화 화면>

설정 화면에는 Your sliders, Global Settings, Language Setting, Save changes4가지 영역으로 구분됩니다.

(1) Your sliders : WeatherSlider 를 설정합니다.
(2) Global Settings : WWO(World Weather Online) 사이트에서 API Key를 발급하여 설정합니다.
(3) Language Setting : qTranslate 플러그인을 추가하여 WeatherSlider WP 번역 설정합니다.

 

WeatherSlider7
<WeatherSlider WP 플러그인 설정 화면>

위 화면 상단의Add New 버튼을 클릭하여 새로운 WeatherSlider 를 등록합니다.

새로운 WeatherSlider의 설정화면입니다.
슬라이더 레이아웃, 위치(지역)설정 정보, 날씨/시간 설정, 애니메이션 설정 등 날씨 관련 정보를 쉽게 설정할 수 있습니다.

WeatherSlider8<WeatherSlider 등록 화면>

WeatherSlider WP 메뉴에서 API Key 정보를 입력해야 날씨정보가 표시됩니다.
API Key는 WWO 사이트에서 무료로 발급받을 수 있습니다.

WeatherSlider9
<WeatherSlider WP 설정 WWO API Key 설정 화면>

4. WWO(World Weather Online) 사이트 API Key 받기
API Key 발급 URL : http://www.worldweatheronline.com/register.aspx

WeatherSlider10
<API Key 발급 폼 화면>

제대로 구현되었는지 확인하기 위해 다시 사이트 홈화면으로 이동하여 WeatherSlider Widget의 날씨정보가 제대로 나오는지 확인합니다.

WeatherSlider11
<날씨정보 확인>

사이트의 우측에 오늘의 날씨정보와 구름이미지가 보이는 것을 확인할 수 있습니다.

Share the Post

About the Author

Comments

No comment yet.


Warning: strpos() expects parameter 1 to be string, array given in /free/home/topshock/html/wp-includes/shortcodes.php on line 190

Warning: preg_match() expects parameter 2 to be string, array given in /free/home/topshock/html/wp-includes/shortcodes.php on line 201
Leave a Reply

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다.

장바구니

  • 장바구니에 상품이 없습니다.

로그인