WordPress에 Google 드라이브 문서를 포함하는 간단한 가이드

게시 됨: 2021-09-23

워드프레스는 세계 최고의 콘텐츠 관리 시스템(CMS)입니다. Google 드라이브는 세계 최고의 검색 엔진에서 제공하는 최고의 클라우드 스토리지 솔루션입니다. 이를 감안할 때 Google 드라이브 문서를 WordPress에 포함하려는 것이 좋습니다. 좋은 소식은 몇 가지 방법이 있다는 것입니다.

Google에는 Google 드라이브의 문서를 WordPress 웹사이트에 삽입하는 기능적인 방법이 있지만 몇 가지 단점이 있습니다. 대신 Google Drive Embedder와 같은 전용 플러그인을 고려하고 싶을 것입니다. 이렇게 하면 유연성이 향상되고 사이트 요구 사항에 맞게 워크플로와 접근 방식을 조정할 수 있습니다.

이 게시물에서는 WordPress에 Google 드라이브 문서를 포함하는 간단한 가이드를 제공합니다. 그 전에 WordPress가 기본적으로 Google 문서와 함께 작동하는 방식에 대해 이야기해 보겠습니다.

WordPress와 Google 문서가 함께 작동하는 방식

Google 문서도구와 WordPress는 한동안 불안정한 관계를 유지해 왔습니다. 두 회사는 잘 어울리지만 CMS와 데스크탑 출판 제품군은 그렇지 않습니다. 이는 특히 Google 문서도구가 Microsoft Word와 같은 종류의 문제를 겪고 있기 때문입니다.

표면적으로는 Google 문서에서 WordPress로 사본을 가져오는 작업은 간단해야 합니다. 내용을 복사하여 WordPress에 붙여넣습니다. 그러나 이것은 클래식 편집기나 일부 타사 페이지 빌더를 사용할 때 원하는 대로 작동하지 않는 경우가 많습니다.

이는 Google 문서 내에서 텍스트 형식을 지정하는 데 사용되는 숨겨진 HTML이 있고 WordPress가 추가 태그로 무엇을 해야할지 모르기 때문입니다.

Google 문서를 기본 편집기로

예를 들어 WordPress 웹 사이트로 가져오려는 문서가 있습니다.

A Google Doc file.

간단한 프로세스는 콘텐츠를 복사하여 WordPress에 붙여넣는 것입니다. Visual 편집기에서는 잘 보입니다.

The WordPress Classic Editor.

그러나 텍스트 편집기를 살펴보면 몇 가지 추가 태그를 확인할 수 있습니다.

The WordPress Classic Text editor.

자신의 문서의 경우 이보다 더 많은 태그가 있거나 전혀 없는 경우가 있습니다. 불일치는 Google 문서도구와 WordPress의 관계에서 또 다른 요소입니다.

대부분의 경우 다음 태그를 찾아 제거해야 합니다.

  •   . 줄 바꿈하지 않는 공백을 나타내는 HTML 태그입니다.
  • <span> 태그. 이들은 HTML 블록에 스타일(및 기타) 요소를 추가할 수 있는 '포괄적인' HTML 태그입니다.
  • aria-level=”1” 속성이 있는 항목(<li>)을 나열합니다. 이것은 그 자체로 큰 의미가 없는 접근성 속성이므로 이 경우에 삭제할 수 있습니다.

WordPress가 발전하는 것을 보았듯이 이러한 추가 태그 중 일부는 플랫폼에 진입할 때 제거됩니다.

Google 문서를 블록 편집기로

블록 편집기는 최소한의 입력으로 Google 문서 정보를 파싱하는 작업을 훌륭하게 수행합니다.

그렇더라도 이전 프로세스에서 모든 변경 사항이 보존되지는 않습니다. 예를 들어 제목은 WordPress로 이동하지 않으므로 다시 설정해야 합니다.

잘 알려지지 않은 블록 편집기의 한 요소는 이미지 가져오기 기능입니다. 예를 들어 문서에 WordPress로 가져와야 하는 이미지가 있습니다.

A Google Doc that includes an image.

간단한 복사 및 붙여넣기를 수행하면 모든 것이 예상한 대로 나타납니다.

Pasting content into the WordPress Block Editor.

