4. Wordpress 시작하기 - 플러그인

두번째로 중요한 매뉴는 플러그인입니다.

플러그인이란 여러가지 다른 사람이 이미 만들어 놓은 기능을 쉽게 설치하여 바로 적용할 수 있는 것들입니다.

예를들면, 게시판을 붙인다거나 소셜 기능을 붙인다거나 하는 등의 다양한 기능을 쉽게 가져다가 사용할 수 있습니다.

왼쪽 매뉴에서 플러그인을 클릭하면 해당 화면으로 이동합니다.

여기서는 설치되어 있는 플러그인 목록들을 볼 수 있고 활성화나 비활성화할 수 있습니다.

상단에 있는 플러그인 추가하기 혹은 왼쪽 매뉴에 있는 플러그인 추가하기를 누루면 아래와 같이 새로운 플러그인 목록을 볼 수 있습니다. 여기서 인기 있는 것들이나 직접 이름으로 검색해서 원하는 플러그인을 찾을 수 있습니다.

검색어를 'page builder siteorigin'이라고 입력하여 페이지를 작성하는데 유용한 플러그인을 설치합니다.

설치가 되었으면 활성화도 시켜줍니다.

그다음으로 검색어에 'siteorigin widget bundle'로 검색해서 해당 플러그인을 설치 및 활성화 시켜줍니다.

이 번들은 사용할 수 있는 위젯을 다양하게 제공해줍니다.

설치와 활성화가 완료되면 왼쪽 매뉴에 SiteOrigin Widgets 항목이 추가가 됩니다.

이 매뉴로 이동하면 아래와 같이 다양한 위젯들을 활성화 시켜서 사용할 수 있습니다.

그리고 왼쪽 매뉴에 편집기로 이동을 하면 플러그인의 소스를 볼 수 있습니다.

여기서는 플러그인을 우리가 수정할 일은 많치 않으니 그냥 구경만 하고 넘어가도 좋습니다.

이제 설치된 플러그인을 이용해서 새로운 페이지를 하나 만들어 보도록 하겠습니다.

왼쪽 매뉴에서 페이지 - 새 페이지 추가로 이동을 하면 아래와 같이 신규 페이지를 만들수 있는 화면이 나옵니다.

기본적으로는 텍스트 형태의 입력창이 나오는데 옆에 탭에 보시면 우리가 설치했던 플러그인인 Page Builder가 보입니다.

Page Builder 탭을 선택하면 아래와 같이 페이지를 구성할 수 있는 화면으로 변경이 됩니다.

기본적인 사용 방법은 우선 row를 먼저 만들고 그 row에 원하는 widget을 추가하는 방식으로 원하는 페이지를 쉽게 구성할 수 있습니다.

row 버튼을 클릭하면 아래와 같이 한줄에 몇개의 columns를 생성할 것인지 layout을 구성할 수 있는 화면이 나타납니다.

50대 50의 비율로 두개의 layout으로 생성을 해보겠습니다. 선택이 완료되었으면 아래의 insert 버튼을 눌러 추가합니다.

자 그러면 2개의 항목으로 구성된 1개의 row가 아래와 같이 생성이 되었습니다.

왼쪽의 layout을 선택하면 색상이 바뀌면서 선택이 됩니다.

선택한 layout에 위젯을 배치하기 위해서 Add Widget 버튼을 눌러보겠습니다.

여러가지 Widget 목록이 보여지고 여기서 SiteOrigin Image를 선택하여 이미지를 추가해보겠습니다.

선택된 image Widget이 왼쪽 layout에 추가가 된 모습니다.

추가된 Widget에 마우스를 올리면 오른쪽부분에 수정이나 삭제하는 매뉴가 나타나는데, 그냥 Widget을 마우스로 클릭해도 수정하는 화면이 팝업으로 뜨게 됩니다.

수정하는 팝업이 아래와 같이 보입니다.

이미지 파일을 선택 지정 할수도 있고 외부 URL을 통해서 불러올수도 있습니다.

그 아래로는 사이즈나 정렬이나 text 문구를 삽입하는 등의 다양한 기능을 제공하고 있습니다.

오른쪽에 Widget Styles에 있는 3가지 항목은 해당 Widget의 전체적인 속성이나 레이아웃, 디자인등을 지정할 수 있습니다. 특히 해당 Widget에 사용하고 싶은 css class나 style이 있다면 Attributes 항목을 열어서 추가하면 됩니다.

Choose Media를 클릭하여 이미지를 선택해서 지정해보겠습니다.

저는 이미 불러왔던 이미지들이 있어서 목록에 보여지는데, 만약 목록이 없다면 pc에 있는 이미지 파일을 새로 불러와서 추가할 수 있습니다. 원하는 이미지를 하나 선택하고 아래의 set Media 버튼을 눌러 지정합니다.

선택된 이미지가 보여집니다.

그외 설정들을 변경해보시고 완료가 되었으면 아래의 Done을 눌러서 저장하고 나갑니다.

왼쪽의 image 위젯 아래에 작은 글씨가 변경되면서 셋팅이 된 내용이 보여집니다.

오른쪽 위젯도 원하는 것으로 추가해보세요

양쪽다 위젯이 완료가 되었으면 오른쪽에 있는 '미리보기' 버튼을 누루면 생성된 페이지를 미리보기 할 수 있습니다.

미리보기는 아직 저장이 되지 않은 상태이기 때문에 다른 매뉴로 이동을 한다거나 나가게 되면 지금까지 설정했던 내용들이 사라지게 되니 주의해야 합니다.

모두 완료가 되어 이 페이지를 저장 및 실제 적용을 하기 위해서는 그 아래에 있는 '공개하기' 버튼을 클릭하면 됩니다. 클릭하는 순간 바로 해당 페이지가 적용이 되어 공개가 되므로 다른 사람들도 볼 수 있게 됩니다.

미리보기를 클릭하면 새로운 창이 뜨면서

우리가 구성한 페이지에 사진들이 이쁘게 layout에 맞춰서 보여지는 것을 확인할 수 있습니다.

이렇게 플러그인을 사용해서 여러 row와 layout으로 구성된 나만의 홈페이지를 쉽게 만들 수 있게 되었습니다.