WordPress에 Facebook 앨범을 삽입하는 방법

게시 됨: 2023-01-21


WordPress에 Facebook 앨범을 삽입하시겠습니까?

Facebook 앨범을 포함하는 것은 WordPress 웹사이트와 Facebook 페이지 모두에서 더 많은 참여를 유도할 수 있는 좋은 방법입니다. 또한 소셜 미디어를 따라 성장할 수 있습니다.

이 기사에서는 WordPress에 Facebook 앨범을 쉽게 삽입하는 방법을 보여줍니다.

How to embed Facebook albums in WordPress

WordPress에 Facebook 앨범 포함

WordPress 웹사이트에 앨범을 표시하면 페이지를 더욱 매력적으로 만들 수 있습니다.

Facebook에 더 많은 사진을 추가하면 해당 사진이 사이트에 자동으로 표시되므로 일반 방문자에게도 웹사이트를 최신 상태로 유지하는 좋은 방법입니다.

포함된 앨범을 사용하여 Facebook 페이지를 홍보할 수도 있습니다. 방문자가 흥미로운 사진을 많이 본다면 Facebook에서 귀하를 팔로우하고 싶어할 것입니다. 이를 통해 추가 팔로워와 더 많은 참여를 얻을 수 있습니다.

WordPress에는 Facebook 앨범에 대한 내장 포함 지원이 함께 제공되었습니다. YouTube 비디오를 포함하는 것처럼 Facebook 앨범의 URL을 복사하여 붙여넣기만 하면 WordPress에서 해당 앨범을 자동으로 표시합니다.

그러나 이후 Facebook과 Instagram은 API를 변경했습니다. 이러한 변경으로 인해 WordPress는 Facebook 및 Instagram에 대한 oEmbed 지원을 계속할 수 없습니다.

앨범에 대한 링크를 포함하려고 하면 WordPress에서 '죄송합니다. 이 콘텐츠를 포함할 수 없습니다.'라는 메시지가 표시됩니다.

The Facebook album embed error

고맙게도 플러그인을 사용하여 WordPress에서 Facebook 및 Instagram 임베드를 수정하는 방법이 있습니다.

페이지나 게시물에 특정 앨범을 표시하는 방법을 포함하여 WordPress에 Facebook 앨범을 쉽게 삽입하는 방법을 살펴보겠습니다.

Facebook 앨범 플러그인 설치

WordPress에 Facebook 앨범을 삽입하는 가장 좋은 방법은 Smash Balloon Custom Facebook Feed 플러그인을 사용하는 것입니다.

이 플러그인을 사용하면 사이트에 Facebook 앨범, 댓글, 리뷰, 커뮤니티 게시물 등을 표시할 수 있습니다.

How to embed Facebook photos in your WordPress website using Smash Balloon

또한 방문자가 웹사이트에서 라이트박스 팝업을 열어 Facebook을 방문하지 않고도 사진과 이미지를 자세히 볼 수 있습니다.

이 가이드에서는 Facebook 앨범을 삽입하고, 비디오를 표시하고, 사용자 지정 Facebook 피드에 사진을 표시하는 등의 작업을 수행할 수 있는 Smash Balloon의 프로 버전을 사용할 것입니다. 그러나 예산에 상관없이 WordPress용 맞춤형 Facebook 피드를 만들 수 있는 무료 버전도 있습니다.

가장 먼저 해야 할 일은 Smash Balloon Custom Facebook Feed 플러그인을 설치하고 활성화하는 것입니다. 자세한 내용은 WordPress 플러그인 설치 방법에 대한 가이드를 참조하세요.

활성화되면 Facebook 피드 » 설정 으로 이동하여 '라이선스 키' 필드에 라이선스 키를 입력해야 합니다.

Adding your license key to Smash Balloon

Smash Balloon 웹사이트의 계정에서 이 정보를 찾을 수 있습니다.