제목을 설정해야 하고 이미지는 물론 정렬이 필요합니다. 그러나 이미지는 아직 미디어 라이브러리의 일부가 아닙니다. 이미지 위에 마우스를 놓고 외부 이미지 업로드 버튼을 클릭하면 가져오기가 수행됩니다.

A WordPress Image Block.

사용자가 Google 문서를 WordPress로 가져오는 데 도움이 되는 좋은 단계이지만 완벽하지는 않습니다. 그때까지는 시간을 낭비하지 않는 더 나은 방법을 찾고 싶을 것입니다.

WordPress에 Google 드라이브 문서를 포함하는 것이 좋은 이유

대부분의 경우 기본 편집기(또는 선호하는 페이지 빌더의 편집기)에서 WordPress 콘텐츠를 작성하고 싶을 것입니다. 그러나 Google 드라이브 내에서 작업하고 해당 문서를 WordPress에 포함하려는 데에는 여러 가지 이유가 있습니다.

  • 파일에 대한 잠재적인 보안을 강화할 수 있습니다. WordPress가 안정적이고 견고하기 때문에 악의적인 의미가 아닙니다. 이 경우 Google 드라이브의 클라우드 기반 저장소에 대해 이야기하고 있습니다. 여기에 파일이 있다는 것은 파일이 백업되고 안전하다는 것을 의미합니다.
  • 문서에 '살아 있는 할 일 목록'처럼 주석을 달 수 있습니다. 즉, 문서 내에서 다른 사람과 공동 작업할 수 있지만 동시에 WordPress에 포함할 수도 있습니다. 온라인으로 작업을 수행하는 효율적이고 빠른 방법입니다.
  • 말하자면 Google 드라이브 문서의 공동 작업 측면은 여러 팀 구성원이 동시에 작업할 수 있음을 의미합니다. WordPress를 사용하면 한 번에 하나의 게시물 또는 페이지(종종 하나) 내에서 팀 구성원의 수에 제한이 있습니다.

또한 WordPress 코드 편집기 내에서 작업하지 않고도 Google 문서에서 모든 서식과 스타일을 유지할 수 있습니다. 여기에서 절약한 시간은 사이트의 다른 중요한 측면에 사용될 수 있습니다.

플러그인 없이 WordPress에 Google 드라이브 문서를 포함하는 방법

좋은 소식은 Google 드라이브 문서를 WordPress에 포함하는 데 많은 것이 필요하지 않다는 것입니다. 실제로 필요한 모든 것은 Google 문서 파일의 파일 > 웹에 게시 메뉴에 있습니다.

The Publish to the web option in Google Docs.

이것을 클릭하면 링크와 내장 코드 중에서 선택할 수 있는 대화 상자가 표시됩니다. 우리는 후자를 원할 것입니다. 포함 탭을 클릭한 다음 게시 버튼을 클릭하면 확인 대화 상자가 표시됩니다.

The Publish to the web dialog.

확인을 클릭하면 WordPress에 복사하여 붙여넣을 HTML 스니펫이 표시됩니다.

Copying an iFrame link in Google Docs.

WordPress 편집기의 오른쪽에 있는 추가 작업 메뉴에서 코드 편집기에 액세스하려고 합니다.

The Code editor link in WordPress.

이 화면에서 임베드에 적합한 위치를 찾아 다음 위치에 코드를 붙여넣습니다.

Pasting an iFrame link into the WordPress Code editor.

여기에서 오른쪽에 있는 링크를 사용하여 코드 편집기를 종료하면 임베드가 표시됩니다. 또한 문서에서 기본 블록을 사용하지만 블록으로 변환 버튼을 사용하여 필요한 작업을 수행할 수 있습니다.

Adding an embed to WordPress.

그러나 이 접근 방식이 얼마나 간단한지에도 불구하고 몇 가지 단점이 있습니다. 이제 논의해 보겠습니다.

플러그인 없이 Google 드라이브 문서를 포함할 때의 단점

