웹 사이트에 콘텐츠 삽입에 대한 궁극적 인 가이드

콘텐츠에 사회적 증거를 추가하거나,실제 사례가있는 블로그를 지원하거나,뉴스 피드로 웹 사이트의 도달 범위를 확장하든,다른 플랫폼의 콘텐츠를 포함하면 웹 사이트에 많은 가치를 더할 수 있습니다.

그러나이 콘텐츠를 실제로 포함하는 방법을 알아내는 것은 까다로울 수 있습니다.

이 게시물에서는 트위터,페이스 북,인스 타 그램,클립,구글 캘린더,유튜브 및 슬라이드 쉐어에서 소셜 미디어 및 관련 콘텐츠를 웹 사이트에 삽입하는 단계별 가이드를 찾을 수 있습니다..

→ 무료 다운로드:고성능 웹 사이트 구축 및 유지 관리를위한 5 가지 주요 단계

(불행하게도,링크드 인은 여전히 특정 게시물에 대한 포함 기능을 허용하지 않습니다-당신이 당신의 링크드 인 프로필 또는 페이지를 포함 할 수 있도록 플러그인을 제공 않지만.)

섹션 이름을 클릭하면 해당 섹션으로 자동으로 스크롤됩니다.

  1. 트윗을 포함하는 방법
  2. 페이스 북 게시물 또는 비디오를 포함
  3. 페이스 북 피드를 포함
  4. 인스 타 그램 피드 및 게시물을 포함
  5. 클립 핀 삽입
  6. 클립 보드 삽입
  7. 구글+포스트 삽입
  8. Embed Post 구글 캘린더 포함
  9. 유튜브 동영상 삽입 방법
  10. 슬라이드쉐어 프레젠테이션 및 인포그래픽 포함

트윗 삽입 방법

  1. 삽입하려는 트윗을 찾습니다.
  2. 트윗 오른쪽 상단의 아래쪽 화살표를 클릭합니다.
  3. “트윗 삽입”을 선택합니다.”
  4. 나타나는 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.
  5. 임베드 코드에서”트위터-트윗”이라는 단어 뒤에’트위 정렬 센터’를 추가합니다.

삽입하려는 트윗을 찾습니다.

블로그나 웹사이트에 트윗을 삽입하려면 먼저 자연 서식지에 표시할 트윗을 찾아야 합니다. 트위터 뉴스피드 또는 트위터 사용자 프로필에서 트윗을 찾습니다. 아래 스크린 샷과 같이이 예를 들어,우리는 허브 스팟의 트위터 피드에서 트윗을 포함 할 수 있습니다.

트윗 오른쪽 상단의 아래쪽 화살표를 클릭합니다.

삽입하려는 트윗을 찾은 후 아래 그림과 같이 트윗 오른쪽 상단에 있는 아래쪽 화살표 아이콘을 클릭합니다.

downward-arrow-tweet

고르다”트윗 삽입.”

이 화살표 아이콘을 클릭하면’트윗 삽입’이라는 옵션을 포함한 드롭다운 메뉴가 표시됩니다.”이 옵션을 클릭하십시오.

4. 나타나는 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.

위에 표시된 드롭 다운 메뉴에서”트윗 삽입”을 클릭하면 아래 표시된 코드 상자가 열립니다. ‘이 트윗 삽입’아래에 파란색으로 강조 표시된 텍스트 문자열이 표시됩니다. 이 코드를 클립보드에 복사하려면 키보드(또는 컨트롤+씨)에서 명령+씨 를 사용하십시오.

tweet-embed-code

이 삽입 코드가 클립보드에 복사된 상태에서 이 트윗을 삽입할 웹 사이트로 돌아갑니다. 이 웹 사이트의 소스 코드를 엽니 다(일부 콘텐츠 관리 시스템에는”</>”아이콘이있어이 소스 코드에 액세스 할 수 있습니다). 트윗의 임베드 코드를 붙여넣을 수 있습니다.

임베드 코드에서”트위터-트윗”이라는 단어 뒤에’트위 정렬 센터’를 추가합니다.