키를 입력한 후 '활성화' 버튼을 클릭합니다.

Facebook 페이지 또는 그룹을 WordPress에 연결

Smash Balloon Custom Facebook Feed를 사용하면 다른 Facebook 페이지 및 그룹의 앨범을 삽입할 수 있습니다. 좋아요 및 공유와 함께 사진 아래의 드롭다운 상자에 최신 댓글을 표시할 수도 있습니다.

Facebook 페이지 또는 그룹을 WordPress에 연결하려면 Facebook 피드 » 모든 피드 로 이동한 다음 '새로 추가'를 클릭하십시오.

Adding a Facebook group or page to WordPress

Smash Balloon을 사용하면 사진 앨범, 타임라인, 이벤트 등의 게시물을 표시할 수 있습니다.

Facebook 앨범을 삽입하려면 '앨범'을 클릭한 후 '다음'을 클릭해야 합니다.

Choosing the Smash Balloon 'Albums' template

이제 앨범을 가져올 Facebook 페이지 또는 그룹을 선택해야 합니다.

시작하려면 '새로 추가'를 클릭하십시오.

Choosing a source for your Facebook album

다음 화면에서 페이지 또는 그룹의 앨범을 표시할지 여부를 선택합니다.

그런 다음 'Facebook에 연결'을 클릭하세요.

How to connect Smash Balloon and WordPress to Facebook

이렇게 하면 Facebook 계정에 로그인하고 앨범을 삽입하려는 페이지 또는 그룹을 선택할 수 있는 팝업이 열립니다.

이 결정을 내린 후 '다음'을 클릭하십시오.

Choosing Facebook pages and groups to embed albums from

일단 그렇게 하면 Facebook은 Smash Balloon이 액세스할 수 있는 모든 정보와 수행할 수 있는 작업을 표시합니다.

Smash Balloon의 Facebook 계정 액세스를 제한하려면 스위치 중 하나를 클릭하여 '예'에서 '아니요'로 바꾸십시오. 이는 WordPress 블로그 또는 웹사이트에 삽입할 수 있는 앨범 및 사진에 영향을 미칠 수 있다는 점에 유의하십시오.

따라서 모든 스위치를 활성화된 상태로 두는 것이 좋습니다.

Giving Smash Balloon access to your Facebook page

준비가 되면 '완료'를 클릭하십시오.

잠시 후 WordPress 웹사이트를 Facebook에 연결했음을 확인하는 메시지가 표시됩니다. 완료되면 '확인'을 클릭할 차례입니다.

How to connect Facebook albums to your WordPress website

이제 Smash Balloon이 자동으로 WordPress 대시보드로 돌아갑니다.

WordPress에 Facebook 앨범을 삽입하는 방법

이제 방금 웹 사이트에 연결한 그룹 또는 페이지가 있는 팝업이 표시됩니다. 소스 옆의 라디오 버튼을 선택한 다음 '추가' 버튼을 클릭하기만 하면 됩니다.

How to embed albums from a Facebook page or group

실수로 팝업을 닫은 경우 당황하지 마십시오. 탭을 새로고침하여 팝업을 다시 열 수 있습니다.

그런 다음 WordPress는 자동으로 Facebook 피드»모든 피드 페이지로 돌아갑니다. 이전과 마찬가지로 '새로 추가' 버튼을 클릭하고 '앨범'을 선택한 후 '다음' 버튼을 클릭합니다.

이제 Facebook 페이지 또는 그룹을 선택하고 '다음'을 클릭하십시오.

Selecting a source for your Facebook album

이 화면에서 피드의 시작점으로 사용할 템플릿을 선택할 수 있습니다. 이러한 모든 템플릿은 완벽하게 사용자 정의할 수 있으므로 웹 사이트에서 Facebook 앨범을 표시하려는 방식에 따라 디자인을 미세 조정할 수 있습니다.

