인스타그램은 이제 쉽게 설치할 수 없는 애물단지의 기능이 되어 버렸는데요,그나마 다행인건, 이러한 서비스를 외부에서 쉽게 접근 가능하도록 제공하는 무료 서비스들이 있습니다.
인피니트 스킨에서 사용된건 SNAP WIDGET ( 스냅위젯 ) 이라는 무료 위젯 서비스 입니다.
유료 서비스도 있지만, 무료로 사용해도 워터마크나 기타 제약이 없는 서비스 입니다.
1. Snapwidget에 접속하세요.
https://snapwidget.com/ 접속하셔서 간단하게 회원가입을 하세요.
2. 로그인 후 아래와 같은 화면 나오면 SKIP THIS를 클릭하세요.
그리고 4번 내용을 바로 보시면 됩니다.
3. 새로운 위젯을 생성하는 버튼을 클릭하세요.
![]()
4. 무료로 된 그리드 스킨을 선택하세요.
![]()
5. 원하시는 디자인으로 셋팅한 후에 코드를 얻으시길 바랍니다.
(설정 항목 중에서 Responsive은 꼭 yse로 설정해주세요.)
PC, 모바일 스킨에서
서로 다른 형태로 인스타그램 보여주시려면
PC용 위젯, 모바일용 위젯을 따로 등록해주시면 됩니다.
아래는 저희가 등록한 샘플 PC용 위젯, 모바일용 위젯 설정값입니다.
참고하셔서 등록하시면 됩니다.
[ PC 스킨 ]
Thumbnail Size - 160
Layout (Columns X Rows) - 8*1
Photo Border - no
Background Color - {빈값}
Photo Padding - 10
Hover Effect - none
Sharing Buttons - yes
Responsive - yes
[ 모바일 스킨 ]
Thumbnail Size - 200
Layout (Columns X Rows) - 4*2
Photo Border - no
Background Color - {빈값}
Photo Padding - 1
Hover Effect - none
Sharing Buttons - no
Responsive - yes![]()
![]()
6. 얻은 코드를 이제 인피니트 스킨에 적용하시면 됩니다.
![]()
이제 설치가 끝났습니다. 웹사이트에서 새로고침 해보시길 바랍니다.
7. 만약 인스타그램을 사용하지 않으시려면,
![]()
레이아웃에서 푸터에 해당하는 파일을 열고 @ 부분을 제거해서 숨길 수 있습니다.
<!-- 인스타그램 -->
<!--@import(/_sp/cafe24/include/instagram.html)-->
이 코드가
<!-- 인스타그램 -->
<!--import(/_sp/cafe24/include/instagram.html)-->
이렇게 @만 빠지면 코드 자체가 숨겨지게 되니 참고하시길 바랍니다.
나중에 다시 사용하시려면 @를 다시 넣으시면 되겠죠 ?