직접 삽입 접근 방식은 괜찮지만 경험에 대해 주의해야 할 몇 가지 주의 사항과 측면이 있습니다.

  • 문서를 표시할 수 있는 방법이 제한되어 있습니다. 대부분의 문서, 스프레드시트 등의 경우 추가 코드 없이 뷰어를 필요에 맞게 조정할 수 있는 방법이 없습니다.
  • Google 드라이브 문서의 기본 형식과 스타일은 문서를 '균질화'하기 위한 설정 작업이 여전히 필요하다는 것을 의미합니다.
  • Google 문서를 표시하는 데 제한이 있는 것 외에도 페이지의 다른 부분에 코드를 배치하려면 코드로 작업해야 합니다. 이것은 간단한 프로세스일 수 있지만 페이지를 디자인할 때 장애물이 될 가능성이 있습니다.

또한 예상치 못한 방식으로 영향을 줄 수 있는 문제가 하나 더 있습니다. 테스트 중에 Google 문서를 포함할 기회가 거부된 사례를 발견했습니다. iFrame은 정상적으로 표시되었지만 콘텐츠는 '서비스 약관' 알림으로 대체되었습니다.

A restricted Google embed.

우리의 연구에 따르면 문서에 위반 사항이 있는지 스캔하는 일종의 저작권 필터가 있습니다. 우리의 경우 텍스트는 WordPress 개인 정보 보호 정책 페이지에서 가져온 것이지만 필터는 이를 알지 못합니다.

따라서 문서에 따라 내용에 관계없이 포함하지 못할 수 있습니다.

Google 드라이브 Embedder 플러그인 소개

Google 드라이브 문서를 포함할 때 더 나은 경험을 즐기려면 전용 솔루션을 사용하는 것이 좋습니다. Google 드라이브 Embedder 플러그인은 사이트에 거의 모든 Google 드라이브 문서를 포함할 수 있는 고유한 솔루션입니다.

The Google Drive Embedder plugin.

팝업 대화 상자를 통해 문서에 액세스하고 사용자 정의 액세스를 설정할 수 있습니다. 예를 들어 읽기 전용 대화형 뷰어를 사용하여 문서를 표시하고 편집 가능한 버전으로 연결되는 링크를 제공할 수도 있습니다. 또한 이러한 파일을 다운로드용으로 제공할 수도 있습니다.

플러그인은 Google 드라이브 삽입에 중점을 두고 있지만 이것이 전부는 아닙니다. 다른 여러 파일 형식도 표시할 수 있습니다. 즉, Microsoft Word 문서, ZIP 파일, 비디오, 이미지, PDF 등이 있는 경우 모두 포함할 수 있습니다.

좋은 소식은 핵심 플러그인이 무료라는 것입니다. 그러나 프리미엄 버전에서는 더 많은 기능을 사용할 수 있습니다. 예를 들어 Shared with MeStarred 폴더와 같은 특정 폴더를 탐색할 수 있는 기능을 통해 Google 드라이브와 더 긴밀하게 통합됩니다. 말하자면 사이트에 폴더를 포함할 수도 있습니다.

그럼에도 불구하고 플러그인의 무료 버전은 모든 기능을 갖추고 있으며 사용이 간편합니다. 다음으로 플러그인을 시작하고 실행하는 방법을 보여드리겠습니다.

Google 드라이브 Embedder 플러그인을 사용하여 WordPress에 Google 드라이브를 포함하는 방법(3단계)

귀하와 삽입된 Google 드라이브 문서 사이에는 세 단계가 있습니다. 첫 번째 작업은 WordPress 내에서 두 개의 플러그인을 설정하는 것입니다. 먼저 두 가지를 차례로 살펴보겠습니다.

1. Google Apps 로그인 플러그인 설치 및 활성화

Google Drive Embedder를 사용하려면 Google Apps 로그인 플러그인도 설치해야 합니다.

The Google Apps Login plugin.

기존 사용자가 보안 인증으로 Google에 로그인하는 데 도움이 되는 중요한 플러그인입니다. 또한 Gmail에 로그인한 경우 파일에 액세스하기 위해 해당 세부정보를 다시 입력할 필요가 없습니다. 말그대로 필수입니다.

프로세스는 특히 WordPress 내의 플러그인 > 새 추가 화면에서 수행하는 경우 간단합니다.

The WordPress Add Plugins screen.

여기에서 검색 창을 사용하여 Google Apps 로그인 플러그인을 찾고 지금 설치 버튼을 클릭합니다.

The Google Apps Login plugin install screen.

잠시 후 버튼이 활성화 로 변경되는 것을 볼 수 있습니다. 이것을 다시 클릭하면 기본 플러그인 화면으로 돌아갑니다.