우리는 '기본' 템플릿을 사용하고 있지만 원하는 템플릿을 선택할 수 있습니다.

Choosing a template for your Facebook albums

완료되면 '다음' 버튼을 클릭합니다.

Smash Balloon은 이제 소스와 선택한 템플릿을 기반으로 앨범 피드를 생성합니다. 이것은 좋은 시작이지만 앨범이 WordPress 웹 사이트에 표시되는 방식을 미세 조정하고 싶을 수 있습니다.

포함된 Facebook 앨범을 사용자 정의하는 방법

Smash Balloon Custom Facebook Feed 플러그인은 앨범이 표시되는 방식을 사용자 지정할 수 있는 다양한 방법을 제공합니다. 이를 염두에 두고 어떤 변경을 할 수 있는지 확인하는 것이 좋습니다.

Facebook 피드 » 모든 피드 화면에서 앨범 피드를 찾은 다음 작은 연필 모양의 '편집' 버튼을 클릭합니다.

Customizing your Facebook albums feed

그러면 Smash Ballon 피드 편집기가 열리고 오른쪽에 Facebook 앨범 미리보기가 표시됩니다.

왼쪽에는 이러한 앨범이 사이트에 표시되는 방식을 사용자 지정하는 데 사용할 수 있는 다양한 설정이 모두 표시됩니다. 이러한 설정의 대부분은 자명하지만 몇 가지 핵심 영역을 빠르게 다룰 것입니다.

Editing the Facebook albums feed

시작하려면 '피드 레이아웃'을 클릭하여 앨범 표시 방법을 변경할 수 있습니다.

이 화면에서 석조 및 그리드와 같은 다양한 레이아웃 간에 전환하고 피드 높이를 변경할 수 있습니다. 변경하면 미리보기가 자동으로 업데이트되므로 다른 설정을 시도하여 가장 잘 보이는 것을 확인할 수 있습니다.

Choosing a new feed layout in WordPress

기본적으로 피드는 데스크톱 컴퓨터와 스마트폰과 같은 모바일 장치에서 동일한 수의 게시물을 표시합니다.

오른쪽 상단 모서리에 있는 일련의 버튼을 사용하여 데스크탑 컴퓨터, 태블릿 및 스마트폰에서 앨범이 어떻게 보이는지 미리 볼 수 있습니다.

Choosing a new feed layout in WordPress

모바일 장치는 일반적으로 화면이 작고 처리 능력이 떨어지므로 태블릿과 스마트폰에 표시되는 앨범 수를 줄일 수 있습니다.

이렇게 하려면 '게시물 수' 아래의 '모바일' 입력란에 다른 숫자를 입력하면 됩니다.

Changing how your embedded Facebook albums appear on mobile devices

다양한 레이아웃을 시도함으로써 방문자가 사용하는 장치에 관계없이 멋지게 보이는 사용자 지정 피드를 만들 수 있습니다.

기본적으로 Facebook 피드는 데스크톱 컴퓨터에 비해 스마트폰 및 태블릿에서 더 적은 열을 표시합니다. 이렇게 하면 모든 앨범과 사진을 작은 화면에 편안하게 맞출 수 있습니다.

WordPress 웹사이트의 모바일 버전을 테스트한 후 스마트폰 및 태블릿에서 열이 표시되는 방식이 마음에 들지 않을 수 있습니다. 이 경우 '열' 섹션에서 숫자를 변경하여 더 적은 수의 열을 표시할 수 있습니다.

Changing the column layouts using Smash Balloon

변경한 내용이 만족스러우면 '사용자 정의' 링크를 클릭하십시오.

이렇게 하면 기본 Smash Balloon 편집기로 돌아가서 다음 설정 화면인 'Color Scheme'을 탐색할 수 있습니다.

Changing the color scheme for your Facebook photo feed

기본적으로 Smash Balloon은 WordPress 테마에서 상속된 색 구성표를 사용하지만 이 화면에서는 'Light' 또는 'Dark' 모양으로 전환할 수 있습니다.

