Page Builder Sandwich 문서

PBS Pro 받기

[작성자:] Neil Lock

  • Jetpack

    Jetpack

    Page Builder Sandwich는 Jetpack의 다양한 모듈과 호환되어야 합니다.

    Jetpack의 Markdown 모듈

    Markdown 모듈은 콘텐츠를 저장할 때 특별한 작업을 수행하므로 마크다운 변환 중에 변경 사항이 손실될 수 있습니다. 이를 처리하기 위해 프런트엔드에서 변경 사항을 저장할 때 백엔드 편집기의 마크다운 텍스트가 HTML 태그로 변환됩니다. (도움을 주신 Jake Jackson에게 감사드립니다)

  • PHP 7

    PHP 7

    Page Builder Sandwich를 PHP 7에서 테스트했으며 아무 문제 없이 정상적으로 작동해야 합니다.

    하위 버전에서 PHP 7로 사이트를 업그레이드할 때 주의하세요. 모든 테마와 플러그인에서 해결해야 하는 하위 버전과의 비호환성 문제가 많이 있습니다.

  • Materialize를 사용하는 테마

    Materialize를 사용하는 테마

    Page Builder Sandwich와 Materialize를 함께 사용할 때 발생하는 Javascript 오류가 있습니다. materialize.js와 WordPress 코어의 색상 선택기 사이에 충돌이 발생합니다.

    이 문제와 관련하여 Materialize의 GitHub 저장소에 등록된 이슈가 있습니다: https://github.com/Dogfalo/materialize/issues/2821

  • 라이선스가 만료되면 어떻게 되나요?

    라이선스가 만료되면 어떻게 되나요?

    사이트에서 라이선스를 비활성화하지 않는 한 플러그인은 계속 정상적으로 작동합니다. 하지만 한 번 비활성화하면 다시 활성화할 수 없습니다.

    WordPress 대시보드에서 업데이트를 받거나 최신 버전에 액세스할 수 없게 됩니다. 또한 저희가 제공하는 훌륭한 맞춤 지원 서비스를 받으실 수 없습니다.

  • 위젯 추가 방법

    위젯 추가 방법

    인스펙터의 요소 섹션에 있는 위젯 요소 버튼을 클릭하여 위젯을 추가할 수 있습니다. 클릭하면 Page Builder Sandwich가 사이트에서 찾은 모든 위젯이 나열된 팝업이 나타납니다.

    일부 위젯 옵션이 제대로 작동하지 않을 수 있는 이유

    워드프레스 사이트에서 발견된 모든 위젯을 추가할 수 있지만, 설정 내에서 사용자 정의/특수 Javascript 코드를 사용하는 일부 위젯은 제대로 작동하지 않을 수 있습니다. 다음과 같은 항목을 사용하는 위젯은 작동하지 않을 수 있습니다:

    • 워드프레스에 내장된 것 이외의 색상 선택기
    • 워드프레스 미디어 라이브러리(Media Manager)를 사용하지 않는 파일 업로더 옵션
    • 대화형 지도 선택기, 글꼴 선택기 등과 같은 기타 특수 스크립트
    • 설정 값이 변경될 때 실행되는 Javascript 코드 등

    기본 워드프레스 위젯 및 이와 유사하게 생성된 위젯은 문제없이 작동합니다.

    해결 방법

    해당 특정 위젯이 반드시 작동해야 하는 경우 이를 해결할 수 있는 방법이 있습니다.

    WPMU Dev의 Custom Sidebars 플러그인을 사용하여 새 사이드바/위젯 영역을 만든 다음, 외모 > 위젯에서 일반적인 방식을 사용하여 위젯을 추가할 수 있습니다. 그런 다음 Page Builder Sandwich에서 사이드바 요소를 추가하고 필요한 위젯이 포함된 사이드바를 선택하면 됩니다.

    또 다른 대안은 Page Builder Sandwich에서 제공하는 다양한 요소와 스타일을 사용하여 원하는 효과를 직접 재현하는 것입니다.

  • 손실된 PBS .zip 파일을 복구하는 방법

    Page Builder Sandwich를 처음 구매하시면 플러그인이 포함된 .zip 파일이 컴퓨터에 자동으로 다운로드됩니다.

    이 파일을 분실하신 경우, 다음 링크에 접속하여 .zip 파일을 다시 다운로드하실 수 있습니다: https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/

    이 링크에서 라이선스를 입력하시면 라이선스 및 계정 세부 정보와 함께 Page Builder Sandwich의 .zip 파일을 다시 받으실 수 있습니다.

  • PBS가 내 테마와 호환되나요?

    PBS가 내 테마에서도 작동하나요?

    기술적으로 이는 모든 테마에서 작동해야 합니다.

    당사의 사용자와 고객들과 함께, 저희는 WordPress.org 테마 저장소의 테마, Genesis 테마, StudioPress 테마, Elegant Themes 및 ThemeForest의 테마를 포함한 수많은 테마에서 Page Builder Sandwich를 성공적으로 사용해 왔습니다.

    하지만 테마가 일반적이지 않은 방식으로 작동하여 Page Builder Sandwich가 올바르게 작동하지 못하게 막는 경우가 있을 수 있습니다. 그러한 경우가 발생하면 지원 요청을 보내주시면 문제 해결을 위해 노력하겠습니다.

  • 페이지에서 항목을 삭제하는 방법

    페이지에서 항목을 삭제하는 방법

    Page Builder Sandwich에서 항목을 삭제하려면 보통 텍스트나 요소를 선택한 다음 Delete 또는 Backspace 키를 누르기만 하면 됩니다.

    또 다른 방법으로는 인스펙터에서 삭제/제거 버튼을 클릭하는 것입니다:

    53dabdd7d7 file ZZXjBNEw56

    이 방법이 작동하지 않는 경우도 있습니다. 작동하지 않는 항목은 일반적으로 행, 열 또는 캐러셀과 같은 컨테이너입니다. 이는 콘텐츠를 삭제할 때 실수로 삭제되는 것을 방지하기 위함입니다.

    해당 항목을 삭제하려면 인스펙터의 요소 속성에 있는 삭제/제거 버튼을 클릭하세요. 예를 들어, 행을 삭제하려면 이 영역을 사용해야 합니다:

    96b535f82e file

  • PBS는 제 언어로 이용 가능한가요?

    PBS를 제 언어로 이용할 수 있나요?

    Page Builder Sandwich는 현재 다음 언어로 이용할 수 있습니다:

    • 영어
    • 히브리어
    • 스페인어

    Page Builder Sandwich를 귀하의 언어로 번역하여 기여하고 싶으시다면, 저희 Transifex 페이지를 방문해 주세요!

  • 이미지 추가 방법

    이미지 추가 방법

    이미지 추가는 매우 간단합니다. 다음 중 한 가지 방법을 이용할 수 있습니다:

    1. Windows 파일 탐색기 또는 Finder에서 브라우저 창으로 이미지를 직접 끌어다 놓거나,
    2. 미디어 요소 버튼을 클릭하고 익숙한 WordPress 미디어 관리자를 사용하여 업로드할 수 있습니다.

  • 기본 문제 해결

    기본 문제 해결

    수천 개의 테마와 다른 플러그인들이 존재합니다. 따라서 저희가 주의를 기울여 표준에 맞춰 모든 것을 구축하려고 노력하지만, 때로는 문제가 발생할 수도 있습니다.

    현재 설정에서 Page Builder Sandwich가 제대로 작동하지 않는 경우, 문제 해결을 위해 시도해 볼 수 있는 몇 가지 단계는 다음과 같습니다.

    “Edit with Page Builder Sandwich” 버튼이 나타나지 않을 때에 관한 문서 읽기

    다음 문서를 확인해 보세요:  “Edit with Page Builder Sandwich” 버튼이 나타나지 않음 그래도 해결되지 않는다면 계속 읽어보세요.

    기타 문제 해결 문서 확인

    문서의 문제 해결 카테고리에 있는 다양한 문서들을 살펴보세요.

    모든 항목이 최신 상태인지 확인

    WordPress, 플러그인, 테마 및 Page Builder Sandwich까지 모두 최신 상태인지 확인하세요. 항상 업데이트 상태를 유지하는 것이 좋습니다. 모든 항목을 최신 상태로 유지하면 사이트에 최신 버그 및 취약점 수정 사항이 적용됩니다.

    백엔드에서 콘텐츠를 편집해 보고 프론트엔드 페이지/글에 표시되는지 확인

    Page Builder Sandwich로 콘텐츠를 편집할 수 없고(오류 팝업이 표시되었을 수 있음), 현재 페이지의 콘텐츠 전체가 테마 또는 플러그인에 의해 생성된 것일 수 있습니다. 이를 확인하려면 WordPress를 사용하여 백엔드에서 평소처럼 페이지/글을 편집한 다음 저장된 콘텐츠가 프론트엔드에 표시되는지 확인하세요. 나타나지 않는다면 페이지/글 콘텐츠가 모두 자동 생성된 것이므로 PBS를 사용하여 편집할 수 없음을 의미합니다.

    플러그인을 하나씩 비활성화하면서 PBS가 다시 작동하기 시작하는지 확인

    때로는 플러그인이 Page Builder Sandwich와 충돌을 일으킬 수 있습니다. 어떤 플러그인이 충돌을 일으키는지 확인하려면 플러그인을 하나 비활성화한 다음 PBS가 다시 작동하는지 확인하세요. 활성화된 각 플러그인에 대해 이 작업을 반복합니다. PBS가 다시 작동하기 시작하여 페이지를 편집할 수 있게 된다면, 방금 비활성화한 플러그인이 PBS와 호환되지 않는 것입니다. 이러한 경우 [email protected]으로 이메일을 보내 알려주시면 문제를 해결해 드리겠습니다.

    기본 WordPress 테마로 다시 전환

    플러그인을 비활성화해도 아무 변화가 없다면 테마를 기본 WordPress 테마(Twenty-시리즈 테마)로 전환해 보세요. 다시 Page Builder Sandwich로 콘텐츠 편집을 시작할 수 있다면, 사용 중인 테마가 PBS와 호환되지 않는 것입니다. [email protected]으로 이 정보를 이메일로 보내 알려주시면 수정할 수 있도록 하겠습니다.

    시크릿 모드 시도 (드문 경우)

    드문 경우이지만, 브라우저 확장 프로그램이 웹사이트의 Javascript 코드가 올바르게 작동하지 못하도록 방해할 수 있습니다. 브라우저 확장 프로그램이 문제를 일으키는지 확인하려면 브라우저를 시크릿 모드(Chrome) 또는 비공개 브라우징 모드로 열고 PBS에 접속해 보세요. 그러면 확장 프로그램 없이 새 탭이 열립니다. 정상 작동한다면 충돌을 일으키는 확장 프로그램이 있는 것입니다.

    브라우저 확장 프로그램인 PageXray가 문제를 일으키는 것으로 확인되었습니다.

  • NextGen

    NextGen

    이전에 NextGen 및 Page Builder Sandwich와 관련된 문제가 있었습니다.

    2.12 버전 이전에는 PBS로 인해 NextGen에 오류 메시지가 표시되어 사이트에 빈 흰색 화면이 나타나는 문제가 발생했습니다. 이 문제는 2.12 버전에서 해결되었으므로 이전 버전을 사용 중이시라면 업데이트해 주시기 바랍니다.

  • 이로 인해 웹사이트 로딩 속도가 느려질까요?

    이것으로 인해 웹사이트 로딩 속도가 느려지나요?

    Page Builder Sandwich가 웹사이트 성능에 미치는 영향이 거의 없도록 철저히 최적화했습니다. 로그아웃 상태에서는 최소한 행 및 열의 CSS 스타일만 대기열에 추가되며, 사용하신 숏코드에 필요한 필수 JS 및 CSS 스크립트만 함께 대기열에 등록됩니다.

  • 숏코드 추가 방법

    숏코드 추가 방법

    숏코드 추가하기

    숏코드는 편집 중에 붙여넣거나 직접 입력할 수 있습니다. 숏코드를 입력한 후 Enter 키를 누르거나 숏코드 바깥으로 벗어나면 렌더링된 형태로 바로 표시됩니다.

    숏코드를 추가하는 또 다른 방법은 인스펙터에서 Shortcode 요소를 클릭하는 것입니다. 그러면 사이트에서 사용할 수 있는 모든 숏코드 목록이 포함된 팝업이 나타납니다. 그중 하나를 선택하거나 더블 클릭하여 삽입하세요.

    숏코드 편집하기

    숏코드는 2가지 방법으로 편집할 수 있습니다:

    1. 숏코드를 클릭하여 선택하고 인스펙터에서 숏코드 속성을 편집합니다. 숏코드에 속성 및 콘텐츠가 있는 경우 변경할 수 있는 필드로 표시됩니다. 변경 사항에 따라 숏코드가 자동으로 업데이트됩니다.
    2. 숏코드를 더블 클릭(또는 마우스를 올린 후 편집 툴바 버튼 클릭)하여 원시 숏코드를 편집합니다. 이 방법으로 전체 숏코드를 자유롭게 수정할 수 있습니다. 작업이 끝나면 Enter 키를 누르거나 다른 요소를 선택하여 숏코드를 업데이트하세요.

    내 숏코드 속성은 어디에 있나요?

    Page Builder Sandwich에서는 숏코드 속성을 감지할 수 없습니다. 따라서 직접 입력해야 합니다. 저희는 누구나 쉽게 이용할 수 있도록 시스템에 숏코드를 매핑하는 방법을 연구하고 있습니다. 앞으로의 업데이트를 기대해 주세요.

  • 마크다운 사용법

    마크다운 사용 방법

    마크다운은 기본적으로 텍스트의 서식을 추가하거나 변경하기 위해 편집 중에 입력하는 구문입니다. 단축키와 비슷하지만 키 조합을 누르는 대신 직접 입력합니다.

    다음은 Page Builder Sandwich에서 지원하는 모든 마크다운 구문 목록입니다.

    블록 요소

    ## 제목2

    ### 제목3

    최대:

    ###### 제목6

    > 인용구

    (공백 4개)사전 서식 지정 텍스트/코드

    목록

    * 글머리 기호 목록