계속 진행하기 전에 설정 > Google Apps 로그인 화면으로 이동하십시오.

The Google Apps Login setup screen.

플러그인이 작동하기 전에 여기에서 완료해야 할 몇 가지 작업이 있습니다. 전용 클라이언트 ID클라이언트 암호 를 통해 Google 드라이브를 WordPress 계정에 연결해야 합니다. 좋은 소식은 설정 화면 상단에 전체 지침에 대한 링크가 있다는 것입니다. 따라서 여기서는 이러한 세부 사항을 다루지 않습니다.

준비가 되면 Google 드라이브 Embedder 플러그인 설치를 시작할 수 있습니다.

2. Google 드라이브 Embedder 플러그인 설치 및 활성화

이 플러그인의 프로세스는 Google Apps 로그인과 유사합니다. 유일한 차이점은 대신 Google Drive Embedder를 검색한다는 것입니다.

The Google Drive Embedder install screen.

다시 지금 설치 , 활성화 를 차례로 클릭하면 WordPress가 시스템에 플러그인을 설치합니다. 무료 버전의 Google Drive Embedder를 사용하면 추가 설정이 필요하지 않습니다! 단, 프리미엄 버전으로 업그레이드하면 설정 > 구글 드라이브 임베더 화면에서 모든 설정을 확인할 수 있다.

3. WordPress에 Google 드라이브 문서 포함

마지막 단계는 WordPress에 문서를 포함하는 것입니다. 이렇게 하려면 게시물이나 페이지로 이동하여 콘텐츠에 새 블록을 추가합니다. Google 드라이브 Embedder 블록을 찾고 있습니다.

The Google Drive Embedder Block.

이것을 레이아웃에 추가하고 나면 오른쪽 사이드바에 있는 차단 설정 메뉴를 살펴보세요. 이렇게 하면 Google 드라이브 문서를 선택할 수 있습니다.

The Select Google File button.

여기에서 문서를 선택하는 데 도움이 되는 대화 상자가 표시됩니다.

[IMAGE 구글 파일 대화 상자]

이 프로세스는 다른 인증 프로세스와 유사하지만 처음 액세스할 때 Google에 액세스를 인증해야 할 수도 있습니다.

Google's authentication screen.

이 작업을 수행하면 팝업 대화 상자에 Google 드라이브 문서 목록이 표시됩니다.

Choosing a document within Google.

문서를 선택하면 선택 대화 상자 아래에 있는 세 개의 라디오 버튼에 액세스할 수 있습니다.

The Embed document radio button.

이것들은 모두 직관적이고 빠르게 사용할 수 있습니다. 문서 포함 옵션을 사용하면 포함의 너비와 높이를 설정할 수 있고 뷰어 파일 링크를 사용하면 새 창에서 파일을 열고 아이콘을 표시할 수 있습니다. 파일 링크 다운로드 라디오 버튼을 사용하면 해당 문서가 기본 Google 문서가 아닌 경우 사용자가 파일을 다운로드할 수 있는 옵션을 설정할 수 있습니다.

파일 삽입 버튼을 클릭하면 화면 업데이트에 있는 단축 코드 자리 표시자가 표시됩니다. 여기에서 페이지를 미리 보면 임베드가 어떻게 보이는지 알 수 있습니다. 이 시점부터 사용자는 사이트의 프런트 엔드에서 문서와 상호 작용할 수 있습니다.

결론

Google은 텍스트 문서, 스프레드시트 등을 만들 수 있는 뛰어난 애플리케이션 제품군을 제공합니다. WordPress 사이트 소유자라면 두 가지를 모두 결합하고 싶을 것입니다. 다행히도 이것은 가능성의 영역 내에 있습니다.

Google 드라이브의 기본 포함 기능에 의존하고 싶지 않을 수도 있지만 Google 드라이브 Embedder와 같은 플러그인을 사용하고 싶을 것입니다. 이렇게 하면 페이지의 거의 모든 위치에 Google 드라이브 문서를 삽입할 수 있습니다. 또한 뷰어를 만들고 자신만의 경험을 할 수 있는 몇 가지 사용자 지정 옵션이 제공됩니다.

Google 드라이브 문서를 삽입해야 하며 이 플러그인이 도움이 될까요? 아래 의견 섹션에서 생각을 공유하십시오!