스퀘어스페이스에 소셜 미디어 피드를 추가하는 방법

크리에이터나 소규모 브랜드로서 웹사이트를 만들고 계신다면, 사이트를 항상 새롭게 유지하는 것이 얼마나 중요하면서도 어려운 일인지 잘 아실 것입니다. 소셜 프로필에는 항상 최신 게시물이 표시되지만, 홈페이지는 아마 몇 달째 그대로일 수 있습니다. 이로 인해 브랜드가 실제로는 활발하게 운영되고 있음에도 불구하고 비활성 상태인 것처럼 보일 수 있습니다.

Squarespace 사이트에 소셜 미디어 피드를 추가하면 이 모든 문제가 해결됩니다. 최신 게시물이 자동으로 표시되고 새 게시물을 올릴 때마다 새로 고침되므로, 동일한 콘텐츠를 두 번 업데이트할 필요가 없습니다. 또한 이러한 라이브 피드는 수동 작업 없이도 방문자에게 실제 게시물을 통한 최근의 소셜 증거(social proof)를 제공하고 홈페이지에 최신 이미지를 유지해 줍니다. 피드가 사이트 내에 존재하기 때문에, 방문자는 인스타그램이나 페이스북으로 이동할 필요 없이 해당 콘텐츠를 확인할 수 있습니다. 소셜 플랫폼으로 이동할 경우, 웹사이트로 돌아오지 않고 자신의 피드를 계속 스크롤할 가능성이 훨씬 높기 때문입니다. 

그렇다면 이러한 게시물은 어떻게 통합할 수 있을까요? Squarespace에는 최근 게시물을 표시하는 기본 인스타그램 블록이 있습니다. 하지만 이는 지원되는 유일한 소셜 미디어 플랫폼이며, 자체적으로 연결이 끊어지는 문제가 자주 발생하는 것으로 알려져 있습니다. 또 다른 옵션은 호스팅된 위젯을 사용하는 것으로, 여러 소셜 플랫폼을 하나의 피드로 가져와 페이지에 삽입할 수 있습니다.

연결이 끊긴 API 토큰이나 인스타그램 블록의 한계에 시달리지 않고, 동적인 소셜 콘텐츠를 보여주며 체류 시간을 늘리고 싶다면 계속 읽어보세요. 이 가이드에서는 기본 옵션부터 위젯에 이르기까지 Squarespace에 소셜 미디어 피드를 추가하는 방법을 단계별로 설명합니다.

옵션 1: 기본 Squarespace 인스타그램 블록 사용하기

실제 게시물을 보여주는 Squarespace의 내장 옵션은 페이지에 최근 사진을 직접 표시하는 인스타그램 블록입니다. Squarespace에 인스타그램 피드를 삽입하려면 이 블록을 사용해야 합니다. 이름이 비슷한 소셜 링크(Social Links) 블록은 방문자를 프로필로 안내하는 클릭 가능한 아이콘만 추가합니다.

기본 인스타그램 블록을 사용하여 Squarespace에 소셜 미디어 피드를 추가하려면 다음 단계를 따르세요.

1. Squarespace 백엔드에서 **Settings(설정)** 아이콘을 선택한 다음 **Third Party Tools(타사 도구)**를 선택합니다. **Connected Accounts(연결된 계정)**를 선택하고 **Instagram(인스타그램)**을 선택합니다. 로그인 후 **Authorize(인증)**를 클릭합니다. 이 연결을 위해서는 인스타그램 프로페셔널 계정이 필요합니다.

2. 사이트를 편집하고 **+ Add Block(블록 추가)** 또는 삽입 지점을 클릭한 다음 **Instagram(인스타그램)**을 선택합니다. **연필 아이콘**을 클릭하여 블록 편집기를 엽니다.

3. **Account(계정)** 탭에서 연결된 계정을 선택하고 표시할 게시물 수(최대 20개)를 설정합니다. **Design(디자인)** 탭에서 Slideshow(슬라이드쇼), Carousel(캐러셀), Grid(그리드) 또는 Stacked(스택) 중 하나의 레이아웃을 선택한 다음 페이지를 저장합니다.

Squarespace는 주기적으로 만료되는 API 인증을 통해 인스타그램과 연결되며, 만료 시 오류 표시 없이 마지막으로 로드된 게시물 세트에서 블록이 멈춥니다. 2024년 12월, Meta가 Instagram Basic Display API(이 블록이 게시물을 가져오는 데 사용했던 서비스)를 중단함에 따라, 사이트 소유자가 계정을 다시 연결할 때까지 기존 연결의 작동이 멈췄습니다. 이 블록은 중복된 게시물, 보관된 게시물, “권한 없음(unauthorized)” 메시지를 표시하거나 아예 아무것도 표시하지 않을 수 있으며, 이는 모두 Squarespace의 자체 문제 해결 가이드에 나타나 있습니다. 이 중 어느 것이든 해결하려면 수동으로 다시 로그인하고 재연결해야 합니다.

불가피한 연결 끊김 문제 외에도, 이 방법으로 Squarespace에 소셜 미디어 피드를 추가하는 것을 주저하게 만드는 다른 제한 사항들이 있습니다. 첫째, 해시태그나 키워드 필터링 기능 없이 최대 20개의 게시물까지만 표시할 수 있습니다. 둘째, 틱톡(TikTok)이나 다른 소셜 플랫폼을 위한 기본 블록이 없으며, 여러 네트워크를 하나의 그리드로 결합할 수 없습니다.