또한 '사용자 지정'을 선택한 다음 컨트롤을 사용하여 배경색을 변경하고 WordPress에서 텍스트 색상을 변경하는 등 자신만의 색 구성표를 만들 수 있습니다.

Adding a custom color to your Facebook album feed

기본적으로 Smash Balloon은 Facebook 프로필 사진과 페이지 또는 그룹의 이름인 헤더를 피드에 추가합니다.

이 섹션의 모양을 변경하려면 왼쪽 메뉴에서 '헤더'를 클릭하십시오.

Customizing the header of your Facebook album feed

이 화면에서 머리글의 크기, 색상을 변경하고 Facebook 프로필 사진을 숨기거나 표시하는 등의 작업을 할 수 있습니다.

헤더를 완전히 제거하려면 '사용' 토글을 클릭하여 끕니다.

How to embed Facebook albums in WordPress

기본적으로 Smash Balloon은 각 앨범의 제목을 표시합니다. 제목을 숨기려면 기본 Smash Balloon 편집기 메뉴에서 '게시물'을 선택하십시오.

그런 다음 '글 스타일'을 클릭합니다.

Changing the style of your Facebook album feed

여기에서 '앨범 제목 표시' 슬라이더를 클릭하여 앨범 제목을 제거할 수 있습니다.

이것은 앨범 제목이 사진에서 주의를 분산시키거나 웹사이트에 포함되었을 때 의미가 없는 경우에 유용할 수 있습니다.

Showing the album title in your WordPress Facebook feed

이 화면에서 각 앨범에 있는 사진 수를 표시할지 여부도 선택할 수 있습니다.

이 숫자를 추가하려면 '앨범의 게시물 수' 토글을 클릭하기만 하면 됩니다.

Adding the number to Facebook albums in WordPress

기본적으로 Smash Balloon은 피드에 Facebook '좋아요' 버튼을 포함하지 않습니다. 더 많은 Facebook 팔로워를 얻으려면 편집기의 왼쪽 메뉴에서 '좋아요 상자'를 선택하여 이 버튼을 추가할 수 있습니다.

그런 다음 '사용' 버튼을 클릭하면 파란색으로 바뀝니다.

Adding a 'like' button to your Facebook albums feed in WordPress

기본적으로 Smash Balloon은 포함된 사진 앨범 아래에 이 버튼을 추가하지만 '위치' 드롭다운을 열고 '상단'을 선택하여 변경할 수 있습니다.

이 화면에서 사용자 지정 클릭 유도문안 추가, Facebook에서 회원님을 팔로우하는 사람 수 표시 등을 포함하여 '좋아요' 섹션의 모양을 변경할 수도 있습니다.

Customizing the Facebook follow button in WordPress

'좋아요' 버튼 모양이 마음에 들면 '더 보기 버튼' 화면으로 이동할 수 있습니다.

추가 로드 버튼은 방문자가 Facebook 피드를 더 많이 스크롤하도록 권장하므로 Smash Balloon은 기본적으로 포함된 사진 앨범에 추가합니다.

Adding a 'Load More' button to a custom Facebook photos feed in WordPress

매우 중요한 버튼이므로 배경 색상, 텍스트 색상 및 레이블을 변경하여 더 보기를 돋보이게 할 수 있습니다.

또 다른 옵션은 '활성화' 토글을 클릭하여 버튼을 완전히 제거하는 것입니다.

Removing the 'Load More' button from embedded Facebook albums

기본적으로 Smash Balloon을 사용하면 방문자가 웹 사이트를 떠나지 않고도 Facebook 앨범을 볼 수 있습니다.

다음 이미지에서 볼 수 있듯이 앨범을 클릭하기만 하면 라이트박스가 열립니다.

Smash Balloon's lightbox feature

방문자는 화살표를 사용하여 앨범을 스크롤할 수 있습니다.

