워드프레스 특성 이미지 (Featured Image) 설정

반응형


워드프레스에서는 포스트마다 특성 이미지(Featured Image)를 설정할 수 있습니다. 글을 대표할만한 이미지를 특성 이미지로 설정합니다. 특성 이미지는 테마나 플러그인에서 여러 가지 방식으로 활용합니다.

 

글 목록에서 썸네일로 사용하기도 하고, 글 제목의 배경으로 사용하기도 합니다. 특성 이미지가 없을 때 이미지를 출력하지 않는 것도 있고, 포스트의 첫 번째 이미지를 출력하는 것도 있습니다. 특별한 경우가 아니라면, 모든 포스트에 대표할만한 적절한 이미지를 특성 이미지로 등록해두는 것이 좋습니다.

 

저는 워드프레스에서 제공하는 Accelerate 테마를 가지고 기능적인 사용법 위주로 설명하겠습니다.


특성 이미지 (Featured Image) 설정

 

Home 페이지에 대표 페이지들의 썸네일 이미지와 요약을 보여줄 수 있습니다. 홈페이지에서 슬라이더 바로 아래에 기존에 만들었던 페이지들의 특성 이미지(Featured Image)를 설정하고, 그 아래에 요약 글을 넣어서 삼단 컬럼으로 배치해 보겠습니다.

 

페이지에 특성 이미지를 추가하기 위해 '페이지 < 모든 페이지'로 들어가서 About 페이지의 '편집'을 클릭합니다.

 

특성 이미지를 설정하기 위해서 페이지 편집 우측 하단에 보면 특성 이미지가 있는데 '특성 이미지 설정'을 누릅니다.

 

'파일 업로드' 탭을 선택해서 '파일을 선택하세요' 버튼을 누릅니다. 지금 이미지 사이즈는 같은 크기로 보이게 하도록 모두 350*200px 로 동일하게 맞추어 놓은 상태입니다. 내 컴퓨터에 있는 이미지를 업로드해서 '특성 이미지 설정' 버튼을 눌러서 특성 이미지가 설정되었으면 업데이트해 줍니다.

 

다른 페이지 'review', 'contact' 페이지들도 위와 같은 방식으로 특성 이미지 설정을 하고 업데이트해 줍니다. 다음은 특성 이미지를 설정한 세개의 페이지를  Home 페이지에 배치하기 위해서 위젯을 사용하겠습니다.

 

이제 Home 페이지에서 슬라이더 밑에 세개의 특성 이미지를 배치해 보도록 하겠습니다.

 

'외모 < 위젯'으로 들어갑니다. 위젯 페이지에 보면, Business Sidebar 위젯 우측 끝에 역삼각형 아이콘을 누르면 펼쳐집니다. 여기에다가 TG: Image Services 이것을 드래그해서 Business Sidebar에 옮겨놓고 페이지를 선택해 줍니다.

 

About, Review, Contact 이렇게 개의 페이지를 선택을 하고 저장하기를 눌러줍니다.

 

제대로 되었는지 확인하기 위해서 사이트 보기를 클릭해 봅니다. 슬라이더 밑에 개의 특성 이미지들과 요약 글들이 배치되어 있는 보입니다. 여기서 페이지들의 요약 글을 수정할 있습니다.

 

다시 관리자 화면으로 가서, '페이지 < 모든 페이지' 들어가서 About 페이지의 편집을 클릭해 줍니다. 페이지 상단에 '화면 옵션' 클릭해서 펼쳐보면 요약이라는 체크상자가 보이는데 부분을 체크해 주고 펼쳐진 화면 옵션을 닫습니다.

 

페이지 하단에 가서 보면 요약 입력창이 나타나 있는 것을 볼 수 있습니다. 여기다가 내용을 입력하고 업데이트해 줍니다. 나머지 페이지들도 이렇게 내용을 입력해 주고 업데이트해 줍니다.

 

사이트에서 새로 고침 보면 이렇게 수정된 요약 글이 배치되어 있는 것을 확인할 있습니다.

 

지금까지 워드프레스 Accelerate 테마를 가지고 Home 페이지에서 특성 이미지(Featured Image) 요약 글을 설정해 보았습니다.



반응형

이 글을 공유하기

댓글

Designed by JB FACTORY