- 글머리 기호 목록

    1. 번호 매기기 목록

1) 번호 매기기 목록

    수평선

    -

------------------------------(또는 여러 개의 대시)

    링크

    URL을 입력하면 자동으로 링크로 변환됩니다:

    https://pagebuildersandwich.com 으로 이동
    또는 라벨과 URL을 별도로 지정할 수 있습니다: 
    [Page Builder Sandwich](https://pagebuildersandwich.com 으로 이동

  • oEmbed를 사용하여 외부 콘텐츠를 임베드하는 방법

    oEmbed를 사용하여 외부 콘텐츠를 임베드하는 방법

    Page Builder Sandwich에 고유주소(permalink) URL을 붙여넣어 YouTube 동영상, Vimeo 동영상, 트윗, Reddit 댓글과 같은 다양한 사이트의 콘텐츠를 임베드할 수 있습니다.

    한 줄 전체에 URL만 단독으로 포함되어야 한다는 점에 유의하세요

    Page Builder Sandwich는 WordPress의 oEmbed 기능과 함께 작동합니다. 따라서 백엔드에서 임베드할 수 있는 URL은 모두 지원됩니다. 추가적인 oEmbed 제공자 지원을 추가하는 플러그인도 정상적으로 작동합니다.

    코덱스(codex)에서 oEmbed 제공자 목록을 확인할 수 있습니다: https://codex.wordpress.org/Embeds

  • PBS로 무엇을 편집할 수 있나요?

    PBS로 무엇을 편집할 수 있나요?

    Page Builder Sandwich를 사용하면 페이지, 글 및 사용자 정의 글 유형의 콘텐츠만 편집할 수 있습니다.

    하지만 다음과 같은 테마 템플릿 파일은 편집할 수 없습니다:

    • 전면 페이지(설정 > 읽기에서 최신 글로 설정된 경우)
    • 404 페이지
    • 카테고리 목록 페이지
    • 태그 목록 페이지
    • 검색 결과 페이지
    • 및 기타 유사한 페이지

    이렇게 생각하시면 됩니다. 프론트엔드의 관리자 표시줄에 “글 편집” 또는 “페이지 편집”이 표시된다면 해당 페이지는 편집이 가능합니다.

  • 다른 사이트의 콘텐츠를 임베드하는 방법

    다른 사이트의 콘텐츠를 임베드할 수 있는 2가지 방법이 있습니다:

    1. URL을 붙여넣어 임베드하기

    YouTube 비디오, Vimeo 비디오, Instagram 사진, Flickr 사진, 트윗, 그리고 심지어 Reddit 댓글과 같은 다양한 사이트의 콘텐츠를 해당 고유주소(permalink) URL을 직접 붙여넣어 임베드할 수 있습니다.

    https://www.youtube.com/watch?v=dQw4w9WgXcQ

    WordPress 코덱스에서 임베드 가능한 URL 목록을 확인할 수 있습니다:   https://codex.wordpress.org/Embeds

    추가 임베드 URL에 대한 지원을 추가하는 다른 플러그인을 설치할 수도 있습니다. 예를 들어, Wistia URL은 WordPress에서 기본적으로 지원되지 않지만, 해당 플러그인을 설치하여 임베드를 활성화하면 이후 PB Sandwich에서도 이를 처리할 수 있습니다.

    이 기능이 작동하려면 한 줄 전체에 URL만 포함되어야 한다는 점에 유의하세요.

    2. 임베드 코드를 붙여넣어 임베드하기

    임베드 코드를 직접 붙여넣을 수도 있습니다.

    임베드 코드는 다음과 같이 생겼습니다:

    <iframe width="420" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe>

    이 기능이 작동하려면 한 줄 전체에 임베드 코드만 포함되어야 한다는 점에 유의하세요.

    3. 미디어 버튼 사용하기

    “미디어 추가” 도구를 클릭한 다음, “URL에서 삽입” 탭에 URL을 붙여넣으세요.

    4. 사용하기

    숏코드</h2>
    WordPress에는 숏코드가 기본으로 제공되므로, 이 숏코드를 직접 입력하여 콘텐츠를 임베드할 수 있습니다. 예:
    <pre>https://www.youtube.com/watch?v=dQw4w9WgXcQ

  • 다른 플러그인과의 호환성

    다른 플러그인과의 호환성

    Page Builder Sandwich는 다른 플러그인이 문제없이 공존할 수 있도록 간섭을 최소화하여 제작되었습니다.

    하지만 때때로 예외가 있을 수 있습니다. 아래는 Page Builder Sandwich와 함께 사용할 때 특이 사항이 있는 플러그인 목록입니다. 이것이 해당 플러그인이 작동하지 않거나 호환되지 않는다는 것을 반드시 의미하는 것은 아니며, 단지 일부 동작이 다를 수 있음을 의미합니다.

    Jetpack – 마크다운 모듈

    • 프론트엔드에서 변경 사항을 저장할 때 백엔드 편집기의 마크다운 텍스트가 HTML 태그로 변환됩니다. (이 점을 알려주신 Jake Jackson 님께 감사드립니다)

    이 목록은 계속해서 업데이트될 예정입니다. 발견한 사항이 있으시면 언제든지 지원 티켓을 다음으로 보내주세요: [email protected]

  • 자신만의 아이콘을 업로드하는 방법

    자체 아이콘을 업로드하는 방법

    Page Builder Sandwich의 프리미엄 버전에서는 자체 SVG / 벡터 아이콘을 사용할 수 있습니다. 방법은 다음과 같습니다:

    1. Page Builder Sandwich로 편집을 시작합니다.
    2. 데스크톱에서 사용하려는 SVG 아이콘을 찾습니다.
    3. 아이콘의 파일 이름이 알기 쉽게 지정되었는지 확인하세요. 이 이름은 나중에 아이콘을 검색할 때 사용됩니다. 예: “apple-mac-desktop”
    4. 파일을 브라우저로 드래그하여 업로드합니다. (파일을 드롭하면 미디어 관리자가 나타나 업로드 프로세스를 시작합니다. 나타나지 않는 경우 PBS 인스펙터에서 “Add Media” 요소 버튼을 클릭하여 연 다음, 그곳에서 아이콘을 업로드하세요.)
    5. 미디어 관리자 창을 닫고 “Add Icon” 요소 버튼을 클릭하여 아이콘 선택기 팝업을 엽니다.
    6. 새로 업로드한 아이콘을 검색합니다. 예: 아이콘 파일 이름이 “apple-mac-desktop”인 경우, “apple”, “mac” 또는 “desktop”이라는 검색어를 사용하여 아이콘을 검색할 수 있습니다.

    업로드한 아이콘은 글머리 기호 목록의 글머리 기호 아이콘 및 버튼 아이콘으로도 사용할 수 있습니다.

    참고: 검색할 때 아이콘이 나타나지 않는 경우 PBS에서 파일 이름을 제대로 파싱하지 못했을 수 있습니다. 이러한 경우에는 “custom” 또는 “upload”라는 검색어를 사용하여 업로드한 아이콘을 찾을 수 있습니다.

  • PBSEditor.isEditing

    PBSEditor.isEditing

    PBS가 켜져 있고 편집 모드인지 확인합니다.

    사용법

    if ( PBSEditor.isEditing() ) {
	// 편집 중일 때 작업을 수행합니다.
}

    매개변수

    없음.

    반환값

    Boolean. 현재 편집 중이면 True, 편집 중이 아니면 False입니다.

  • pbs_iframe_header

    pbs_iframe_header

    편집 중 반응형 뷰를 렌더링하기 위해 PBS에서 사용하는 iframe 내에서 사용됩니다. 이는 <head> 태그가 닫히기 직전에 호출되며 스크립트와 스타일을 추가하는 데 사용할 수 있습니다.

    매개변수

    없음.

    예제

    add_action( 'pbs_iframe_header', 'change_bg_color' );

function change_bg_color() {
	?>
	<style>
	body {
		background-color: hotpink;
	}
	</style>
	<?php
}

  • 지원은 어디에서 받을 수 있나요?

    지원은 어디서 받을 수 있나요?

    문제가 발생한 경우 성심껏 도와드리겠습니다! 하지만 먼저 문서 페이지를 확인해 보세요. 여기서 답을 찾아 시간을 절약할 수 있습니다.

    • 버그를 제외하고는 Lite 버전에 대한 지원이 제공되지 않습니다..
    • 지원은 Premium 플러그인에 대해서만, 그리고 유효한 라이선스가 있는 경우에만 제공됩니다.
    • 라이선스는 구매 후 1년 동안 유효합니다.

    지원 문의 사항은 다음 주소로 이메일을 보내주세요:  [email protected]

  • pbs.iframe.resized

    pbs.iframe.resized

    사용자가 서로 다른 반응형 뷰 간을 전환할 때 트리거됩니다.

    매개변수

    없음.

  • pbs_stats_tracking

    pbs_stats_tracking

    PBS는 동의한 사용자가 PBS 편집기에서 저장할 때마다 사용 통계를 전송합니다. 이 필터를 사용하여 데이터 전송을 중지할 수 있습니다.

    매개변수

    $true

    Boolean. 이는 항상 true입니다.

  • PBS가 표시되지 않도록 하는 방법

    PBS가 표시되지 않도록 하는 방법

    pbs_is_editable_by_user 필터를 사용하여 PB Sandwich가 프론트엔드에 표시되지 않도록 할 수 있습니다.

    예를 들어 슬러그가 slider인 사용자 정의 포스트 타입(Custom Post Type)에서 PB Sandwich가 표시되지 않도록 하려면 functions.php에 다음 코드를 추가하면 됩니다.

    add_filter( 'pbs_is_editable_by_user', 'stop_pbs_in_sliders' );

function stop_pbs_in_sliders( $editable ) {
	if ( is_singular( 'slider' ) ) {
		return false;
	}
	return $editable;
}

    특정 페이지/글에서 PB Sandwich를 중지하려면 포스트 ID를 사용하여 확인할 수 있습니다:

    add_filter( 'pbs_is_editable_by_user', 'stop_pbs_for_123' );

function stop_pbs_for_123( $editable ) {
	global $post;
	if ( is_singular() && ! empty( $post ) ) {
		if ( '123' === $post->ID ) {
			return false;
		}
	}
	return $editable;
}

  • 지원은 어디서 받을 수 있나요?

    지원은 어디서 받을 수 있나요?

    문제가 발생하셨다면 저희가 기꺼이 도와드리겠습니다! 하지만 먼저 문서 페이지를 확인해 주세요. 이곳에서 답을 찾아 시간을 절약하실 수도 있습니다.

    • 버그를 제외하고는 Lite 버전용 지원이 제공되지 않습니다..
    • 지원은 Premium 플러그인에 대해서만, 유효한 라이선스를 보유한 경우에만 제공됩니다.
    • 라이선스는 구매 후 1년 동안 유효합니다.
    • 라이선스가 이미 만료된 경우 할인된 가격으로 라이선스를 갱신할 수 있습니다.

    지원 문의 사항은 다음 주소로 이메일을 보내주세요:  [email protected]

  • pbs.option.changed

    pbs.option.changed

    옵션(인스펙터)이 변경되었을 때 트리거됩니다.

    매개변수

    없음.

  • PageBuilderSandwich:: get_all_shortcodes

    사이트에서 사용 가능한 모든 숏코드 태그를 가져옵니다.

    사용법

    $all_shortcodes = PageBuilderSandwich::get_all_shortcodes()

    매개변수

    없음.

    반환값

    배열. 감지된 모든 숏코드 태그의 배열입니다.

  • pbs_add_builder_wrapper_pre

    pbs_add_builder_wrapper_pre

    PBS >= 4.3

    PBS는 게시물의 콘텐츠 영역을 식별하기 위해 래퍼를 추가합니다. 이 작업은 래퍼가 배치되기 전에 호출됩니다.

    매개변수

    $content

    문자열. 래퍼가 적용된 게시물 콘텐츠입니다.

  • pbs_is_editable_by_user

    pbs_is_editable_by_user

    PBS >= 4.3

    프런트엔드에서 PBS를 로드할지 여부와 사용자가 PBS를 사용하여 글을 편집할 수 있도록 허용할지 여부에 대한 결정을 재정의합니다.

    매개변수

    $is_editable

    Boolean. PBS로 글을 편집할 수 있어야 하는 경우 True입니다. 그렇지 않은 경우 False입니다.

    예시

    portfolio post_types가 PBS로 편집되지 않도록 설정

    add_filter( 'pbs_is_editable_by_user', 'disallow_portfolios' );

function disallow_portfolios( $is_editable ) {
	global $post;
	if ( $post ) {
		if ( 'portfolio' === get_post_type( $post ) ) {
			return false;
		}
	}
	return $is_editable;
}

  • pbs_iframe_footer

    pbs_iframe_footer

    편집 중 반응형 뷰를 렌더링하기 위해 PBS에서 사용하는 iframe 내에서 사용됩니다. 이는 <body> 태그가 닫히기 직전에 호출되며 스크립트 및 스타일을 추가하는 데 사용할 수 있습니다.

    매개변수

    없음.

  • pbs_add_builder_wrapper

    pbs_add_builder_wrapper

    PBS는 게시물의 콘텐츠 영역을 식별하기 위해 래퍼(wrapper)를 추가합니다. 이는 래퍼가 배치된 후 호출됩니다.

    매개변수

    $content

    String. 래퍼가 적용된 게시물 콘텐츠입니다.

  • PageBuilderSandwich::instance

    PageBuilderSandwich::instance

    PBS >= 4.3

    PageBuilderSandwich의 인스턴스를 가져옵니다

    사용법

    $pbs = PageBuilderSandwich::instance()

    매개변수

    없음.

    반환값

    PageBuilderSandwich 객체. PBS 클래스의 현재 인스턴스입니다.

  • PageBuilderSandwich:: is_editable_by_user

    현재 글의 프론트엔드에 PBS가 로드되었는지 확인하는 데 사용됩니다

    사용법

    PageBuilderSandwich::is_editable_by_user()

    매개변수

    없음.

    반환값

    Boolean. PBS가 글을 편집할 수 있는 경우 true, 그렇지 않은 경우 false입니다.

  • pbs_save_style

    pbs_save_style

    글에 대해 저장되는 CSS 스타일을 수정하기 위한 필터입니다. PBS 편집기에서 저장이 시작될 때 호출됩니다.

    매개변수

    $style

    String. 저장을 위해 전송된 CSS 스타일입니다.

    $post_id

    Int. 저장 중인 글의 ID입니다.

  • pbs.init

    pbs.init

    PBS 편집기 로드가 완료되었을 때 호출됩니다 (사용자가 편집 시작 버튼을 클릭할 때는 호출되지 않음)

    예제

    PBS가 로드된 후 작업 수행

    wp.hooks.addAction( 'pbs.init', function() {
	console.log( 'PBS is ready!' );
}

  • pbs_shortcodes_to_hide_in_picker

    pbs_shortcodes_to_hide_in_picker

    PBS의 숏코드 선택기에서 숨길 숏코드 태그 목록입니다. 이미 사용 중단되었거나 사용자에게 숨기려는 숏코드가 선택기 팝업에 나타나는 경우에 사용하세요.

    매개변수

    $shortcodes

    Array. 숏코드 태그 배열입니다.

    예제

    선택기에서 숏코드를 숨깁니다.

    add_filter( 'pbs_shortcodes_to_hide_in_picker, 'hide_embed_shortcode' );

function hide_embed_shortcode( $shortcodes ) {
	$shortcodes[] = 'embed';
	return $shortcodes;
}

  • pbs_localize_frontend_scripts

    pbs_localize_frontend_scripts

    프론트엔드의 pbsFrontendParams 객체에 Javascript 속성을 추가합니다. pbsFrontendParams 객체는 사용자가 로그인하여 편집 중인지 여부와 관계없이 프론트엔드에서 사용할 수 있습니다.

    매개변수

    $params

    Array. window 수준의 Javascript 변수 pbsFrontendParams에서 사용할 수 있게 되는 키와 값의 배열입니다.

    예제

    프론트엔드에서 변수에 접근할 수 있도록 만들기

    add_filter( 'pbs_localize_frontend_scripts, 'add_my_property' );

function add_my_property( $params ) {
	
	// 자바스크립트의 pbsFrontendParams.myProperty에서 사용할 수 있습니다.
	$params['myProperty'] = 'My Property';
	return $params;
}

  • Javascript 훅

    Javascript Hooks

    Page Builder Sandwich의 대부분은 Javascript로 이루어져 있으며, 개발자가 페이지 빌더를 확장하고 더 많은 기능을 추가할 수 있도록 다양한 메서드를 추가했습니다.

    개발자들의 편의를 위해 WordPress가 동작하는 방식, 즉 훅(hook)을 본떠 구현했습니다!

    WordPress에서는 일반적으로 add_filter() 및 add_action() 함수를 사용하여 WP의 동작을 수정하거나 추가합니다. 마찬가지로 PBS에서도 wp.hooks.addFilter() 및 wp.hooks.addAction()을 사용할 수 있습니다.

    사용 방법 또한 동일합니다. 필터를 사용하여 항목을 수정하고, 액션을 사용하여 추가 동작을 수행합니다. 이 두 함수 호출은 Javascript에서 실행된다는 점을 제외하면 PHP에서의 해당 기능과 기본적으로 동일합니다.

    PHP 훅과 Javascript 훅이 혼동되지 않도록 Javascript 훅에는 “period-case”(신조어) 방식을 적용하여 이름을 지정했습니다. PHP 훅은 모두 스네이크 케이스(snake case)를 사용합니다:

    • pbs.save.payload – “period-case”, JS 훅
    • pbs_save_content_data – snake case, PHP 훅

    모든 훅을 살펴보려면 왼쪽 메뉴의 Javascript Actions 및 Javascript Filters 카테고리를 참조하세요.

    크레딧

    궁금하신 분들을 위해 알려드리자면, Javascript에서 이러한 유용한 훅 호출을 추가하기 위해 https://github.com/carldanley/WP-JS-Hooks를 사용하고 있습니다.

  • pbs.save.payload

    pbs.save.payload

    편집기가 콘텐츠를 저장하기 직전에 호출됩니다. 저장 중에 전송할 추가 데이터를 배치하는 데 사용할 수 있습니다(이 작업은 데이터를 저장하지 않고 Ajax를 통해 백엔드로 전송하기만 합니다).

    매개변수

    payload

    FormData 객체. 저장을 위해 Ajax를 통해 전송되는 데이터입니다.

    예제

    wp.hooks.addAction( 'pbs.save.payload', function( payload ) {

	// 저장 중에 전송할 데이터를 추가합니다.
	payload.append( 'my_data', 'My Data' );
}

  • pbs_enqueue_scripts

    pbs_enqueue_scripts

    PBS와 함께 스크립트 또는 스타일을 등록(enqueue)합니다. 이는 글이 PBS로 편집 가능할 때만 호출됩니다. 페이지가 PBS로 편집 가능하지 않은 경우에는 전혀 사용되지 않습니다.

    매개변수

    없음.

    예제

    PBS가 로드될 때 my-script.js도 함께 등록합니다.

    add_action( 'pbs_enqueue_scripts, 'add_my_script' );

function add_my_script() {
	wp_enqueue_script( 'my-script' , plugins_url( 'js/my-script.js', __FILE__ ) );
}

  • pbs_localize_scripts

    pbs_localize_scripts

    프런트엔드의 pbsParams 객체에 Javascript 속성을 추가합니다. pbsParams 객체는 사용자가 로그인되어 있고 페이지를 편집할 수 있는 권한이 있을 때 프런트엔드에서 사용할 수 있습니다.

    이 변수는 또한 nonce, 로드된 모든 숏코드 목록, 번역 문자열과 같이 편집 중에 PBS에서 사용하는 많은 속성을 전달합니다.

    매개변수

    $params

    배열(Array). 창(window) 수준의 Javascript 변수 pbsParams에서 사용할 수 있게 될 키와 값의 배열입니다.

    예제

    감지되지 않은 숏코드를 편집기에 추가

    add_filter( 'pbs_frontend_scripts, 'add_my_shortcode' );

function add_my_shortcode( $params ) {
	$params['shortcodes'][] = 'my_shortcode';
	return $params;
}

  • 프리미엄 플러그인은 어디에서 다운로드할 수 있나요?

    프리미엄 플러그인은 어디에서 다운로드할 수 있나요?

    저장해 둔 프리미엄 플러그인을 어디에 두었는지 찾을 수 없는 경우, 여기로 이동하여 이메일 주소를 입력하면 복구할 수 있습니다. 플러그인이 이메일로 전송됩니다.

    https://dashboard.freemius.com/license-recovery/203/page-builder-sandwich/

  • 동일 페이지 스크롤 앵커 링크 추가하기

    동일 페이지 스크롤 앵커 링크 추가하기

    이 기능은 프리미엄 기능이며 버전 4.0.1 이상에서 사용할 수 있습니다.

    동일 페이지 스크롤 앵커 링크는 동일한 페이지 내의 특정 위치를 가리키는 링크입니다. 동일 페이지 링크를 클릭하면 브라우저가 지정된 영역으로 스크롤됩니다.

    동일 페이지 앵커 링크를 만들려면 두 가지가 필요합니다:

    1. 요소의 사용자 정의 클래스 또는 사용자 정의 ID, 그리고
    2. 해당 사용자 정의 클래스 또는 ID를 참조하는 링크나 버튼

    1. 요소에 사용자 정의 클래스 또는 사용자 정의 ID 추가

    페이지 하단 근처에 있는 요소를 선택한 다음 속성을 엽니다. 고급 영역에서 “go_here“

    2. 사용자 정의 클래스 또는 ID를 참조하는 링크나 버튼

    이제 페이지 상단 근처에 링크를 만들거나 버튼 요소를 추가합니다. 링크로 URL을 추가하는 대신, “go_here”를 사용자 정의 클래스로 추가한 경우 “.”을 포함하여 “.go_here“를 사용하고, 사용자 정의 ID로 추가한 경우 “#”을 포함하여 “#go_here“를 사용합니다.

    페이지를 저장한 후 링크/버튼을 클릭하면 이제 페이지 하단의 요소를 향해 부드럽게 스크롤됩니다.

    이 방법을 사용하여 명명된 앵커(Named Anchor)를 타겟팅할 수도 있습니다

    다음과 같은 명명된 앵커는

    <a name="go_here"></a>

    “#”을 포함한 “#go_here“로 링크를 추가하여 타겟팅할 수도 있습니다.

    기타 용도

    클래스 이름이나 ID를 사용하여 타겟팅하는 한 편집기 영역 외부를 포함하여 페이지 내의 다른 모든 영역도 타겟팅할 수 있습니다.

  • pbs_saved_content

    pbs_saved_content

    콘텐츠가 저장된 후에 호출됩니다. 이는 PBS 편집기에서 저장이 시작되었을 때 호출됩니다.

    매개변수

    없음

  • pbs_save_content_data

    pbs_save_content_data

    저장될 포스트 데이터를 수정하기 위한 필터입니다. PBS 편집기에서 저장이 시작될 때 호출됩니다.

    매개변수

    $post_data

    배열. 저장될 최종 포스트 데이터로, 이후 wp_update_post()에 직접 전달됩니다.

    $_POST

    배열. 저장을 위해 편집기에서 전송된 원시 포스트 데이터입니다. 이미 nonce 검증을 거쳤습니다.

    $post_id

    정수. 저장 중인 포스트의 ID입니다.

    예제

    add_filter( 'pbs_save_content_data', 'save_always_as_draft', 10, 3 );

function save_always_as_draft( $post_data, $_post, $post_id ) {

	// For some reason, we always want the post to be a draft.
	$post_data['post_status'] = 'draft';
	
	return $post_data;
}

  • 판매 중인 테마에 PBS 번들링하기

    판매하는 테마에 PBS 번들 포함하기

    테마 개발자라면 테마에 PBS를 포함하여 제품의 가치를 크게 높일 수 있습니다.

    [email protected]으로 문의해 주세요. 함께 협업합시다!

  • pbs_pre_save_content

    pbs_pre_save_content

    콘텐츠가 저장되기 직전에 호출됩니다. 이는 PBS 편집기에서 저장이 시작되었을 때 호출됩니다.

    매개변수

    없음

  • CloudFlare & Rocket Loader 호환성

    CloudFlare 및 Rocket Loader 호환성

    CloudFlare는 널리 사용되는 무료 DNS CDN입니다. 매우 훌륭한 서비스이지만, 현재 PBS는 Rocket Loader 기능과 관련하여 문제가 발생하고 있습니다. Rocket Loader는 자바스크립트 파일의 로드 시간을 단축하지만, PBS 스크립트의 종속성과 호출 순서를 꼬이게 만듭니다. Rocket Loader가 활성화되어 있으면 Page Builder Sandwich의 편집 버튼이 나타나지 않습니다(자바스크립트 콘솔 오류도 표시되지 않음).

    Rocket Loader를 끄려면 CloudFlare 계정에 로그인한 후 해당 도메인의 설정으로 이동하세요. 그런 다음 속도(Speed) 설정으로 이동합니다:

    e3e66a8071 file

    그런 다음 아래로 스크롤하여 Rocket Loader 설정으로 이동한 뒤, 해당 설정이 꺼짐(off)으로 되어 있는지 확인하세요:

    e4dff5b8c0 file tPnWvP09FF

    이를 끈 후에는 캐시(Cache) 설정에서 반드시 전체 사이트의 캐시를 삭제(purge)해야 합니다:

    db1850599b file hSGiBXG0LF

    모든 캐시를 삭제한 후 페이지를 새로고침하면 Page Builder Sandwich 편집 버튼이 표시될 것입니다.
    fd8786bba0 file AJdoCLbOcB

  • 반응형 모드 사용 방법

    반응형 모드 사용 방법

    버전 4.0부터 이제 편집하는 동안 데스크톱, 태블릿, 모바일 폰 보기 사이를 전환할 수 있습니다! 이를 반응형 모드라고 합니다. 반응형 모드에서는 더 작은 화면에서 사이트가 어떻게 보일지 시뮬레이션할 수 있도록 사이트 크기가 축소됩니다.

    제한된 편집 기능

    태블릿 또는 모바일 폰 보기로 사이트를 볼 때 편집 기능이 일부 제한됩니다. 이 상태에서는 다음과 같은 작업만 수행할 수 있습니다:

    • 텍스트 편집
    • 텍스트 서식 도구 모음을 사용하여 텍스트 스타일 지정
    • 요소 및 행의 일부 여백 조정 *
    • 태블릿 또는 모바일 폰에서 행 숨기기

    * PBS는 요소 및 행에 일부 반응형 스타일을 적용하므로 특정 여백은 조정할 수 없습니다.

    다음은 수행할 수 없는 작업들입니다:

    • 요소 추가, 삭제, 드래그하여 이동
    • 요소 속성 보기
    • 이미지, 아이콘, 행 및 기타 크기 조정 가능한 요소의 크기 조정

    특정 화면 크기에 따른 여백 조정

    태블릿 또는 모바일 폰 보기로 사이트를 볼 때 조정한 모든 여백은 현재 보기와 그보다 작은 보기에만 적용됩니다. 이를 통해 전체 데스크톱 버전과 별개로 더 작은 화면에서 디자인이 더 보기 좋도록 미세하게 조정할 수 있습니다.

    이해를 돕기 위한 예시는 다음과 같습니다.

    1. 태블릿 모드에서 사이트를 보고 제목의 여백을 조정하면 해당 조정 사항은 태블릿 화면에만 적용됩니다. 이는 모바일 폰 화면에도 함께 적용됩니다. 데스크톱 모드로 돌아가면 원래의 여백이 복원됩니다.
    2. 이제 모바일 폰 모드로 이동하여 동일한 여백을 다시 조정하면 해당 조정 사항은 모바일 폰 화면에만 적용됩니다. 결과적으로 데스크톱, 태블릿, 모바일 폰마다 서로 다른 여백을 갖게 됩니다.

    이는 여백 조정에만 적용되며, 텍스트 변경이나 텍스트 스타일 변경 사항은 모든 화면 크기에 적용됩니다.

    태블릿 또는 모바일 폰 크기에서 콘텐츠 숨기기

    태블릿 또는 모바일 폰 보기로 볼 때 마우스를 올리면 행에 새로운 “눈” 도구 모음 버튼이 나타납니다. 이 버튼을 클릭하면 현재 화면 크기에서 행을 표시하거나 숨길 수 있습니다.

    숨겨진 행은 편집이 완료되었을 때 숨겨질 것임을 나타내기 위해 편집 중에 약간 투명해집니다.

    이 기능은 행에만 사용할 수 있습니다.

  • pbs_save_content

    pbs_save_content

    저장될 글의 내용을 수정하는 필터입니다. 이 필터는 PBS 편집기에서 저장이 시작될 때 호출됩니다.

    매개변수

    $content

    문자열(String). 저장될 최종 글 내용입니다.

    $post_id

    정수(Int). 저장 중인 글의 ID입니다.

  • Varnish 캐시

    Varnish Cache

    Varnish Cache를 사용하는 동안 변경 사항을 저장한 후에도 여전히 이전 콘텐츠가 표시된다면, Varnish Cache가 자동으로 삭제되지 않았을 가능성이 있습니다.

    캐시를 삭제할 수 있는 몇 가지 WordPress 플러그인이 있습니다: https://wordpress.org/plugins/search/varnish+cache/

    그래도 해결되지 않는다면, 터미널에서 다음 명령을 실행하여 Varnish Cache를 수동으로 제거(purge)할 수도 있습니다:

    curl -X PURGE http://mysite.com/my-page/

  • 마크다운 사용하기

    마크다운 사용하기

    마크다운은 기본적으로 텍스트의 서식을 추가하거나 변경하기 위해 편집 중에 입력하는 구문입니다. 단축키와 비슷하지만, 키 조합을 누르는 대신 직접 입력합니다.

    다음은 Page Builder Sandwich에서 지원하는 모든 마크다운 구문 목록입니다.

    블록 요소

    (공백에 유의하세요)

    # 제목1
    ## 제목2

    다음까지:

    ###### 제목6 
    > 인용구 
    (공백 4개)서식 유지 텍스트/코드

    목록

    * 글머리 기호 목록  - 글머리 기호 목록 
    1. 번호 매기기 목록  1) 번호 매기기 목록

    가로선

    -  ------------------------------(또는 여러 개의 대시)

    링크

    URL을 입력하면 자동으로 링크로 변환됩니다:

    https://pagebuildersandwich.com 으로 이동
    더미 콘텐츠

    “lorem”을 입력한 후 Tab 키를 누르면 더미 텍스트 콘텐츠가 생성됩니다.

  • 플러그인을 어떻게 비활성화하나요?

    플러그인을 비활성화하려면 어떻게 해야 하나요?

    PBS를 비활성화하려면 먼저 대시보드 / 백엔드에 로그인한 다음 플러그인 > 설치된 플러그인으로 이동합니다:

    07b25420a6 file LRa1eOB7Vw

    플러그인 페이지에서 플러그인 목록을 아래로 스크롤하여 Page Builder Sandwich를 찾습니다. 이름 바로 아래에서 편집 또는 라이선스 변경 등과 같은 다른 링크와 함께 비활성화 링크를 확인할 수 있습니다(사이트에 따라 다를 수 있음). 플러그인을 비활성화하려면 비활성화 링크를 클릭합니다.

    555d96ed73 file eYVN9yZNif

  • PBS 비디오 투어

    PBS 비디오 투어

    다음은 PBS 비디오 투어입니다:

  • 요소에 등장 애니메이션 추가하기

    요소에 등장 애니메이션 추가하기

    대부분의 요소(숏코드는 제외)에서 화면에 요소가 보일 때 재생되는 등장 애니메이션을 지정할 수 있습니다.

    이렇게 하려면 요소 위에 마우스를 올려 툴바가 나타나게 한 다음, 톱니바퀴 버튼을 클릭하세요.

    5c220b4ac9 file Odem5RLPok

    그러면 인스펙터가 표시됩니다. Animations 영역으로 이동하여 연 다음, 원하는 애니메이션을 선택하세요.

    d2675375dd file bKhEnSFBNj

    애니메이션을 선택하면 미리보기를 위해 재생됩니다. 제공된 다른 옵션을 사용하여 애니메이션을 더욱 세밀하게 조정할 수 있습니다.

    애니메이션은 사용자가 스크롤하여 요소가 화면에 나타날 때만 재생됩니다. 페이지에 도달했을 때 요소가 이미 보이는 상태라면 애니메이션이 작동하지 않습니다.

  • 플러그인을 삭제하면 모든 페이지가 사라지나요?

    플러그인을 삭제하면 내 페이지가 모두 사라지나요?

    아니요, 그렇지 않습니다! 모든 페이지와 콘텐츠는 사이트에 그대로 유지됩니다. 즉, 무료 버전에서 프리미엄 버전으로 업그레이드할 때나 단지 테스트를 진행할 때도 안전하게 PBS를 비활성화할 수 있습니다.

    하지만 모든 것이 동일하게 보이지는 않습니다. PBS에는 더 정교한 일부 요소에 필요한 추가 스타일과 스크립트가 포함되어 있으므로 페이지의 일부 항목이 변경된 것을 확인할 수 있습니다.

    다음은 PBS를 비활성화해도 유지되는 항목입니다:

    • 텍스트 스타일
    • 행 및 열
    • 배경 이미지
    • 원형 이미지

    다음은 PBS를 비활성화하면 사라지는 항목입니다:

    • 행 및 열 반응형 기능 (작은 화면에서 원래처럼 멋지게 보이지 않을 수 있습니다)
    • 패럴랙스 배경 및 기타 배경 효과
    • 그림자
    • 캐러셀

  • 새로고침 후 변경 사항이 표시되지 않습니다

    새로고침 후 변경 사항이 표시되지 않습니다

    페이지의 변경 사항을 저장했으나…

    1. 새로고침 후 이전 내용으로 되돌아가거나,
    2. 다른 브라우저(또는 시크릿 모드)에서 페이지를 볼 때 여전히 이전 콘텐츠가 표시되는 경우;

    가능성 1: 캐싱

    이는 저장을 했음에도 캐싱 솔루션에서 저장된 데이터를 비우는 동작이 트리거되지 않았음을 의미할 수 있습니다.

    W3 Total Cache와 같은 캐싱 플러그인, Memcached나 Redis와 같은 서버 측 캐싱 소프트웨어, 또는 CloudFlare와 같은 DNS 캐싱 등의 캐싱 솔루션을 사용 중인 경우 저장된 콘텐츠가 지워지지 않았을 수 있습니다.

    이 경우인지 확인하는 한 가지 방법은 백엔드에서 (일반적인 방식으로) 페이지를 편집한 다음 프런트엔드에서 페이지를 확인하는 것입니다. 콘텐츠가 변경되지 않았다면 캐시가 자동으로 삭제되지 않았을 수 있습니다.

    일부 비-워드프레스 캐싱 솔루션에는 현재 캐시를 삭제하거나 비우는 데 도움이 되는 무료 워드프레스 플러그인이 제공되며, 워드프레스 솔루션에는 대개 이를 위한 버튼이나 옵션이 있습니다.

    가능성 2: 오류 발생

    저장하는 동안 일종의 PHP 오류가 발생했을 수도 있습니다.

    이런 현상이 발생하고 있는지 확인하려면 (가급적 Chrome에서) 개발자 콘솔을 열고 네트워크(Network) 탭으로 이동하세요. 그곳에서 PBS의 변경 사항을 저장하면 admin-ajax.php로 향하는 여러 항목이 표시됩니다. 이 항목이 빨간색으로 표시되면 오류가 발생했음을 나타냅니다. 다음과 같은 내용이 표시되는지 확인하세요:

    38a8eb3ad5 file QhA6mhZ3Fo

    이러한 경우 문제를 확인하고 해결해 드릴 수 있도록 필요한 로그인 자격 증명과 함께 [email protected]으로 이메일을 보내주시기 바랍니다.

    가능성 3: Wordfence 방화벽

    Wordfence 호환성에 관한 문서를 여기에서 확인하세요: http://docs.pagebuildersandwich.com/article/214-wordfence-firewall-setup-compatibility

  • 라이선스 활성화에 문제가 있습니다

    라이선스 활성화에 문제가 발생했습니다

    참고: 이 내용은 Envato 고객에게는 적용되지 않습니다

    라이선스를 활성화할 때 오류가 발생하는 경우 시도해 볼 수 있는 몇 가지 방법이 있습니다..

    1. 플러그인을 비활성화한 후 다시 활성화

    이는 주로 상위 버전으로 업데이트하는 사용자에게 발생합니다. 플러그인 파일을 수동으로 직접 업데이트하여 전체 업데이트 또는 비활성화-활성화 단계를 건너뛴 경우, 일부 프로세스가 제대로 실행되지 않았을 수 있습니다. 플러그인을 비활성화했다가 다시 활성화한 후 라이선스를 다시 입력해 보세요.

    2. Freemius 캐시 지우기

    v3.2부터 Page Builder Sandwich는 Freemius와 통합되었습니다. Freemius 데이터를 지우면 라이선스 활성화 오류가 해결되는 경우가 있었습니다. 해결 방법은 다음과 같습니다.

    대시보드로 이동한 다음 URL을 http://yoursite.com/wp-admin/admin.php?page=freemius 로 변경합니다(사용자의 사이트에 맞게 URL을 변경해야 합니다). 아래와 같은 화면이 나타나면 올바른 위치에 오신 것입니다.

    eccf3dd364 file SmWPmZQS5b

    Delete All Accounts 버튼을 클릭한 다음 Clear API Cache 버튼도 클릭합니다. 이 작업을 수행한 후 라이선스 키를 다시 입력해 보세요.

    3. 그래도 작동하지 않는 경우 문의하기

    문제가 해결되지 않으면 [email protected]으로 문의해 주시고, 문제에 대한 세부 정보와 사이트 정보를 알려주시기 바랍니다.

  • 컨테이너 밖으로 이미지가 살짝 튀어나오게 만들기

    이미지를 컨테이너 바깥으로 튀어나오게 만들기

    여기에 배경색이 있는 행을 추가하고 그 안에 이미지를 추가했습니다. 다음과 같습니다:

    7a1ad1cd25 file 029qnDthFO컨테이너 위로 이미지가 “삐져나오게” 하려면 이동하려는 요소 위로 마우스를 가져갑니다. 그런 다음 외곽선이 나타나면 외곽선 위쪽 너머로 마우스를 이동합니다. 현재 상단 여백(margin) 값이 표시됩니다:

    3bb498880e file FqLy7ZTTHD

    상단 여백을 클릭하고 위로 드래그하여 여백을 줄이고 음수 값으로 만듭니다:

    4a89f1e31e file Zm8Z0aOtCs

    이제 이미지가 행 바깥으로 “삐져나왔습니다”!

    요소가 행 너머로 벗어날 때 잘리는 경우, 해당 행의 속성 검사기(properties inspector)를 열고 Advanced 옵션에서 overflow hidden 옵션을 끕니다:

    0787678afd file pUDej5DLsQ

  • Lorem Ipsum 플레이스홀더/더미 텍스트 삽입

    로렘 입숨 플레이스홀더/더미 텍스트 삽입

    더미 텍스트를 빠르게 추가하려면 “lorem” 단어를 입력한 다음 Tab 또는 Enter 키를 눌러 로렘 입숨 플레이스홀더 텍스트를 빠르게 추가하세요:

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. At dolor sed numquam? Sapiente autem adipisci, minus expedita enim, suscipit laboriosam deleniti possimus sequi pariatur explicabo numquam alias atque officia sit.

  • 캐싱 & Minify 플러그인 (W3 Total Cache, WP Super Cache, Comet Cache, Better WordPress Minify 등)

    캐싱 및 축소(Minify) 플러그인(W3 Total Cache, WP Super Cache, Comet Cache, Better WordPress Minify 등)

    Page Builder Sandwich는 모든 캐싱 플러그인과 호환됩니다. 그러나 해당 플러그인의 축소(minify) 또는 캐싱 기능을 활성화할 경우 몇 가지 문제가 발생할 수 있습니다.

    로그인한 사용자에 대해 축소 기능이 비활성화되어 있는지 확인하기만 하면 정상적으로 작동합니다.

    여기에서는 W3 Total Cache 설정만 보여드리지만, 다른 캐싱 및 축소 플러그인에도 유사한 설정이 있습니다.

    W3 Total Cache

    d7dce04be3 file EG564wdzqj

    Performance > Page Cache 아래에서 Don’t cache pages for logged in users가 선택되어 있는지 확인하세요.

    134a30cd2b file ONknBiLRav

    축소 기능을 사용 중인 경우 Performance > Minify 아래에서 Disable minify for logged in users가 선택되어 있는지 확인하세요.

  • YouTube/Twitter/Facebook/외부 콘텐츠 임베드하기

    YouTube/Twitter/Facebook/외부 콘텐츠 임베드하기

    외부 웹사이트의 콘텐츠를 임베드하려면 URL을 붙여넣은 후 Enter 키를 누르기만 하면 됩니다. 예를 들어 YouTube의 다음 URL을 복사하여 붙여넣을 수 있습니다:

    https://www.youtube.com/watch?v=dQw4w9WgXcQ

    <iframe> 임베드 코드를 붙여넣어 Iframe 임베드도 가능합니다. 예를 들어 다음 임베드 문자열을 복사하여 붙여넣어 보세요:

    <iframe width=”560″ height=”315″ src=”https://www.youtube.com/embed/dQw4w9WgXcQ?rel=0″ frameborder=”0″ allowfullscreen></iframe>

    WordPress Codex(https://codex.wordpress.org/Embeds)에 나열된 사이트 및 oEmbed가 활성화된 모든 사이트의 URL을 임베드할 수 있습니다.

  • 패딩, 마진 및 기타 스타일이 요소에 적용되지 않음

    요소에 패딩, 마진 및 기타 스타일이 적용되지 않는 경우

    상하 마진 또는 패딩 핸들을 드래그해도 요소의 마진/패딩이 변경되지 않는다면, 스타일 변경 사항을 강제로 덮어쓰는 다른 스타일이 있을 수 있습니다. 배경, 테두리를 변경할 수 없거나 투명한 이미지에 항상 배경색이 적용되는 경우에도 이런 현상이 발생할 수 있습니다.

    문제를 찾으려면 브라우저의 검사기(Inspector)를 열고 해당 요소를 검사하세요. 해당 요소의 스타일을 살펴봅니다. 다음과 같은 내용이 보인다면:

    ca574b601b file pAMRmfV9DQ

    테마 또는 플러그인으로 인해 요소에 다른 스타일이 적용되지 않는 것이 확실합니다. 스타일시트 위로 마우스를 올려 어떤 테마/플러그인에서 비롯된 것인지 확인하세요.

    이 문제를 해결하려면 스타일의 “! important” 부분을 제거하세요. 그러면 스타일을 다시 적용할 수 있습니다. 이를 수정하려면 테마나 플러그인 개발자에게 문의해야 할 수도 있습니다.

  • 페이지에서 헤더 또는 메뉴를 제거하는 방법

    페이지에서 헤더 또는 메뉴를 제거하는 방법

    참고: 기본적으로 헤더는 프런트페이지에서만 제거됩니다.

    페이지에서 헤더나 메뉴를 제거하려면 Jetpack과 같이 사용자 정의 CSS를 추가할 수 있는 플러그인이 필요합니다.

    헤더를 제거하려면 글의 글 ID(post ID)가 필요하며, 그런 다음 이 사용자 정의 CSS를 추가하세요(여기서 9999를 해당 글 ID로 변경):

    body.page-id-9999 #masthead {
	display: none;
}

    페이지에서 메뉴를 제거하려면(여기서 9999를 해당 글 ID로 변경):

    body.page-id-9999 #header-wrapper {
	display: none;
}

    또는 홈 페이지만 메뉴를 제거하려는 경우:

    body.page-id-9999 #header-wrapper {
 	display: none;
}

  • 편집 중에 “세션이 만료되었습니다” 팝업이 계속 뜹니다

    편집할 때 “세션이 만료되었습니다” 팝업이 계속 나타납니다

    Page Builder Sandwich는 사용자가 워드프레스에 계속 로그인되어 있는지 주기적으로 확인합니다. 이는 저장 버튼을 누를 때 변경 사항이 정상적으로 저장되도록 하기 위해 수행됩니다. 또한 글 잠금 및 자동 저장에도 사용됩니다.

    이 확인 작업은 WordPress Heartbeat API를 사용하며, 이 API는 다시 브라우저 쿠키 및 세션을 사용합니다. 따라서 편집하는 동안 “세션이 만료되었습니다” 팝업이 계속 표시된다면 워드프레스가 사용자를 제대로 추적하지 못하도록 방해하는 요소가 있을 수 있습니다. 이 문제를 해결하기 위해 시도해 볼 수 있는 방법은 다음과 같습니다.

    캐시 비우기

    캐싱 플러그인이 설치되어 있거나 DNS 캐싱, 또는 어떤 형태의 캐싱이라도 적용되어 있다면 모두 지우세요. 브라우저 캐시도 함께 지우세요. 사이트의 최신 스크립트가 로드되지 않고 있을 가능성이 있습니다.

    쿠키 삭제

    쿠키가 손상되었을 가능성도 있으며, 이는 브라우저 설정에서 브라우저 쿠키를 삭제하여 쉽게 해결할 수 있습니다. 일반적으로 브라우저 캐시를 지우는 옵션 근처에 있습니다.

    사이트 URL 설정 확인

    설정 > 일반으로 이동하여 설정을 확인하세요. WordPress 주소 (URL) 및 사이트 주소 (URL) 설정을 찾으세요. 해당 항목의 도메인과 프로토콜은 실제 도메인과 일치해야 합니다. 예를 들어 한쪽은 “http://”로 되어 있는데 실제 사이트에 “https://”로 접속하는 경우, 설정도 “https://”여야 합니다. 또 다른 흔한 문제는 둘 중 한 URL에는 “www”가 있고 다른 한쪽에는 없는 경우입니다.

    다음과 같이 일치해야 합니다.

    a96f7d7412 file jRzgrZO0et

    또는:

    e00b20cbb4 file dTXaKDFHET

    이를 해결하려면 설정 > 일반에서 설정을 변경할 수 있습니다. 해당 설정을 편집할 수 없는 경우, FTP에 접속하여 wp-config.php 파일을 열고 다음 줄을 추가하세요.

    define( 'WP_HOME', 'http://example.com' );
define( 'WP_SITEURL', 'http://example.com' );
    그 후 캐시와 쿠키를 삭제하고 다시 시도하세요.

    Heartbeat API가 비활성화되어 있지 않은지 확인

    마지막으로 워드프레스의 Heartbeat API를 강제로 비활성화하는 플러그인(또는 테마)이 있는지 확인하세요. 이 기능은 매우 유용하므로 활성화된 상태로 유지하는 것을 권장합니다.

  • 배경 이미지에 색상 입히기

    배경 이미지에 색상 입히기

    행과 배경에 배경 이미지를 추가할 수 있습니다. 뿐만 아니라 배경 이미지에 색조를 더해 디자인과 더욱 잘 어울리도록 만들 수도 있습니다.

    예를 들어, 여기에 배경 이미지 위에 흰색 텍스트가 겹쳐진 행이 있습니다. 선택한 배경 이미지 때문에 지금은 텍스트를 확인하기가 다소 어렵습니다.

    2b91fa8f2a file mzgaf4V044

    이를 더 보기 좋게 만들기 위해 배경 이미지에 색상을 추가할 수 있습니다. 이렇게 하려면 행 위에 마우스를 올린 다음, 행의 톱니바퀴 아이콘을 클릭하여 속성을 엽니다. Background 옵션으로 이동한 후 Background Image Tint를 켭니다.

    bafd9f5d79 file VqSdQk08dV활성화한 후 배경색을 변경하면 배경 이미지에 색조가 추가됩니다. 색조의 강도나 불투명도를 변경할 수도 있습니다. 텍스트를 더 잘 보이게 하기 위해 배경에 녹색 색조를 적용한 모습입니다:

    766d6beaa3 file jSAuV7QQ48

  • 캐러셀 요소

    캐러셀 요소

    사용 가능 여부

    라이트 버전 사용 불가
    프리미엄 버전 모든 기능 사용 가능

    • 한 캐러셀 슬라이드 내 다중 열 지원.
    • 캐러셀 슬라이드의 시각적 편집.
    • 행이나 열을 편집하는 것처럼 캐러셀 슬라이드 편집 가능. 텍스트 및 이미지와 같은 추가 요소를 추가할 수 있습니다.

    사용법

    캐러셀은 반복적으로 순환하며 표시되는 콘텐츠를 추가하는 참신한 방법입니다. Page Builder Sandwich에는 사용할 수 있는 자체 캐러셀 요소가 내장되어 있어 외부 캐러셀 플러그인을 사용할 필요가 없습니다.

    캐러셀 요소의 톱니바퀴 버튼을 클릭하면 슬라이드 애니메이션, 딜레이 등과 같은 캐러셀의 동작을 구성할 수 있습니다. 생성 시 작업할 수 있는 세 개의 캐러셀 슬라이드가 제공되며, 슬라이드를 추가하거나 삭제할 수 있는 옵션이 있습니다. 이러한 모든 슬라이드는 텍스트, 이미지 및 특정 숏코드와 같이 일반적으로 사용되는 요소를 지원합니다. 

    탐색 버튼 자체를 선택하는 것만으로 슬라이드를 쉽게 전환할 수 있습니다. 슬라이드 순서 또한 속성(톱니바퀴 아이콘)을 통해 수정할 수 있습니다.

    유용한 활용처

    • 제품, 이미지, 메시지 및 시각적으로 강조해야 하는 기타 유사한 콘텐츠를 부각할 때.
    • 제한된 공간에서 더 많은 세부 정보와 정보를 담을 수 있는 공간을 확보할 때.
    • 1개 이상의 CTA(콜투액션) 버튼이 있는 랜딩 페이지 헤딩, 오프닝 페이지, 그리고 보다 일반적으로는 홈 페이지.

  • 게시물 상태 변경하기

    게시물 상태 변경하기

    게시물 상태를 변경하려면 화면 왼쪽 상단의 저장 버튼에 있는 드롭다운 표시기 위로 마우스를 가져가세요. 이렇게 하면 더 많은 저장 옵션이 표시됩니다.

    ae0cf6f413 file

  • 라이트 버전에서 노란색 프리미엄 플래그를 숨기려면 어떻게 해야 하나요

    라이트 버전에서 노란색 프리미엄 플래그를 숨기는 방법

    라이트 버전을 사용 중이시라면 노란색 삼각형 플래그를 보셨을 수 있습니다. 이는 특정 버튼/요소/옵션이 프리미엄 기능인지 여부를 나타냅니다.

    해당 플래그를 숨기려면 대시보드로 이동하여 PBSandwich > Settings의 설정 페이지로 이동한 후 Hide Premium Feature Flags 설정을 체크하면 됩니다.

  • HTML 요소

    HTML 요소

    사용 가능 여부

    Lite 버전 모든 기능 사용 가능
    Premium 버전 모든 기능 사용 가능

    사용법

    새 HTML 요소를 추가하려면 인스펙터에서 HTML 요소를 클릭하세요. 모달 창이 나타납니다. 거기에 HTML 코드를 입력하거나 붙여넣은 다음 HTML 저장을 클릭하세요. 이제 편집기 안에 HTML이 표시됩니다.

    툴바를 표시하려면 HTML 요소 위로 마우스를 가져가세요. 툴바의 연필 아이콘을 클릭하거나 요소 자체를 두 번 클릭하여 HTML을 편집할 수 있습니다.

    활용 분야

    • Iframe 삽입
    • 통계 추적 또는 기타 추적 코드
    • 사용자 정의 HTML 코드

  • PBS 내에서 할 수 있는 일들

    PBS 내에서 할 수 있는 작업

    우리는 복잡한 인터페이스를 지양하고, 모든 것이 직관적이며 쉽게 발견될 수 있기를 원했습니다. 따라서 Page Builder Sandwich의 사용자 인터페이스는 단순해 보이지만 매우 강력하며, 편집 중에 다양한 작업을 수행할 수 있습니다.

    입력하는 동안 삽입할 수 있는 특수 콘텐츠

    • 임베드 가능한 URL(예: YouTube 동영상 URL)을 붙여넣은 다음 Enter 키를 눌러 임베드합니다
    • iframe html 코드를 붙여넣은 다음 Enter 키를 눌러 임베드합니다
    • 숏코드를 입력하거나 붙여넣은 다음 Enter 키를 눌러 렌더링합니다

    마우스 커서를 사용하여 콘텐츠 조작하기

    마우스 커서를 사용하여 멋진 작업들도 많이 할 수 있습니다. 다양한 요소 위로 마우스를 가져가면 대화형 오버레이와 도구 모음이 표시됩니다. 각각 다음과 같은 다양한 기능을 수행합니다:

    • 요소 드래그하여 이동 – 임의의 요소를 마우스로 클릭하고 누른 상태에서 드래그한 다음, 다른 요소 위에 놓아 이동합니다. 약 500ms 동안 길게 클릭하면 드래그가 시작됩니다.
    • 상단 및 하단 여백 – 텍스트 및 기타 요소의 화살표 오버레이를 드래그하여 요소의 여백을 조정할 수 있습니다. 모서리를 클릭할 때 Shift + Ctrl(Mac의 경우 Command)을 누르면 여백이 재설정됩니다.
    • 열 너비 – 열의 가장자리를 드래그하여 너비를 조정하면 숫자 표시기에 현재 백분율 너비가 표시됩니다.
    • 크기 조정 – 이미지와 아이콘의 모서리를 드래그하여 크기를 조정합니다. 모서리를 클릭할 때 Shift + Ctrl을 누르면 크기가 재설정됩니다.

  • 게시물 제목 편집하기

    게시물 제목 편집하기

    PBS로 편집을 시작한 후 페이지/게시물의 제목 위로 마우스를 가져가면 윤곽선이 나타납니다. 제목을 클릭하여 커서를 놓고 수정하세요.

    제목 영역에서는 서식 도구를 사용할 수 없으며, 스타일을 수정하거나 제목에 요소를 추가할 수 없습니다.

  • 행 및 열 이해하기

    행 및 열(Rows & Columns) 이해하기

    행(Row)과 열(Column)은 구획된 콘텐츠를 만들 때 사용할 수 있는 도구입니다.

    새로 생성된 페이지/글에서 Page Builder Sandwich를 사용하여 편집할 때, 입력하는 콘텐츠는 모두 단일 열에 배치됩니다. 이는 블로그 글을 작성하기에는 좋지만, 랜딩 페이지나 문의 페이지를 위한 특별한 레이아웃을 만들고 싶다면 2열 레이아웃이나 페이지 전체에 다양한 열의 조합이 필요할 수 있습니다.

    인스펙터(inspector)에서 다음 버튼들을 사용하여 행과 열을 추가할 수 있습니다:

    22ec073e6a file ythKcmfXHF

    추가되면 새 행에 윤곽선이 표시됩니다:

    d1bfd8117d file bB2ec01I6R

    행과 열 안에는 텍스트, 숏코드, 위젯 등 무엇이든 넣을 수 있으며, 행과 열을 추가로 더 넣을 수도 있습니다.

    행(또는 행 내부의 콘텐츠)이 선택되면 인스펙터에서 더 많은 옵션을 사용할 수 있게 됩니다. 이 버튼들을 사용하여 섹션의 스타일을 추가로 지정할 수 있습니다:

    d9ddd0c520 file EaSMeFS0nW

    인스펙터의 이 아래에는 열의 스타일을 지정하기 위한 추가 옵션도 있습니다.

    행 자체를 클릭한 채로 누르고 있으면 다른 위치로 행을 이동할 수 있습니다(행 내부의 요소를 클릭한 채로 누르면 행이 아니라 해당 요소가 드래그됩니다).

  • 버튼 요소

    버튼 요소

    사용 가능 여부

    라이트 버전 사용 불가
    프리미엄 버전 모든 기능 사용 가능

    • 버튼 요소
    • 스타일
    • 버튼 아이콘

    사용법

    선택적으로 일부 텍스트를 강조 표시한 다음 인스펙터에서 버튼 요소를 클릭합니다. 그러면 버튼에 연결할 URL을 입력할 수 있는 모달 창이 나타납니다. 여기에서 웹사이트에 있는 기존 웹페이지를 검색할 수도 있습니다.

    다른 요소와 달리 버튼은 인라인으로 배치되므로 다른 텍스트(또는 다른 버튼)와 나란히 배치됩니다. 개별 버튼을 다른 위치로 드래그 앤 드롭할 수는 없으며, 버튼 주변의 텍스트와 함께 드래그해야 합니다.

    편집 중 버튼을 클릭하면 인스펙터에서 추가 스타일 옵션을 확인할 수 있습니다. 버튼 위에 마우스를 올려 연결된 URL 및 기타 명령을 확인할 수도 있습니다.

    유용한 경우

    • 다른 페이지로 연결
    • “더 보기” 또는 “자세히 알아보기” 링크
    • 1개 이상의 클릭 유도(call-to-action) 버튼이 있는 랜딩 페이지 제목

  • 플러그인 Zip 파일로 PBS를 수동으로 업데이트하는 방법

    플러그인 zip 파일로 PBS를 수동 업데이트하는 방법

    참고: PBS가 이미 설치 및 활성화되어 있고, 사이트에서 다운로드했거나 이메일 첨부 파일로 전송받은 zip 파일로 업데이트하려는 경우 이 작업을 수행하세요.

    참고: 업데이트를 수행하기 위해 다른 플러그인을 사용하고 있으며, 이를 통해 PBS를 먼저 제거할 필요 없이 바로 업데이트할 수 있습니다.

    플러그인 > 새로 추가로 이동한 다음, 검색창에서 “Easy Theme and Plugin Upgrades” 플러그인을 검색합니다.

    f0dcdeeffe file GD3oacMvwc

    해당 플러그인을 찾으면 설치하고 활성화합니다.

    e8441d3ad7 file Z7Xzi6kQD8

    Easy Theme and Plugin Upgrades 플러그인을 활성화한 후, 다시 플러그인 > 새로 추가로 이동하여 상단 근처에 있는 플러그인 업로드 버튼을 클릭합니다:

    4de275a631 file A4JzQMWjzu

    Page Builder Sandwich zip 파일을 선택하고 설치합니다,

    de7803a733 file oUXOASkueT

    완료되었습니다. 이제 새로운 버전의 PBS가 준비되었을 것입니다.

  • 지도 요소

    지도 요소

    사용 가능 여부

    라이트 버전 제한된 스타일로 제공
    프리미엄 버전 모든 기능 사용 가능

    • 맞춤 지도 아이콘
    • 색상 지정 지도
    • snazzymaps.com을 통한 맞춤 스타일 지도 / 색 구성표

    사용 방법

    지도 요소를 클릭하여 페이지에 지도를 추가하세요. 지도 요소를 선택할 때마다 인스펙터에 지도 설정이 표시됩니다. 인스펙터의 위치 필드에 위도 및 경도 좌표나 주소를 입력하여 해당 지역을 지도의 중심으로 맞출 수 있습니다. 그 외에도 다양한 스타일 지정 옵션을 사용할 수 있습니다.

    지도를 이동하거나 확대/축소하여 지도 요소를 추가로 조정할 수 있습니다. 지도에서 변경한 사항이 요소에 그대로 적용된다는 점에 유의하세요.

    프리미엄 사용자의 경우 색상을 선택하여 지도에 색조를 입힐 수 있으며, 또 다른 옵션으로는 snazzymaps.com을 사용하여 색 구성표를 생성한 후 적용하는 방법이 있습니다. SnazzyMaps를 사용하면 다음과 같은 색 구성표를 만들 수 있습니다: https://snazzymaps.com/style/20053/papuportal-dark 이러한 색 구성표를 사용하려면 Javascript style array를 복사하여 인스펙터에 붙여넣으세요.

    지도 높이는 조절할 수 있지만 지도 너비는 직접 조절할 수 없으며 항상 사용 가능한 최대 너비로 조정됩니다. 크기를 조절하려면 지도를 행과 열 안에 배치하세요. 또한 지도가 브라우저의 전체 너비를 차지하도록 설정할 수도 있습니다.

    활용 사례

    • 문의(Contact) 페이지
    • 매장 / 지점 찾기
    • 원페이지 사이트

  • 콘텐츠 탐색하기

    콘텐츠 탐색하기

    마우스를 사용하여 콘텐츠의 여러 영역에 커서를 빠르게 배치하거나 다양한 요소를 선택할 수 있습니다.

    키보드의 화살표 키를 사용하여 콘텐츠 전체에서 커서를 이동할 수도 있습니다. 이를 사용하여 행 위나 아래로 이동할 수 있습니다.

    행과 열을 다룰 때 행의 가장자리를 클릭하여 행의 바로 앞이나 뒤에 콘텐츠를 추가할 수 있습니다. 이는 여러 행이 서로 중첩되어 있고 그 사이에 콘텐츠를 추가하려는 경우에 특히 유용합니다.

  • “Page Builder Sandwich로 편집” 버튼이 표시되지 않음

    “Page Builder Sandwich로 편집” 버튼이 나타나지 않습니다

    사이트의 프런트엔드에서 “Page Builder Sandwich로 편집” 버튼이 표시되지 않는 경우, 다음 방법들을 시도해 볼 수 있습니다:

    관리자 표시줄이 표시되는지 확인하세요

    PB Sandwich의 편집 버튼은 프런트엔드의 관리자 표시줄에서 사용할 수 있습니다. 관리자 화면으로 이동하여 사용자 > 나의 프로필로 이동한 다음 사이트를 볼 때 툴바 표시 확인란이 선택되어 있는지 다시 한번 확인하여 관리자 표시줄이 표시되도록 설정하세요.

    e5960e581e file w9uN2EeCjm

    페이지, 글 또는 커스텀 포스트 타입에 있는지 확인하세요

    프런트엔드에서는 글, 페이지 및 커스텀 포스트 타입만 편집할 수 있습니다. 백엔드의 WordPress 콘텐츠 편집기를 사용하여 편집할 수 있는 항목만 프런트엔드에서 편집할 수 있습니다. 사이트의 다른 영역(예: 블로그 글 첫 페이지 목록, 전체 블로그 글 목록, 카테고리 목록, 404 페이지, 검색 페이지)은 사용 중인 테마와 함께 WordPress에서 생성한 동적 페이지이므로 PB Sandwich를 사용하여 편집할 수 없습니다.

    현재 웹페이지를 편집할 수 있는지 알 수 있는 한 가지 지표는 관리자 표시줄에 “글 편집” 또는 “페이지 편집”이 표시되는지 확인하는 것입니다.

    콘텐츠가 테마나 플러그인에 의해 동적으로 생성되지 않았는지 확인하세요

    페이지/글이 테마나 플러그인에 의해 동적으로 생성된 경우 Page Builder Sandwich(및 대부분의 다른 페이지 빌더에서도)로 편집할 수 없습니다. 백엔드의 콘텐츠 편집기는 비어 있지만 프런트엔드에서 페이지를 보면 콘텐츠가 가득 차 있다면 페이지가 동적으로 생성되었음을 나타내는 좋은 지표입니다.

    페이지가 동적으로 생성되었는지 확인하려면 웹페이지의 소스를 봅니다(마우스 오른쪽 버튼 클릭 후 “페이지 소스 보기” 선택). “pbs-main-wrapper” 텍스트를 검색했을 때 해당 텍스트를 어디에서도 찾을 수 없다면 페이지가 동적으로 생성된 것입니다.

    다음은 동적으로 생성된 콘텐츠의 몇 가지 예입니다:

    • 사용자 정의하기를 사용하여 추가/편집하는 여러 위젯으로 페이지가 구성된 경우,
    • “원페이지” 테마에 의해 여러 페이지가 하나로 합쳐져 페이지가 구성된 경우(이 경우 개별 페이지는 편집할 수 있지만 결합된 페이지는 편집할 수 없음), 또는
    • 페이지가 최신 블로그 글로 구성된 경우.

    먼저 내용을 조금 추가해 보세요

    콘텐츠가 비어 있는 경우 테마가 콘텐츠를 전혀 표시하지 않아 PBS가 페이지를 편집할 수 없다고 잘못 판단하는 경우가 있었습니다. 이런 경우인지 확인하려면 백엔드 편집기에서 페이지/글을 편집하고 콘텐츠에 아무 텍스트(예: “hello”)나 추가해 본 다음, 거기에서 “Page Builder Sandwich로 편집” 버튼을 클릭해 보세요.

    이 팁을 알려주신 Mathias Hellquist님께 감사드립니다!

    페이지가 다른 페이지 빌더에 의해 “점유”되지 않았는지 확인하세요

    일부 페이지 빌더는 WordPress의 기본 콘텐츠 편집기를 사용할지, 페이지 빌더 자체 편집기를 사용할지 선택하도록 합니다. 이미 다른 페이지 빌더를 사용하여 페이지를 편집한 경우 해당 페이지 빌더가 이미 콘텐츠를 “소유권 주장”하여 다른 콘텐츠 훅/필터가 더 이상 실행되지 않을 수 있습니다. 이 때문에 때때로 Page Builder Sandwich가 콘텐츠의 위치를 감지하지 못하고 편집할 내용이 없기 때문에 편집 버튼을 표시하지 않습니다.

    이를 해결하려면 해당 특정 페이지/글에 대해 해당 페이지 빌더를 사용하지 않도록 설정하고, WordPress의 기본 콘텐츠 편집기를 사용하도록 선택하기만 하면 됩니다.

    페이지에 대한 편집 권한이 있는지 확인하세요

    페이지를 편집할 수 없는 경우 편집 버튼이 표시되지 않습니다. 예를 들어 편집자 또는 기여자인 경우 사이트에서 블로그 글과 아티클을 작성할 수 있지만, 이것이 첫 페이지나 문의하기 페이지를 편집할 수 있다는 것을 의미하지는 않습니다. 관리자 표시줄에 “글 편집” 버튼이 표시되면 PB Sandwich를 사용하여 편집할 수도 있어야 합니다. 필요한 경우 사이트 관리자에게 편집 권한을 요청하세요.

    PB Sandwich의 작동을 중단시키는 자바스크립트 오류가 있을 수 있습니다

    PB Sandwich는 자바스크립트를 광범위하게 사용합니다. 사이트에 있는 다른 스크립트에서 자바스크립트 오류가 발생하면 PB Sandwich의 작동이 방해받을 수 있습니다. 이런 경우인지 확인하려면 브라우저에서 개발자 콘솔을 열어 오류를 확인할 수 있습니다. 

    이 작업에는 Chrome을 사용하는 것을 권장합니다. 페이지의 아무 곳이나 마우스 오른쪽 버튼으로 클릭한 다음 “검사” 옵션을 클릭합니다. 그러면 브라우저 하단에 새 영역이 나타나며, “콘솔” 탭을 클릭합니다. 오류가 있는 경우 다음과 같은 내용이 표시됩니다:

    4acce143a3 file

    오류가 있는 경우 스크립트 이름을 클릭하거나 마우스를 올려 어디에서 발생하는지에 대한 단서를 얻을 수도 있습니다:

    abb5a87c67 file ITjVcdhZQU

    이러한 오류는 테마나 사용 중인 다른 플러그인에서 발생할 수 있습니다. 이러한 오류를 수정하면 PB Sandwich가 다시 작동할 수 있습니다.

    테마나 플러그인 중 하나로 인해 자바스크립트 오류가 발생하는 경우 [email protected]으로 이메일을 보내 알려주시면 문제를 해결하기 위해 최선을 다하겠습니다 🙂

    CloudFlare를 사용하는 경우 Rocket Loader가 꺼져 있는지 확인하세요

    CloudFlare는 널리 사용되는 무료 DNS CDN입니다. 훌륭한 서비스이지만, PBS는 현재 Rocket Loader 기능과 관련하여 문제가 있습니다. Rocket Loader는 자바스크립트 파일의 로드 시간을 단축하지만, PBS 스크립트의 종속성과 호출 순서를 엉망으로 만듭니다. Rocket Loader가 켜져 있으면 Page Builder Sandwich의 편집 버튼이 나타나지 않습니다(자바스크립트 콘솔 오류도 표시되지 않음).

    사이트에서 CloudFlare의 Rocket Loader를 사용하고 있는지 확인하려면 웹페이지의 소스를 보고(마우스 오른쪽 버튼 클릭 후 “페이지 소스 보기” 선택), “rocketscript” 텍스트를 검색합니다. 해당 텍스트가 발견되면 Rocket Loader가 켜져 있는 것입니다.

    e4dff5b8c0 file tPnWvP09FF

    끄는 방법에 대한 자세한 지침은 CloudFlare 및 Rocket Loader 호환성 문서를 참조하세요.

    모두 시도해 보았지만 여전히 편집 버튼이 나타나지 않습니다!

    좋습니다. 이 시점에서 위의 해결 방법 중 어느 것도 작동하지 않는다면 버튼이 표시되지 않는 이유와 이에 대해 무엇을 해야 하는지 설명해야 할 때일 수 있습니다. 준비되셨나요? 시작해 봅시다!

    “이유” (비기술적인 용어)

    Page Builder Sandwich는 페이지/글의 콘텐츠가 어디에 있는지 알아야 합니다. 우리는 WordPress가 글의 콘텐츠를 로드할 때를 감지하고 해당 영역을 “표시”하여 모든 것이 로드되었을 때 중요한 부분이 어디에 있는지 찾을 수 있도록 함으로써 이 작업을 수행합니다.

    때로는 일부 플러그인이 이 프로세스를 재정의하거나 우회하여 콘텐츠를 자체적인 방식으로 로드하려고 시도합니다. 때로는 문제가 없지만 특정 시나리오, 특히 메인 글의 콘텐츠를 로드하는 경우 일부 플러그인이 작동을 멈출 수 있습니다. 다른 플러그인이 이 로딩 프로세스를 우회하면 우리가 수행한 “표시”가 손실될 수 있으며, 편집기가 시작될 때 콘텐츠가 어디에 있는지 더 이상 찾을 수 없게 됩니다. 따라서 편집 버튼이 나타나지 않는 것입니다! 또한 정확히 동일한 이유로 인해 일부 소셜 공유 플러그인과 같이 페이지에 콘텐츠를 추가하는 일부 플러그인도 작동을 멈출 수 있음을 알 수 있습니다.

    “이유” (기술적인 용어)

    Page Builder Sandwich는 페이지/글의 콘텐츠가 어디에 있는지 알아야 하며, the_content 필터에 후킹하고 메인 콘텐츠 주위에 래퍼(wrapper)를 추가하여 이 작업을 수행합니다. 일부 플러그인은 이를 무시하고 대신 이후 단계에서 get_the_content() 함수로 콘텐츠를 덮어쓸 수 있습니다. 안타깝게도 이렇게 하면 모든 the_content 필터가 호출되지 않으므로 PBS의 래퍼가 손실됩니다. 다른 플러그인의 변경 사항도 마찬가지로 손실됩니다.

    get_the_content() 자체를 사용하는 것에는 아무런 문제가 없지만, 모든 the_content 필터가 실행되는 일반적인 the_content() 호출 대신 메인 쿼리 및 단일 포스트 템플릿 페이지 내부에서 이 함수가 사용되는 경우 부정적인 영향이 있을 수 있습니다.

    해결 방법

    로그인한 상태에서 프런트엔드의 페이지/글을 방문하고 페이지 소스를 확인하여 Page Builder Sandwich의 “표시”가 없는지 확인할 수 있습니다. 복잡한 코드 속에서 다음 문자열을 찾을 수 있는지 검색해 보세요:

    data-name="main-content"

    찾을 수 있다면 어딘가에 자바스크립트 문제가 있는 것일 수 있으므로 사용 중인 테마와 플러그인을 알려주시면 해결해 드릴 수 있습니다.

    하지만 찾을 수 없다면 테마(또는 플러그인이지만 페이지나 블로그 글인 경우 대부분 테마)가 글 콘텐츠와 관련하여 무언가를 하고 있기 때문일 수 있습니다. 이 경우 테마 개발자에게 문의하여 문제에 대해 알려야 합니다! 위의 기술적인 “이유” 설명을 개발자에게 보여줄 수도 있으며, 이는 디버깅에 도움이 될 수 있습니다 🙂

    PHP를 직접 다루는 데 자신이 있다면 글 콘텐츠를 처리하는 템플릿 파일을 찾아 수정을 시도해 볼 수 있습니다. 저희가 발견한 한 가지 해결책은 다음 호출을:

    $content = get_the_content();

    다음과 같이 바꾸는 것입니다:

    ob_start();
the_content();
$content = ob_get_clean();<br>

    참고: PHP 변수는 상황에 따라 다를 수 있지만 개념은 동일해야 합니다. 작동하는 경우 테마에 직접 이 변경 사항을 적용하는 대신 자식 테마를 만드는 것이 더 좋습니다. 변경으로 인해 부작용이 발생할 수도 있으므로 테마 개발자와 상의하는 것이 좋습니다.

  • Page Builder Sandwich 사용 방법

    Page Builder Sandwich 사용 방법

    Page Builder Sandwich는 일반적인 페이지 빌더와 달리 복잡하지 않고 사용하기 간단합니다.

    아래 비디오를 통해 간단한 둘러보기를 확인하실 수 있습니다.

    편집기는 어디에 있나요?

    먼저 새 페이지, 글 또는 CPT(커스텀 포스트 타입)를 생성하세요. 그런 다음 프런트엔드에서 새 글이나 기존 글을 방문하세요. PBS는 100% 프런트엔드 방식으로 작동하므로 백엔드에서 번거롭게 작업할 필요가 없습니다.

    페이지 상단(관리자 표시줄)에 “Page Builder Sandwich” 버튼이 표시되며, 해당 버튼을 클릭하여 편집을 시작할 수 있습니다. 상단에서 텍스트 서식 영역이 나타나고 측면에서 요소 추가 패널이 나타납니다. 이제 테마의 콘텐츠 영역이 편집기가 됩니다!

    PBS로는 개별 페이지만 편집할 수 있습니다. 블로그 글 목록이나 404 페이지는 테마에서 생성되므로 편집할 수 없습니다. 글, 페이지 및 커스텀 포스트 타입은 편집할 수 있습니다.

    콘텐츠 편집하기

    이제 가장 멋진 부분입니다.. 프런트엔드에서 편집기 내부로 들어오면 콘텐츠의 아무 텍스트나 클릭하거나 콘텐츠 영역 내부를 클릭하고 바로 입력을 시작하세요! 다른 페이지 빌더와 달리 PBS를 사용하면 팝업 대화 상자를 거칠 필요 없이 콘텐츠를 직접 편집할 수 있습니다.

    콘텐츠 서식 지정 / 보기 좋게 꾸미기

    dcb1615380 file 9OtagMFi2c

    편집하는 동안 상단 영역은 텍스트 서식 표시줄(Text Formatting Bar)이라고 부릅니다. 이 표시줄에는 색상, 굵게, 기울임꼴, 정렬, 링크 추가, 글머리 기호 등 텍스트 스타일을 지정하는 데 사용할 모든 서식 도구가 포함되어 있습니다. 각 버튼 위에 마우스를 올려 해당 도구의 기능을 확인해 보세요.

    요소 추가하기

    ecfd309bb2 file yDqiNEv73s

    화면 왼쪽 상단의 요소 추가 버튼 위로 마우스를 올리면 요소 추가 패널(Add Element Panel)이 나타납니다. 화면 왼쪽으로 마우스를 이동하기만 해도 표시됩니다.

    요소를 삽입하려면 요소를 마우스로 누른 상태에서 콘텐츠 영역으로 드래그하세요. 요소가 배치될 영역이 강조 표시됩니다. 마우스 버튼을 놓으면 요소가 배치됩니다.

    요소 스타일 지정 및 수정

    콘텐츠에 있는 요소 위에 마우스를 올리면 요소 주위에 윤곽선과 툴바가 나타납니다.

    0046713cb7 file YU6nUCc7jY윤곽선 가장자리에 마우스를 올려 요소 간의 여백(마진)을 늘리거나 줄일 수 있습니다.

    또한 툴바의 버튼을 클릭하여 요소에 대한 빠른 작업을 수행할 수도 있습니다. 툴바의 톱니바퀴 아이콘을 클릭하면 더 많은 옵션이 포함된 속성 검사기(Properties Inspector)가 표시됩니다.

    5c220b4ac9 file Odem5RLPok

    속성 검사기

    3e7e48b754 file INy1v5z9Oz

    속성 검사기를 사용하면 요소의 모양을 더욱 세밀하게 제어할 수 있습니다. 그림자, 애니메이션 추가, 지도 색상 변경, 테두리 반경(border radius) 등 다양한 효과를 적용할 수 있습니다.

    또한 요소의 상위 요소 속성에도 접근할 수 있습니다. 예를 들어, 열(컬럼) 안에 이미지를 배치하고 속성 검사기를 열면 이미지의 속성, 이미지가 포함된 열의 속성, 그리고 해당 열이 포함된 행의 속성에 모두 접근할 수 있습니다.

    속성 검사기에는 요소마다 다양한 설정이 포함되어 있으므로 모두 확인해 보세요.

    숏코드 사용하기

    Page Builder Sandwich는 프런트엔드에서 실제 숏코드를 보여주며, 손쉽게 편집할 수도 있습니다!

    edee730340 file TqfWB9yv3y

    숏코드를 외우고 있다면 콘텐츠에 직접 입력하여 숏코드를 삽입할 수 있습니다. 하지만 전부 외우지 못했더라도(누가 다 외우겠어요?) 검사기에 사이트에서 사용할 수 있는 모든 숏코드가 나열되어 있습니다. 검사기에서 숏코드(Shortcode) 버튼을 콘텐츠 영역으로 드래그한 다음, 삽입하려는 코드를 찾아 클릭하여 삽입하세요.

    숏코드는 프런트엔드에서 실제 콘텐츠로 렌더링되며, 편집하려면 숏코드를 선택하고 검사기에서 해당 속성을 확인할 수 있습니다. 또는 더 정밀하게 제어하기 위해 숏코드를 더블 클릭하여 원본(raw) 형태로 편집할 수도 있습니다. 편집을 수행한 후에는 변경 사항이 반영되도록 숏코드가 업데이트됩니다.

    콘텐츠 재정렬하기

    PBS를 사용하면 무엇이든 클릭하고 드래그하여 어디로든 이동할 수 있습니다. 항목을 드래그하여 페이지의 다른 요소 위로 이동시키면 다른 콘텐츠의 위나 아래로 이동할 수 있습니다.

    작업 내용 저장하기

    ae0cf6f413 file

    디자인이 마음에 들면 페이지 왼쪽 상단의 저장 버튼을 클릭하기만 하면 됩니다. 정말 간단하죠!

  • Page Builder Sandwich 사용 방법

    Page Builder Sandwich는 일반적인 페이지 빌더와 달리 복잡하지 않고 사용하기 간단합니다.

    빠른 둘러보기를 위해 아래 비디오를 확인해 보세요.

    편집기는 어디에 있나요?

    먼저 새 페이지, 글 또는 CPT(사용자 정의 글 유형)를 만듭니다. 그런 다음 프런트엔드에서 새 글이나 기존 글을 방문하세요. PBS는 100% 프런트엔드 기반이므로 백엔드에서 번거롭게 작업할 필요가 없습니다.

    페이지 상단(관리자 표시줄)에 “Page Builder Sandwich” 버튼이 표시되어야 하며, 편집을 시작하려면 해당 버튼을 클릭하세요. 상단에서 텍스트 서식 영역이 나타나고, 측면에서 요소 추가 패널이 나타납니다. 이제 테마의 콘텐츠 영역이 바로 편집기가 됩니다!

    PBS로는 단일 페이지만 편집할 수 있습니다. 블로그 글 목록이나 404 페이지는 테마에 의해 생성되므로 편집할 수 없습니다. 글, 페이지 및 사용자 정의 글 유형은 편집 가능합니다.

    콘텐츠 편집하기

    이제 멋진 부분이 나옵니다. 프런트엔드와 편집기 내부에 들어가면 콘텐츠의 아무 텍스트나 클릭하거나 콘텐츠 영역 내부를 클릭하고 입력을 시작하기만 하면 됩니다! 다른 페이지 빌더와 달리 PBS를 사용하면 팝업 대화 상자를 거칠 필요 없이 콘텐츠를 직접 편집할 수 있습니다.

    콘텐츠 서식 지정 / 멋지게 꾸미기

    dcb1615380 file 9OtagMFi2c

    편집하는 동안 상단 영역을 텍스트 서식 표시줄(Text Formatting Bar)이라고 부릅니다. 이 표시줄에는 색상, 굵게, 기울임꼴, 정렬, 링크 추가, 글머리 기호 등 텍스트 스타일 지정에 사용할 모든 서식 도구가 포함되어 있습니다. 각 버튼 위에 마우스를 올리면 해당 도구의 기능을 확인할 수 있습니다.

    요소 추가하기

    ecfd309bb2 file yDqiNEv73s

    화면 왼쪽 상단의 요소 추가 버튼 위로 마우스를 올리면 요소 추가 패널(Add Element Panel)이 나타납니다. 마우스를 화면 왼쪽으로 이동하기만 해도 표시됩니다.

    요소를 삽입하려면 요소를 마우스로 누른 상태에서 콘텐츠 영역으로 드래그하세요. 요소가 배치될 영역이 강조 표시됩니다. 마우스 버튼을 놓으면 요소가 배치됩니다.

    요소 스타일 지정 및 수정

    콘텐츠에 있는 요소 위로 마우스를 올리면 윤곽선과 도구 모음이 표시됩니다.

    0046713cb7 file YU6nUCc7jY윤곽선 가장자리에 마우스를 올려 요소 간의 여백(마진)을 늘리거나 줄일 수 있습니다.

    또한 도구 모음의 버튼을 클릭하여 요소에 대한 빠른 작업을 수행할 수도 있습니다. 도구 모음에서 기어 아이콘을 클릭하면 더 많은 옵션이 포함된 속성 검사기(Properties Inspector)가 열립니다.

    5c220b4ac9 file Odem5RLPok

    속성 검사기(The Properties Inspector)

    3e7e48b754 file INy1v5z9Oz

    속성 검사기를 사용하면 요소의 모양을 더욱 세밀하게 제어할 수 있습니다. 그림자, 애니메이션, 지도 색상 변경, 모서리 곡률(border radius) 등 다양한 기능을 추가할 수 있습니다.

    또한 요소의 상위 요소 속성에도 접근할 수 있습니다. 예를 들어 열(column) 안에 이미지를 배치하고 속성 검사기를 열면 이미지의 속성, 이미지가 포함된 열, 그리고 해당 열이 포함된 행(row)의 속성에 접근할 수 있습니다.

    속성 검사기에는 요소마다 다양한 설정이 포함되어 있으므로 모두 확인해 보세요.

    숏코드 사용하기

    Page Builder Sandwich는 프런트엔드에서 실제 숏코드를 보여주며, 쉽게 편집할 수도 있습니다!

    edee730340 file TqfWB9yv3y

    숏코드를 외우고 있다면 콘텐츠에 직접 입력하여 숏코드를 삽입할 수 있습니다. 하지만 모두 외우지 못했더라도(누가 다 외우겠어요?) 검사기에서 사이트에 사용 가능한 모든 숏코드를 나열해 줍니다. 검사기에서 숏코드(Shortcode) 버튼을 콘텐츠 영역으로 드래그하고 삽입하려는 숏코드를 찾아 클릭하여 삽입하세요.

    숏코드는 프런트엔드에서 실제 콘텐츠로 렌더링되며, 이를 편집하려면 선택한 후 검사기에서 해당 속성을 확인할 수 있습니다. 또는 더 정밀하게 제어하기 위해 숏코드를 두 번 클릭하여 원시(raw) 형태로 편집할 수도 있습니다. 편집을 수행한 후 숏코드가 업데이트되어 변경 사항이 반영됩니다.

    콘텐츠 재정렬하기

    PBS를 사용하면 무엇이든 클릭하고 드래그하여 어디로든 이동할 수 있습니다. 요소를 드래그하여 페이지의 다른 요소 위로 이동하면 다른 콘텐츠의 위나 아래로 배치할 수 있습니다.

    작업 내용 저장하기

    ae0cf6f413 file

    디자인이 마음에 들면 페이지 왼쪽 상단에 있는 저장 버튼을 클릭하기만 하면 됩니다. 정말 간단하죠!

  • 라이선스 키를 어디에 입력해야 하는지 찾을 수 없습니다

    라이선스 키를 입력하는 위치를 찾을 수 없습니다

    Lite 플러그인과 Premium 플러그인은 서로 다른 두 개의 플러그인입니다. 프리미엄 기능을 사용하려면 Lite 버전을 비활성화(또는 삭제)한 후 Premium 플러그인을 설치 및 활성화하고 라이선스 키를 입력해야 합니다.

    참고: Lite 플러그인과 Premium 플러그인을 동시에 활성화하면, 플러그인에서 계속 진행하기 전에 먼저 기존 플러그인을 비활성화하라는 안내가 표시됩니다.

    pagebuildersandwich.com에서 PBS를 구매하신 고객을 위한 참고 사항: 해당 사이트에서도 플러그인을 다운로드할 수 있으며, 기존에 보유하신 라이선스 키가 계속 작동해야 합니다. 작동하지 않는 경우 문의해 주시면 새로 발급해 드리겠습니다.

    PBS를 구매하신 후 다음 두 가지가 포함된 이메일을 받으셔야 합니다:

    1. 플러그인 프리미엄 버전 다운로드 링크, 그리고
    2. 라이선스 키

    프리미엄 플러그인을 설치 및 활성화하면 다음 화면이 나타납니다:

    afb003b84c file여기에 라이선스 키를 입력하고 Agree & Activate License를 클릭하세요. 이제 프리미엄 기능을 사용할 수 있습니다.

    또는 플러그인 페이지로 이동하여 목록에서 Page Builder Sandwich 플러그인을 찾으실 수도 있습니다:

    adefed6601 file TmKnoXuFCH

    Activate License 링크를 클릭하면 해당 위치에서 라이선스를 입력하실 수 있습니다.

  • IMPress for IDX Broker

    IDX Broker용 IMPress

    최근 Page Builder Sandwich와 IMPress for IDX Broker 플러그인이 모두 함께 활성화되었을 때 로그인한 사용자의 프런트엔드에서 충돌이 발생하던 호환성 문제와 관련된 몇 가지 수정 사항을 추가했습니다.

    이 수정을 통해 PBS가 다시 정상 작동하지만, IDX Broker 위젯을 편집기 내부에 삽입하는 기능은 제거해야 했습니다. 그럼에도 불구하고 IDX Broker 위젯은 외모 > 위젯 메뉴에서 계속 사용할 수 있습니다.

  • 자주 묻는 질문

    자주 묻는 질문

    자주 묻는 질문(기술 관련)

    전면 페이지(최근 블로그 글), 404, 카테고리 및 기타 유사한 페이지를 편집할 수 있나요?

    Page Builder Sandwich를 사용하면 개별 페이지나 글만 편집할 수 있습니다. 백엔드에 콘텐츠 편집기가 있는 “새 글 작성” 영역이 있는 경우라면 Page Builder Sandwich로 편집할 수 있다고 생각하시면 됩니다.

    어떤 사용자 정의 포스트 타입(CPT)이 지원되나요?

    모든 사용자 정의 포스트 타입의 콘텐츠를 편집할 수 있습니다.

    페이지 로딩 시간/성능에 어떤 영향이 있나요? 웹사이트 로딩 속도가 느려지나요?

    당사는 Page Builder Sandwich가 웹사이트 성능에 미치는 영향을 거의 제로에 가깝게 만들었습니다. 로그아웃 상태에서는 최소한 행과 열의 CSS 스타일만 대기열에 추가되며(enqueue), 사용한 숏코드에 필요한 JS 및 CSS 스크립트만 함께 대기열에 추가됩니다.

    어떤 추가 CSS 및 JS 파일이 대기열에 추가(enqueue)되나요?

    웹사이트 방문자의 경우, 최소한 행과 열의 CSS 스타일만 대기열에 추가되며 사용한 숏코드에 필요한 필수 JS 및 CSS 스크립트만 포함됩니다.

  • 키보드 단축키

    키보드 단축키

    더 빠르게 작업할 수 있도록 Page Builder Sandwich에서 제공하는 다양한 단축키를 사용할 수 있습니다.

    서식 지정 외/도구 단축키 조합

    서식 지정 외/도구 명령에 대한 단축키입니다. 서식 지정/도구 단축키를 확인하려면 텍스트 서식 표시줄의 각 버튼 위에 마우스를 올려 단축키 조합을 확인하세요.

    단축키 설명
    CTRL+E (편집 중이 아닐 때) 편집 시작
    CTRL+SHIFT+R (편집 중일 때) 페이지 새로고침 (CTRL+R은 오른쪽 정렬에 사용됨)
    CTRL+S 변경 사항 저장
    CTRL+ESC 변경 사항 취소 및 편집 중지
    CTRL+C 복사
    CTRL+V 붙여넣기
    CTRL+X 잘라내기
    CTRL+ENTER 줄 바꿈 / 다음 줄
    CTRL+Z 실행 취소
    CTRL+SHIFT+Z (Mac)
    CTRL+Y (PC)     		다시 실행