사진에 좋아요를 누르거나 댓글을 남기거나 Facebook 친구들과 이미지를 공유하고 싶다면 'Facebook에서 보기' 링크를 클릭하면 됩니다.

Visiting a Facebook group or page from the lightbox

기본 라이트박스를 맞춤설정할 수 있는 몇 가지 방법이 있습니다.

옵션을 보려면 왼쪽 메뉴에서 '라이트박스'를 클릭하세요.

Customizing the Facebook photos lightbox

여기에서 라이트박스의 텍스트, 링크 및 배경색의 색상을 변경할 수 있습니다.

라이트박스 기능을 사용하면 사람들이 사진에 쉽게 참여할 수 있을 뿐만 아니라 사람들이 Facebook 페이지를 방문하지 않고도 앨범을 스크롤할 수 있습니다. 더 많은 방문자를 Facebook 페이지로 유도하려면 '활성화' 토글을 클릭하여 라이트박스 기능을 비활성화할 수 있습니다.

Disabling the lightbox feature on your WordPress website

이제 방문자가 앨범을 클릭하면 새 탭에서 Facebook 페이지로 리디렉션됩니다.

사진 앨범이 마음에 들면 '저장'을 클릭하여 변경 사항을 저장하는 것을 잊지 마십시오.

이제 이러한 앨범을 WordPress 웹사이트에 추가할 준비가 되었습니다.

WordPress에 Facebook 앨범을 추가하는 방법

블록, 위젯 또는 단축 코드를 사용하여 Facebook 앨범을 WordPress에 추가할 수 있습니다.

Smash Balloon을 사용하여 하나 이상의 피드를 만든 경우 블록이나 위젯을 사용하려면 피드의 코드를 알아야 합니다.

Facebook 피드 » 모든 피드 로 이동한 다음 단축 코드의 feed="" 부분을 확인하십시오. 이 코드를 블록이나 위젯에 추가해야 하므로 기록해 둡니다.

다음 이미지에서는 feed="4" 사용해야 합니다.

Embedding Facebook albums using code

페이지나 게시물에 Facebook 앨범을 삽입하려는 경우 일반적으로 사용자 지정 Facebook 피드 블록을 사용합니다.

앨범을 삽입하려는 페이지나 게시물을 열기만 하면 됩니다. 그런 다음 '+' 아이콘을 클릭하여 새 블록을 추가하고 'Custom Facebook Feed'를 입력하기 시작합니다.

오른쪽 블록이 나타나면 클릭하여 페이지나 게시물에 추가합니다.

How to add a Custom Facebook Feed block to WordPress

블록은 기본적으로 Smash Balloon 피드 중 하나를 표시합니다. 대신 다른 피드를 사용하려면 오른쪽 메뉴에서 '단축 코드 설정'을 찾으십시오.

이제 이 상자에 feed="" 코드를 추가할 수 있습니다. 그런 다음 '변경사항 적용'을 클릭하십시오.

Embedding Facebook photos in WordPress

이제 블록에 Facebook 페이지 또는 그룹의 앨범이 표시됩니다. 페이지를 게시하거나 업데이트하여 앨범을 웹사이트에 게시하세요.

또 다른 옵션은 사이드바 또는 유사한 섹션과 같은 위젯 준비 영역에 피드를 추가하는 것입니다. 이를 통해 방문자는 사이트의 모든 페이지에서 Facebook 사진을 볼 수 있습니다.

WordPress 대시보드에서 모양 » 위젯으로 이동한 다음 파란색 '+' 버튼을 클릭하기만 하면 됩니다.

Adding Facebook albums to your website's sidebar

그런 다음 Custom Facebook Feed 위젯을 찾으십시오.

그런 다음 피드를 표시하려는 영역으로 드래그하기만 하면 됩니다.

How to embed Facebook albums and photos in WordPress