옵션 2: 무료 통합 소셜 피드 위젯 추가하기 (권장)

Squarespace가 각 플랫폼에 직접 연결하는 대신, Squarespace 소셜 미디어 위젯이 자체적으로 소스를 관리하고 페이지에 붙여넣을 수 있는 임베드 코드를 제공합니다. 여러 계정을 다시 연결할 필요 없이 계속 업데이트되는 멀티플랫폼 피드를 원한다면, 이것이 Squarespace에 소셜 미디어 피드를 추가하기 위한 더 신뢰할 수 있는 옵션입니다.

Jform의 소셜 피드 위젯은 인스타그램, 페이스북, 링크드인, 유튜브, X 및 모든 RSS 소스에서 게시물을 수집하여 반응형 피드 하나에 표시합니다. 무료 소셜 피드 임베드이므로, 본격적으로 도입하기 전에 미리 설정해 보고 어떻게 보이는지 확인할 수 있습니다.

시작하기 전에 Squarespace 요금제를 확인하세요. 코드 블록에 iFrame이나 JavaScript 코드를 추가하는 것은 Core 요금제 이상이 필요한 프리미엄 기능이기 때문입니다. Basic 요금제에서는 코드가 블록에 남아 있지만 작동하지 않습니다.

Jform을 사용하여 피드를 생성하고 Squarespace 페이지에 추가하는 방법은 다음과 같습니다.

1. Jform 작업 공간(Workspace) 페이지에서 **Create(만들기)**를 클릭하고 **Website Widget(웹사이트 위젯)**을 선택한 다음, **Social Feed(소셜 피드)** 위젯을 검색하고 **Use Widget(위젯 사용하기)**을 클릭합니다.

2. 오른쪽 **Widget properties(위젯 속성)** 메뉴의 **General(일반)** 탭에서 **+ Add first source(첫 번째 소스 추가)**를 클릭합니다. 드롭다운에서 플랫폼을 선택하고 계정 핸들이나 공개 프로필 URL을 입력한 후 **Connect(연결)**를 클릭합니다. 피드에 추가하려는 각 계정에 대해 이 과정을 반복하면, 연결된 모든 소스의 게시물이 하나로 병합됩니다.

3. **Style(스타일)** 및 **Layout(레이아웃)** 탭을 사용하여 테마, 색상, 게시물 스타일, 열 및 게시물 제한을 설정합니다. 그런 다음 상단 내비게이션 바에서 **Publish(게시)**를 클릭합니다.

4. **Embed(임베드)** 섹션에서 **Copy Code(코드 복사)**를 클릭합니다. 왼쪽 메뉴에서 **Platforms(플랫폼)**로 이동한 다음 **Squarespace**를 선택하여 플랫폼별 지침을 확인할 수도 있습니다.

또한 왼쪽 메뉴에서 **Platforms(플랫폼)**로 이동하여 **Squarespace**를 선택하면 플랫폼별 지침을 확인할 수 있습니다.

5. Squarespace에서 피드를 표시할 페이지를 열고 + **Add Block(블록 추가)**을 클릭한 후 **Code(코드)**를 선택합니다. 자리 표시자 텍스트를 삭제하고 임베드 코드를 붙여넣은 다음, 블록이 HTML로 설정되어 있고 Display Source(소스 표시)가 꺼져 있는지 확인한 후 **Save(저장)**를 클릭합니다.

소스를 결합하는 것은 기본 블록에 비해 Jform이 가지는 주요 이점입니다. Squarespace의 여러 소셜 피드를 각각 별도의 블록으로 설정할 필요 없이 하나의 레이아웃에 표시할 수 있기 때문입니다. 방문자는 섹션을 벗어나지 않고도 소스 탭을 통해 각 피드를 찾아볼 수 있으며, 작성자 이름, 날짜, 캡션, 소스 배지 및 참여도를 포함하여 각 게시물 카드에 표시할 내용을 직접 제어할 수 있습니다. 또한 Jform을 사용하면 열, 간격, 색상 및 테마를 조정하거나 사용자 정의 CSS를 추가하여 피드가 사이트 스타일에 완벽하게 어울리도록 할 수 있습니다.

스마트 서버리스 위젯으로 Squarespace 사이트 성능 향상하기

소셜 피드는 템플릿 디자인을 건드리지 않고도 추가할 수 있는 여러 요소 중 하나일 뿐입니다. Jform의 무료 웹사이트 위젯 디렉토리에는 서비스 페이지의 소셜 증명을 위한 Google 리뷰 위젯, 받은편지함에 쌓이는 질문들을 위한 FAQ 위젯, 출시나 등록 마감일을 위한 카운트다운 타이머 등 150개 이상의 다양한 옵션이 포함되어 있습니다. 각 위젯은 동일한 방식으로 임베드되므로 Squarespace 레이아웃이 그대로 유지됩니다. 동일한 사이트에서 예약, 문의 또는 가입이 필요한 경우 Jotform-Squarespace 연동을 통해 양식도 완벽하게 지원합니다.

몇 주에 한 번씩 연결이 끊긴 계정을 다시 연결하기 위해 로그인하는 것보다, 콘텐츠를 만들고 게시하는 데 시간을 투자하는 것이 훨씬 낫습니다. Jform의 소셜 피드 위젯 및 기타 다양한 위젯들은 별도의 유지 관리 없이도 사이트를 항상 최신 상태로 유지해 주므로, Squarespace 템플릿을 디자인한 그대로 보존할 수 있습니다.