일단 당신이 당신의 웹 페이지에 코드를 붙여,그러나,당신은 자동으로 웹 페이지의 왼쪽 또는 오른쪽에 대해 밀어 표시되지 않도록이 트윗을 중앙 정렬 할 수 있습니다. 이 문제를 해결하려면 소스 코드에서”트위터-트윗”바로 뒤에’가운데 정렬'(따옴표 제외)텍스트를 추가하십시오. 이 방법에 대한 자세한 내용은 여기를 참조하십시오.

최종 코드는 다음과 같습니다:2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 <>올해 우리에게 어떤 종류의 콘텐츠를보고 싶습니까?2018 년 10 월 15 일(토)~2018 년 10 월 15 일(일)=”https://twitter.com/HubSpot/status/1085634067679322114?ref_src=twsrc%5Etfw”>January 16, 2019</2018 년 10 월 15 일(토)~2018 년 10 월 15 일(일)-8″></스크립트>

그게 다야! 이 작업이 완료되면 임베디드 트윗의 모습입니다:

저희에게 알려주십시오!
올해 우리에게 어떤 종류의 콘텐츠를보고 싶습니까?이 경우,당신은 그것을 할 수 있습니다.16, 2019

퍼가기 페이스북 게시물 또는 동영상

퍼가기 원하는 페이스북 게시물을 찾아보세요…

트윗 삽입 단계와 마찬가지로(위에 나열된),블로그 또는 웹 사이트에 페이스 북 게시물을 포함시키는 것은 페이스 북에서 시작됩니다… 당신이 페이스 북에서 포함 할 게시물로 이동,페이스 북 사용자의 프로필 페이지 또는 뉴스 피드……………………. 아래 스크린 샷과 같이이 예를 들어,우리는 허브스팟 아카데미에서 페이스 북 게시물을 포함 할 수 있습니다..

줄임표(“…”)게시물의 오른쪽 상단에있는 아이콘.

당신이 포함 할 페이스 북 게시물의 오른쪽 상단에,당신은 세 개의 작은 점으로 구성된 줄임표 아이콘을 볼 수 있습니다.. 아래 그림과 같이 이 아이콘을 클릭합니다.

ellipsis-facebook-post

“임베드”를 클릭하십시오.”

아래에 표시된 줄임표 아이콘을 클릭하면”포함”이라고 표시된 옵션을 포함하여 드롭 다운 메뉴가 나타납니다.”삽입하려는 게시물이 동영상인 경우”</>삽입”이라는 유사한 옵션이 이 메뉴에 더 아래로 나타납니다. 두 옵션 중 하나를 클릭합니다.

게시물을 포함할 수 있는 옵션이 표시되지 않으면 게시물은 공개되지 않으며 임베드할 수 없습니다.

embed-facebook-post-from-hubspot-academy

나타나는 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.

위에 표시된”포함”옵션을 클릭하면 아래 표시된 상자가 열립니다. 이 상자 상단의”미리보기 숨기기”및”고급 설정”버튼 바로 위에 코드화 된 텍스트 줄이 표시됩니다. 이 코드를 강조 표시하고 컴퓨터의 클립 보드에 복사하십시오.

facebook-post-embed-code

이 삽입 코드는 클립 보드에 복사,이 페이스 북 게시물을 포함 할 웹 사이트로 return 이 웹 사이트의 소스 코드를 엽니 다(일부 콘텐츠 관리 시스템에는”</>”아이콘이있어이 소스 코드에 액세스 할 수 있습니다). 여기에,당신은 당신이 게시물이 표시 할 위치를 정확하게 당신의 웹 사이트에 페이스 북 게시물의 소스 코드를 붙여 넣을 수 있습니다..1839>중앙>및</중앙>태그를 추가하여 게시물을 가운데에 맞춥니다.

일단 당신이 당신의 웹 페이지에 코드를 붙여,그러나,당신은 자동으로 웹 페이지의 왼쪽 또는 오른쪽에 대해 밀어 표시되지 않도록 게시물을 중앙 정렬 할 수 있습니다. 이 문제를 해결하려면'<센터>’와'</센터>’태그로 코드를 래핑하여 기사 또는 웹 페이지의 중앙에 페이스 북 게시물이 표시됩니다..

여기에 무슨 최종 코드는 다음과 같습:

<센터><iframe src=”https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fthehubspotacademy%2Fposts%2F741606746226328%3A0&width=500″width=”500″height=”448″style=”border:none;overflow:숨겨진”scrolling=”no”frameborder=”0″allowTransparency=”true”수 있=”암호화된디어”></iframe></센>