Smash Balloon을 사용하여 만든 피드 중 하나가 위젯에 표시됩니다.

대신 다른 피드를 표시하려면 '단축 코드 설정' 상자에 피드의 코드를 입력한 다음 '변경사항 적용'을 클릭하십시오.

Showing different Facebook feeds in a Smash Balloon block

이제 '업데이트' 버튼을 클릭하여 위젯을 활성화할 수 있습니다. 자세한 내용은 WordPress에서 위젯을 추가하고 사용하는 방법에 대한 단계별 가이드를 참조하세요.

마지막으로, 모든 페이지, 게시물 또는 위젯 준비에 앨범을 삽입할 수 있으며 단축 코드를 사용합니다.

Facebook 피드 » 모든 피드 로 이동하여 '단축 코드' 열의 코드를 복사하세요. 이제 이 코드를 사이트에 추가할 수 있습니다.

자세한 내용은 WordPress에 단축 코드를 추가하는 방법에 대한 자세한 가이드를 참조하십시오.

WordPress에 특정 Facebook 앨범 추가

Smash Balloon을 사용하면 WordPress 사이트의 어느 위치에나 특정 Facebook 앨범을 삽입할 수 있습니다. 이를 통해 방문자에게 최신 또는 최고의 앨범을 보여주거나 페이지의 나머지 콘텐츠와 관련된 앨범을 표시할 수 있습니다.

특정 Facebook 앨범을 임베드하려면 Facebook 피드 » 확장 프로그램 으로 이동하여 앨범 확장 프로그램을 구입하고 설치해야 합니다.

여기에서 '앨범' 확장을 찾아 '추가' 버튼을 클릭합니다.

The Smash Balloon Single Album extension

확장 프로그램 구매 방법에 대한 지침과 함께 새 탭에서 Smash Ballon 웹 사이트가 열립니다.

확장 프로그램이 있으면 플러그인을 설치하는 것과 똑같은 방식으로 설치할 수 있습니다. 도움이 필요하면 WordPress 플러그인 설치 방법에 대한 가이드를 참조하십시오.

플러그인을 활성화한 후 Facebook 피드 » 모든 피드 로 이동하여 '새로 추가'를 클릭합니다.

'고급 피드 유형'에서 '단일 앨범'을 선택한 후 '다음'을 클릭하십시오.

Showing a specific album on your WordPress website

이제 소스로 사용할 페이지 또는 그룹을 선택하고 위에서 설명한 동일한 프로세스에 따라 템플릿을 선택할 수 있습니다.

다음 페이지에서 삽입하려는 앨범의 ID를 입력해야 합니다.

Embedding a specific album in WordPress

새 탭에서 표시하려는 Facebook 앨범을 열기만 하면 됩니다.

이제 = 기호 뒤와 처음 두 마침표 사이에 숫자를 복사할 수 있습니다. 예를 들어 다음 이미지에서 447443907512397을 복사해야 합니다.

Getting the ID of a Facebook album

이제 이 번호를 WordPress 대시보드에 붙여넣을 수 있습니다.

그런 다음 '다음'을 클릭하면 Smash Balloon이 앨범을 가져옵니다.

Adding a Facebook album ID to WordPress

그런 다음 위에서 설명한 동일한 프로세스에 따라 앨범의 스타일을 지정하고 사이트에 추가할 수 있습니다.

이 기사가 WordPress에 Facebook 앨범을 삽입하는 방법을 배우는 데 도움이 되었기를 바랍니다. WordPress에서 사용자 지정 Instagram 사진 피드를 만드는 방법과 방문자가 웹사이트를 떠난 후 이메일 뉴스레터를 만드는 방법에 대한 가이드를 확인하고 싶을 수도 있습니다.

이 기사가 마음에 드셨다면 WordPress 비디오 자습서용 YouTube 채널을 구독하십시오. 트위터와 페이스북에서도 우리를 찾을 수 있습니다.