Instagram을 사용하여 스마트폰으로 사진과 짧은 동영상을 캡처, 사용자 정의 및 공유할 수 있습니다. 이 가이드에서는 Instagram 글을 웹사이트에 임베드하는 방법을 알아봅니다.
이 가이드에서
비디오 대본
안녕하세요. 이 비디오에서는 워드프레스 편집기를 사용하여 Instagram 글을 임베드하는 방법을 알아봅니다.
먼저 Instagram 블록을 추가합니다.
그런 다음 거기서 기존 글의 링크를 복사합니다. 여기에 하나 있습니다.
이를 버튼에 직접 붙여넣습니다. 그런 다음 임베드를 클릭하면 페이지의 글이나 방금 추가한 글을 볼 수 있습니다.
이는 비디오에도 아주 잘 작동합니다.
Instagram 글을 임베드하면 웹사이트 방문자가 Instagram 웹사이트를 직접 방문하지 않고도 회원님의 사이트에서 사진 또는 비디오를 직접 볼 수 있습니다. 사진, 비디오, 릴스를 임베드할 수 있습니다. Instagram에서 글을 임베드하려면 다음 단계를 따릅니다.
- 웹 브라우저의 주소 창이나 Instagram 앱에서 Instagram 글의 URL을 복사합니다. 형식은 다음과 같습니다.
https://www.instagram.com/p/CuzSGmjO5MP - 워드프레스 편집기에서 다른 텍스트나 공백 없이 새 줄에 URL을 붙여넣습니다. 이렇게 하면 임베드 블록 안에 글이 자동으로 임베드됩니다. 기본적으로 URL에서는 가로 612픽셀의 사용 가능한 최대 이미지 크기가 임베드됩니다.
- (선택 사항) 임베드 위 또는 아래에 표시되는 도구 모음에서 임베드를 왼쪽, 오른쪽 또는 가운데로 정렬할 수 있습니다.
- (선택 사항) 블록 설정에서 소형 기기용으로 크기 조정 옵션을 토글하여 다른 브라우저 크기에서 화면 비율을 유지할 수 있습니다.
비디오 임베드도 이와 매우 비슷하지만 다음과 같은 삼각형 “재생” 기호가 표시됩니다.
임베드가 작동하지 않으면 임베드 링크 문제 해결 가이드에서 이유를 알아보세요.
Instagram 프로필에서 자동으로 업데이트되는 최신 글 그리드를 표시하려면 최신 Instagram 글 블록을 사용하세요.
최신 Instagram 글 블록을 추가하려면 + 블록 삽입기 아이콘을 클릭하고 “Instagram”을 검색합니다. 최신 Instagram 글을 클릭하면 글 또는 페이지에 블록이 추가됩니다.
블록 추가에 대한 자세한 안내는 여기에서 확인하세요.
최신 Instagram 글 블록을 추가하면 Instagram 계정을 연결하라는 메시지가 표시됩니다. 플러그인이 활성화된 사이트가 있는 경우 사이트의 프라이버시 설정이 비공개가 아닌 공개 또는 공개 예정 모드로 설정되어 있어야 합니다.
사이트를 Instagram에 연결하려면 다음 단계를 따릅니다.
- Instagram에 연결을 클릭합니다.
- 팝업 창에서 허용을 클릭하여 연결을 승인합니다.
- 아래 이미지에 표시된 대로 연결할 계정을 선택합니다.
- Instagram에 연결을 한 번 더 클릭합니다.
페이지에 임베드된 가장 최신 Instagram 글 9개의 그리드가 표시됩니다. 이 때 협업 컬렉션(대화에 공유된 글)은 포함되지 않습니다. 그리드 사용자 정의 방법을 알아보려면 다음 단계로 이동하세요.
알림판에서 도구 → 마케팅 → 연결(또는 WP 관리자를 사용 중인 경우 호스팅 → 연결)로 이동하여 Instagram에 사이트를 연결하거나 연결 해제할 수 있습니다. 여기에서 Instagram 연결을 해제하면 모든 워드프레스닷컴 계정의 사이트에서 연결이 제거됩니다.
블록을 선택하면 오른쪽 사이드바에 추가 블록 설정이 표시됩니다. 사이드바가 표시되지 않으면 오른쪽 상단의 설정 아이콘을 클릭하여 설정을 가져와야 할 수도 있습니다. 이 아이콘은 일정하지 않은 열 2개가 있는 정사각형 모양입니다.
옵션은 다음과 같습니다.
계정 설정: 연결된 Instagram 계정을 봅니다. 계정을 제거하거나 다른 계정에 연결하려면 해당 계정의 연결을 해제합니다.
표시 설정: 표시되는 Instagram 글 수, 사용되는 열 수 및 Instagram 그리드에서 각 글을 구분하는 공간(픽셀 단위로 계산)을 조정합니다.
모바일에 스택: 모바일에 스택을 활성화하면 왼쪽 콘텐츠가 오른쪽 콘텐츠 위에 표시됩니다(데스크톱 화면처럼 나란히 표시되지 않음). 따라서 모바일 방문자의 환경이 개선됩니다.
고급: 고급 탭에서는 블록에 CSS 클래스를 추가하여 사용자 정의 CSS를 작성하고 블록 스타일을 지정할 수 있습니다. 블록에 CSS 클래스를 추가하는 방법에 대해 자세히 알아보세요.
정렬 및 너비: 최신 Instagram 글 블록 도구 모음에는 테마에서 지원되는 경우 넓은 폭 또는 전체 폭을 사용하는 것 외에도 블록을 왼쪽, 가운데 또는 오른쪽으로 정렬하는 옵션이 포함되어 있습니다.
최대 2개의 Instagram 계정을 연결하여 2개의 최신 Instagram 글 블록(즉 한 블록 당 1개 계정)을 사용할 수 있습니다. 이 프로세스에는 두 개의 별도 Instagram 로그인이 필요합니다. 같은 로그인을 사용하여 여러 Instagram 계정을 관리하면 작동하지 않습니다.
첫 번째 Instagram 계정을 사이트에 연결한 뒤 다음 단계에 따라 두 번째 계정을 연결합니다.
- 새 브라우저 탭에서 instagram.com으로 이동하여 첫 번째 Instagram 계정에서 로그아웃합니다.
- 두 번째 Instagram 계정에 로그인합니다.
- 사이트의 알림판을 방문합니다.
- 도구 → 마케팅 → 연결(또는 WP 관리자를 사용 중인 경우 호스팅 → 연결)로 이동합니다.
- Instagram 아래에서 드롭다운 화살표를 클릭하고 다른 계정 연결을 선택합니다.
- 연결되면 두 개의 최신 Instagram 글 블록을 사용할 수 있습니다.
그 외에 Instagram을 사이트에 통합하는 방법은 다음과 같습니다.
- 프로필에 링크된 Instagram 로고를 표시하는 소셜 아이콘 블록을 사용합니다.
- Instagram 비즈니스 계정에 글을 자동으로 공유합니다.
지원 