니다. 다음은 작업이 완료되면 다음과 같습니다:믿거나 말거나,페이스북 프로필의 전체 피드를 웹사이트에 삽입하는 것은 하나의 게시물이나 비디오를 삽입하는 것만큼이나 쉽습니다……………………. 그리고 그것을 할 수있는 하나 이상의 방법이 있습니다.

워드프레스 플러그인 사용

첫 번째 방법은 콘텐츠 관리 시스템에 플러그인이나 위젯을 설치하는 것입니다. 워드 프레스 사용자는,예를 들어,자신의 처분에 여러 페이스 북 피드 플러그인이 있습니다.. 사용 방법은 다음과 같습니다:

  1. 사용자 정의 페이스 북 피드,스매쉬 풍선에 의해,당신이 당신의 워드 프레스 계정을 통해 다운로드 할 수 있습니다 하나의 워드 프레스 플러그인입니다.. 이 플러그인은 여기에서 다운로드 할 수 있습니다.
  2. 이 플러그인을 다운로드,워드 프레스 계정에 로그인하고”플러그인”메뉴 내에서이 플러그인을 활성화합니다.
  3. website”페이스북 피드”설정을 사용하여 웹사이트에 표시할 특정 페이스북 피드를 선택하고 구성합니다.***********.***********
  4. 텍스트를 입력,”선택한 페이스 북 피드를 생성하는 웹 사이트의 편집기에서..페이스 북은 당신이 어떤 프로필의 개별 페이스 북 피드에 대한 소스 코드를 생성하고 웹 사이트의 웹 사이트에 입력 할 수 있도록,자신의 페이지 플러그인을 가지고 있습니다…………………….. 사용 방법은 다음과 같습니다.

    1. 페이스 북의 페이지 플러그인 도구를 엽니 다.Plugin

    블로그 또는 웹 사이트에 페이스 북 피드를 포함하려면 여기에 페이스 북의 기본 페이지 플러그인 도구를 엽니 다.Plugin. 아래 표시된 섹션이 나타날 때까지 이 페이지를 아래로 스크롤합니다.

    facebook-page-plugin

    2. 삽입하려는 페이스북 페이지의 주소를 입력합니다..

    이 도구를 열어,웹 브라우저에서 새 탭을 만들고 그 피드 당신이 포함 할 페이스 북 프로필로 이동합니다.. 이 페이지를 복사하려면 컴퓨터의 클립보드에 복사합니다.

    페이스 북의 페이지 플러그인이 열려있는 브라우저 탭으로 돌아갑니다.. 아래 스크린샷과 같이 클립보드에서 왼쪽 상단 필드에 붙여넣습니다. 이 예를 들어,우리는 허브 스팟의 페이스 북 비즈니스 페이지의 페이스 북 피드를 포함 할 수 있습니다…

    hubspot-facebook-page-plugin

    3. 포함된 피드와 함께 표시할 탭을 추가합니다.

    프로필의 전체 타임 라인을 보여주는 것 외에도,페이스 북의 페이지 플러그인은 또한 해당 프로필의 이벤트 및/또는 메신저 계정에 탭을 표시 할 수 있습니다.. 기본적으로 페이지 플러그인 도구에는”타임 라인”이 자체적으로 입력됩니다.

    포함 된 페이스 북 피드에 이벤트 또는 메신저 탭을 추가하려면 아래 그림과 같이 페이지 플러그인 도구의 오른쪽 상단에있는”탭”필드를 over “타임 라인”이라는 단어 옆에”이벤트”및/또는”메시지”라는 단어를 모두 쉼표로 구분하여 추가하십시오.

    facebook-plugin-tabs

    4. 당신의 페이스 북 피드의 크기를 사용자 정의 할 수 있습니다..

    귀하의 웹 사이트에 포함 된 미디어의 크기를 제한하는 특정 치수가 있고 이러한 치수가 무엇인지 알고 있다면 페이스 북 페이지 플러그인 도구의 아래쪽 두 필드에 입력하십시오.. 왼쪽 필드에 특정 너비를 입력하고 오른쪽 필드에 특정 높이를 입력할 수 있습니다.이 도구의 미리보기 텍스트에서 권장 크기를 볼 수 있지만 기본적으로 페이스 북 피드는 약 340*500 에 표시됩니다..

    5. “코드 가져 오기”를 클릭하십시오.”

    이 네 개의 필드가 모두 채워지면 위의 스크린 샷과 같이 도구 하단의 파란색”코드 가져 오기”버튼을 클릭하기 만하면됩니다. 그러면 아래 표시된 코드 상자가 열립니다.

    6. ‘아이프레임’탭을 클릭합니다.

    어떤 코드를 선택하는지주의하십시오… 웹 사이트를 처음부터 코딩하지 않는 한 첫 번째 탭에는 원하는 코드가 없습니다. 아래 그림과 같이”아이프레임”이라고 표시된 탭으로 전환합니다. 이 텍스트는 블로그 또는 웹 사이트의 편집기에 삽입 할 준비가되어 있습니다.

    facebook-page-plugin-embed-code

    7. 이 소스 코드를 복사하여 웹 사이트의 편집기에 붙여 넣으십시오.

    위의 코드를 클립 보드에 복사하십시오. 그런 다음,이 페이스 북 피드를 포함 할 웹 사이트로 이동합니다.. 웹사이트의 소스 코드를 엽니다(일부 콘텐츠 관리 시스템에는 이 소스 코드에 액세스할 수 있는”</>”아이콘이 있습니다). 그러면 피드의 임베드 코드를 원하는 위치에 정확하게 붙여넣을 수 있습니다.

    8. 전체 아이프레임 스니펫 주위에<중앙>및</중앙>태그를 추가하여 피드를 가운데에 맞춥니다.

    일단 당신이 당신의 웹 페이지에 코드를 붙여,그러나,당신은 자동으로 웹 페이지의 왼쪽 또는 오른쪽에 대해 밀어 표시되지 않도록 게시물을 중앙 정렬 할 수 있습니다. 이 문제를 해결하려면'<센터>’와'</센터>’태그로 코드를 래핑하여 기사 또는 웹 페이지의 중앙에 페이스 북 피드가 표시됩니다..

    최종 코드는 다음과 같습니다:

    <이 매개 변수에는 다음과 같은 매개 변수가 있습니다.; 1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 10 월 15 일-1998 년 인스 타 그램은 마케팅 담당자들 사이에서 가장 좋아 but,하지만 전체 인스 타 그램 피드를 포함하는 것은 어려울 수 있습니다……………………. 여기에 귀하의 웹 사이트에 인스 타 그램 피드뿐만 아니라 개별 게시물을 포함하는 방법은 다음과 같습니다..

    인스 타 그램 피드 워드 프레스 플러그인

    사용자 정의 페이스 북 피드의 제조 업체에서 인스 타 그램 피드 온다… 스매쉬 풍선에 의해 개발 된이 워드 프레스 플러그인은 쉽게 워드 프레스 기반 웹 사이트가 전체 인스 타 그램은 특정 인스 타 그램 계정에서 피드를 포함 할 수 있습니다… 사용 방법은 다음과 같습니다:

    1. 워드 프레스에 대한 인스 타 그램 피드 플러그인을 다운로드 여기에..
    2. 이 플러그인을 다운로드,워드 프레스 계정에 로그인하고”플러그인”메뉴 내에서이 플러그인을 활성화합니다.인스타그램 액세스 토큰과 사용자 아이디를 select”인스타그램 피드”설정을 사용하여 선택합니다..
    3. 텍스트를 입력,”당신의 웹 사이트의 편집기에서 선택한 인스 타 그램 피드를 생성합니다..

    워드 프레스에이 플러그인의 지침에 따라,당신은 format 형식으로 텍스트를 입력하여 동시에 여러 인스 타 그램 피드를 표시 할 수 있습니다. 이 예에서,당신은 효과적으로 세 개의 인스 타 그램 피드 여섯 개 이미지를 각각 포함 할 것입니다..

    인스타그램의 임베딩 기능

    인스타그램의 개별 사진을 임베딩하려면 인스타그램의 기본 기능보다 더 멀리 볼 필요가 없습니다… 중요:특정 인스타그램 게시물을 블로그나 웹사이트에 포함시키기 위해,인스타그램 계정이 비공개로 설정될 수 없습니다………….Important……….. 계정을 공개로 설정하려면 이 프로필로 이동하여”프로필 편집”>개인 정보 및 보안을 클릭합니다. 이 페이지에서”개인 계정”옵션을 선택 취소하면 모두 설정해야합니다.

    1. 삽입하려는 인스타그램 이미지를 클릭합니다..

    당신이 당신의 웹 사이트에 포함 할 인스 타 그램 게시물로 이동하여 이미지를 확대하기 위해 클릭합니다.. 이 예제에서는 아래 스크린샷과 같이 허브스폿의 문화 계정인 허브스폿의 이미지를 삽입합니다.

    2. 줄임표(“…”)게시물의 오른쪽 하단 모서리에있는 아이콘.

    전체보기에서 게시물,코멘트 섹션의 오른쪽 하단에보세요. 아래 그림과 같이 세 개의 작은 점으로 구성된 줄임표 아이콘을 클릭하십시오.

    instagram-post-ellipsis

    3. “임베드”를 선택하십시오.”

    위에 표시된 줄임표 아이콘을 클릭하면 아래 표시된 옵션 상자가 열립니다. 이 메뉴에서 상단에서 세 번째 버튼 인”포함”을 선택하십시오.

    instagram-post-embed-menu

    4. 삽입 코드를 복사하여 붙여넣습니다.

    많은 트위터와 페이스 북(위에 나열된)에 대한 지침처럼,이”Embed”버튼은 코딩 된 텍스트의 고통을 들고 또 다른 상자를 생성합니다. 이 상자가 화면에 열리면 아래 그림과 같이 상단의 코드를 강조 표시하십시오. 그런 다음 하단의 파란색”소스 코드 복사”버튼을 클릭하여이 텍스트를 컴퓨터의 클립 보드에 복사하십시오.

    instagram-post-embed-code

    5. 1839>중앙>및</중앙>태그를 추가하여 게시물을 가운데 정렬합니다.그러나 이 코드를 붙여넣으면 인스타그램 포스트를 가운데 정렬하여 웹페이지의 왼쪽이나 오른쪽에 자동으로 밀려 나타나지 않도록 하는 것이 좋습니다.. 이 문제를 해결하려면'<센터>’및'</센터>’태그로 코드를 래핑하여 이미지가 기사 또는 웹 페이지의 중앙에 표시됩니다.

    그게 다야! 여기에 포함 된 인스 타 그램 게시물의 모습입니다 ‘s:

    내장 클립 핀

    오픈 클립의 위젯 빌더.

    블로그 또는 웹 사이트에 클립에서 고정 된 콘텐츠를 포함하려면,오픈 클립의 위젯 빌더,여기에서 사용할 수 있습니다.

    왼쪽 열에서”핀 위젯”을 선택합니다.

    아래 스크린 샷과 같이 핀 위젯 옵션이 표시 될 때까지 아래로 스크롤합니다.

    pinterest-pin-widget

    삽입하려는 핀의 위치에 붙여넣습니다.

    아래 그림과 같이 도구 상단의”핀 주소”필드에 웹 사이트에 삽입하려는 핀의 주소를 입력하여 시작합니다.

    pin-widget-url

    이 섹션의 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.

    아래 그림과 같이-클립의 핀 위젯에있는 동안,당신은 코딩 된 텍스트의 두 줄을 찾을 수 있습니다 당신의 핀의 미리보기 이미지 아래 섹션을 아래로 스크롤합니다.

    pinterest-pin-embed-code웹 사이트의 편집기를 열고,복사 및 붙여 넣기 당신이 당신의 클립 핀 페이지에 표시 할 위치를 정확하게 첫 번째 줄. 다음,텍스트의 두 번째 줄을 복사 하 고 페이지의 맨 아래에 귀하의 웹사이트의 편집기에 붙여 넣습니다.

    이 전체 조각을 단일 웹 페이지에 두 번 이상 붙여 넣지 않도록주의하십시오. 핀을 여러 번 표시하려면 첫 번째 코드 줄을 복사하여 페이지에 표시하려는 위치에 붙여 넣기 만하면됩니다. 그리고 당신이 포함하기로 결정 핀의 각 인스턴스에서 다음 단계를 반복하는 것을 잊지 마세요.

    아래에 제공된 코드 조각을 복사합니다.

    <!–고객 센터–>

    여는<>태그와 닫는</>태그 사이에 코드 조각을 붙여 넣습니다.

    코드는 다음과 같습니다:

    <=”http://www.pinterest.com/pin/99360735500167749/”><!–pinterest–></a>

    페이지 하단:
    <스크립트 유형=”텍스트/자바 스크립트”비동기 assets.pinterest.com/js/pinit.js”></스크립트>

    추가<센터>및</센터>

    최종 코드는 다음과 같습니다:

    <중앙><=”http://www.pinterest.com/pin/99360735500167749/”><!–pinterest–></a>
    <!–피니 트에게 전화하십시오.페이지 당 한 번만–>
    <스크립트 유형=”텍스트/자바 스크립트”비동기 자산=”//자산.고객 센터.2018 년 10 월 15 일이 문제를 해결하는 데 도움이되는 몇 가지 방법이 있습니다. 여기에 당신이 완료되면 어떻게 보일지:

    임베드 클립 보드

    클립 보드를 추가하려면,단계는 일반적으로 개별 핀을 포함하는 것과 동일-위에서 설명했다. 여기에 그것을 수행하는 방법은 다음과 같습니다:

    1. 오픈 클립의 위젯 빌더.
    2. “핀 위젯”빌더 바로 아래의 왼쪽 열에서”보드 위젯”을 선택하십시오.
    3. 보드 위젯이 열리면 위에 나열된 핀을 추가하는 것과 동일한 단계를 따르십시오.아래 두 줄의 코드를 복사하여 붙여 넣습니다. 다음은 임베디드 보드의 모습입니다:

      임베드 구글 포스트

      1. 삽입하려는 구글+게시물을 찾습니다. 오른쪽 상단 모서리 위로 마우스를 가져가서 나타나는 회색 화살표를 클릭하여 더 많은 옵션을 내립니다.

      google-plus-embed-1

      2. 고르다”게시물 삽입.”

      google-plus-embed-2

      3. 표시되는 코드 전체를 복사하여 웹 사이트의 웹 사이트 보기에 붙여 넣습니다.

      google-plus-embed3

      4. 1839>센터>및</센터>를 추가하여 포함 된 게시물을 가운데에 배치합니다.

      최종 코드는 다음과 같습니다:

      <센터><!–당신의 머리 또는 당신의 가까운 몸 꼬리표의 바로 전에 이 꼬리표를 두십시오. –>
      <스크립트 유형=”텍스트/자바 스크립트”=”https://apis.google.com/js/plusone.js”></script>
      <!–당신이 위젯을 렌더링 할 곳이 태그를 놓습니다. –>
      <이 방법은 다음과 같습니다.=”https://plus.google.com/110490539670062886957/posts/be2TCKDBMsG”></div></center>

      그게 다야! 다음은 작업이 완료되면 다음과 같습니다:

      구글 캘린더를 삽입하는 방법

      블로그 나 웹 사이트에 특정 구글 캘린더를 삽입하려면,당신은 구글 캘린더의 웹 버전이 아닌 모바일 앱을 사용해야합니다.

      열려있어? 그것을 포함 시키십시오.

      톱니바퀴 아이콘을 클릭하여 설정을 엽니다.

      구글 캘린더 상단의 톱니바퀴 아이콘을 클릭하고 아래와 같이’설정’을 선택합니다.

      google-calendar-settings

      삽입하려는 캘린더를 선택하고 아래로 스크롤하여”캘린더 통합.”

      캘린더 설정에 들어가면 왼쪽 사이드바에서 웹 사이트에 포함할 특정 캘린더를 확인합니다. 이 예제에서는 허브스팟의 공휴일 달력을 포함합니다.

      캘린더를 선택한 후 설정의 오른쪽을 보고”캘린더 통합”섹션이 나타날 때까지 아래로 스크롤합니다. (당신은 또한 단순히 선택한 달력의 왼쪽에 같은 이름의 옵션을 클릭 할 수 있습니다.)

      google-integrate-calendar-1

      “사용자 정의”를 클릭하고 캘린더의 크기 및 색상을 구성하십시오.

      설정의”캘린더 통합”섹션에서”소스 코드”텍스트 줄 바로 위의”사용자 정의”버튼을 찾아 클릭하십시오. 이것은 당신이 그것을 삽입하기 전에 달력의 크기와 색상을 변경할 수있는 옵션의 큰 창이 열립니다.

      현재 캘린더가 어떻게 보이는지에 만족하고 미학적 인 변경을 할 필요가 없다면,이 임베드 코드를 클립 보드에 복사하면됩니다.

      구글의 통합 캘린더 설정 내부 버튼을 사용자 정의합니다.

      상단에 삽입 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.

      사용자 정의 창 내부 또는 설정 페이지에서 임베드 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다. 원하는 경우 이 임베드 코드를<센터>및</센터>태그에 래핑하여 웹 사이트의 여백 내에서 캘린더를 가운데 정렬할 수 있습니다.

      유튜브 동영상 삽입 방법

      1. 삽입하려는 유튜브 동영상을 찾습니다.
      2. 비디오에서”공유.”
      3. 나타나는 메뉴에서”포함”을 선택합니다.”
      4. 나타나는 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.

      삽입하려는 유튜브 동영상을 찾습니다.

      블로그 또는 웹 사이트에 유튜브 비디오를 삽입하는 것은 매우 쉽습니다. 시작하려면 유튜브를 열고 포함 할 비디오로 이동합니다. 이 예제에서는 아래 스크린샷과 같이 허브스팟의 인바운드 유튜브 채널에서 인바운드 마케팅에 대한 비디오를 삽입합니다.

      비디오에서”공유.”

      아래 그림과 같이 비디오 자체 아래에서”공유”버튼을 찾습니다.

      inbound-youtube-video

      나타나는 메뉴에서”포함”을 선택합니다.”

      선택한 유튜브 비디오 아래의”공유”버튼을 클릭하면 다양한 소셜 네트워크에 비디오를 공유 할 수있는 옵션의 작은 메뉴가 열립니다. 이 옵션의 맨 왼쪽에,그러나,당신은 또한 원형”포함”버튼을 볼 수 있습니다. 이 버튼을 클릭합니다.

      youtube-share-embed

      나타나는 코드를 복사하여 웹 사이트의 편집기에 붙여 넣습니다.

      다음 창 코드 텍스트 상자의 큰뿐만 아니라 당신이 그것을 포함하기 전에 비디오를 사용자 정의 할 수있는 몇 가지 옵션을 생성합니다 나타납니다. 예를 들어 임베드 코드에서 특정 타임스탬프에서 비디오를 시작할지 여부를 설정할 수 있습니다.

      원하는 대로 설정을 지정하면 창 상단의 코드화된 텍스트를 강조 표시합니다. 그런 다음 오른쪽 하단의”복사”를 클릭하십시오.

      youtube-embed-code

      최종 코드는 다음과 같습니다:

      <1839><<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< 다음은 작업이 완료되면 다음과 같습니다:

      슬라이드쉐어 프리젠테이션 및 인포그래픽 포함

      임베드하려는 슬라이드쉐어 프리젠테이션 또는 인포그래픽 찾기 SlideShare.net.

      slideshare_step_1

      “사용자 정의”를 클릭하십시오.”

      포함된 슬라이드쉐어 프레젠테이션 또는 인포그래픽을 사용자 지정하려면”사용자 지정”을 클릭하면 아래와 같은 옵션이 나타납니다. 원하는 옵션을 선택한 다음’삽입’섹션에서 코드를 복사하여 웹 사이트의 웹 사이트 보기에 붙여넣습니다.2653>

      <센터>및</센터>를 추가하여 포함된 슬라이드쉐어를 가운데에 배치할 수 있습니다.

      최종 코드는 다음과 같습니다:

      <센터><www.slideshare.net/slideshow/embed_code/31128788 2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 12 월 1 일,2015 년 2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 12 월 1 일,2018 년 target=”_blank”>HubSpot</a></strong></div></center>

      그게 다야! 여기에 당신이 완료되면 어떻게 보일지:

      이러한 임베드 코드 중 일부는 블로그 나 웹 사이트에 완벽하게 볼 수있는 약간의 조정이 필요할 수 있지만,이 단계를 사용하여,당신은 좋은 시작에 떨어져 있어야합니다. 해피 임베딩!

      칸바 허브스팟 웹사이트 전자책

답글 남기기

이메일 주소는 공개되지 않습니다.