Extra 테마 – 게시물 형식(Post Formats)

Extra 테마 – 게시물 형식(Post Formats)

Extra 모든 주요 포스트 형식을 지원합니다

블로그 게시물을 작성할 때 표준, 비디오, 오디오, 인용문, 갤러리, 링크 및 지도와 같은 7가지 게시물 형식 중 하나를 게시물에 적용할 수 있습니다. 이러한 각 형식은 게시물을 다르게 구성하여 형식이 나타내는 콘텐츠 유형에 더 중점을 둡니다.

docs image
게시물 형식 예시

블로그 게시물을 작성하면 텍스트 편집기 오른쪽에 “체제(형식)” 이라는 상자가 표시됩니다. 이 상자에는 7가지 형식 옵션이 있습니다. “표준”을 선택하면 일반적인 형식의 블로그 게시물이 생성되고 다른 각 옵션은 형식 유형과 관련된 고유한 디자인을 갖습니다.

게시물의 7가지 형식
비디오 게시물 형식 사용

비디오 게시물 형식을 사용하는 경우 게시물 상단에 비디오가 배치됩니다. 또한 게시물의 추천 이미지는 게시물 목록에 포함된 동영상으로 대체됩니다.

형식 옵션 상자에서 “비디오” 게시물 형식을 선택하면 왼쪽 열에 ‘비디오 형식 옵션’이 추가된 것을 확인할 수 있습니다. Youtube 및 Vimeo와 같은 제공 업체의 비디오 URL을 복사 / 붙여넣기 하거나 워드프레스 미디어 라이브러리를 통해 자신의 HTML5 비디오를 설치하여 비디오를 정의 할 수 있습니다.

비디오 게시물 추가하기
오디오 게시물 형식 사용

오디오 게시물 형식을 사용하는 게시물은 콘텐츠 상단에 오디오 플레이어를 표시합니다. 게시물의 추천 이미지도 오디오 플레이어로 대체됩니다. 형식 옵션 상자에서 “오디오”를 선택하면 왼쪽 열에 새 설정 상자가 추가되었음을 알 수 있습니다. 여기에 제공된 옵션을 사용하여 게시물에 대한 오디오 파일을 정의할 수 있습니다.

오디오 게시물 설정
인용문 형식 사용

게시물에 인용문 형식을 적용하면 게시물 상단에 양식화된 인용문이 표시됩니다. 또한 양식화된 인용문은 게시물의 추천 이미지를 대체합니다.

형식 옵션 상자에서 인용문 형식을 선택하면 왼쪽 열에 새 설정 상자가 추가되었음을 알 수 있습니다. 여기에 제공된 옵션을 사용하여 게시물에 대한 인용문을 정의할 수 있습니다.

참고: 인용문은 ‘견적’이라고 번역되어 나옵니다(2021년 2월 1일 기준)

인용문 형식 설정
갤러리 게시물 형식 사용

게시물에 갤러리 게시물 형식을 적용하면 게시물 콘텐츠 상단에 이미지 갤러리가 표시됩니다. 갤러리 슬라이더는 게시물의 추천 이미지를 대체합니다.

형식 옵션 상자에서 갤러리 ‘게시물’ 형식을 선택하면 왼쪽 열에 새 설정 상자가 추가되었음을 알 수 있습니다. 여기에 제공된 옵션을 사용하여 게시물에 대한 갤러리 이미지를 정의할 수 있습니다.

참고: 형식 옵션 상자에 ‘갱도’라고 번역되어 있습니다.(2021년 2월 1일 기준)

갤러리 형식 옵션
링크 게시물 형식 사용

게시물에 링크 게시물 형식을 적용하면 게시물 상단에 양식화된 링크가 표시됩니다. 양식화된 링크는 게시물의 추천 이미지를 대체합니다.

형식 옵션 상자에서 ‘링크’ 게시물 형식을 선택하면 왼쪽열에 새 설정 상자가 추가되었음을 알 수 있습니다. 여기에 제공된 옵션을 사용하여 게시물에 대한 링크를 정의할 수 있습니다.

링크 형식 옵션
지도 게시물 형식 사용

게시물에 지도 게시물 형식을 적용하면 선택한 위치를 중심으로 하는 지도가 게시물 콘텐츠 상단에 눈에 띄게 나타납니다. 이는 특히 게시물이 물리적인 위치에 연결될 수 있는 사이트의 경우 다양한 상황에서 유용하게 사용할 수 있습니다(예: 식당 리뷰 사이트).

형식 옵션 상자에서 ‘지도’ 게시물 형식을 선택하면 왼쪽 열에 새 설정 상자가 추가되었음을 알 수 있습니다. 여기에 제공된 옵션을 사용하여 게시물의 지도 지점을 정의하고 지도의 확대 / 축소 수준 및 위치를 구성 할 수 있습니다.

지도 게시물 형식

Google Maps API 키

지도 모듈을 사용하려면 API 키가 필요합니다. API 키를 얻으려면 Google Developers Console에 로그인하고 Google Maps JavaScript API 및 관련 서비스를 자동으로 활성화합니다. 가장 먼저해야 할 일은 새 프로젝트를 만드는 것입니다.

Google Developers Console로 이동 로그인을 해주고

Maps JavaScript API를 ‘사용(ENABLE)’ 해줍니다.

이미지에 대체텍스트 속성이 없습니다; 파일명은 image-173.png 입니다.
Maps JavaScript API 사용

왼쪽 메뉴 버튼에 API 및 서비스 > 사용자 인증 정보로 들어갑니다

이미지에 대체텍스트 속성이 없습니다; 파일명은 image-176-1024x334.png 입니다.
API키 할당

옆에 있는 아이콘으로 API키를 복사합니다.

이미지에 대체텍스트 속성이 없습니다; 파일명은 image-178.png 입니다.
API키 생성

API 키를 Divi > 테마 옵션 > 일반 설정 > Google API 키에 넣어주고 저장해줍니다.

이미지에 대체텍스트 속성이 없습니다; 파일명은 image-182.png 입니다.
API키 추가하기

추가!: 구글에서 결제 계정(Billing account)로 안되있으면 지도가 안뜨네요. 결제 계정 페이지로 이동해서 연결하면 됩니다. 직접 유료로 업그레이드 하지 않는이상 무료입니다.

추가!!: API 및 서비스 > 라이브러리 에서 Geocoding API 도 사용으로 해줍니다. (해당 기능은 지도 중앙 주소를 지정할 때 사용됩니다.)

이미지에 대체텍스트 속성이 없습니다; 파일명은 image-186.png 입니다.
Geocoding API 사용하기

원문: https://www.elegantthemes.com/documentation/extra/post-formats/

코멘트 제출