쳇. 미리암을 나눠먹을 때 벌레 깡통을 조금 열었습니다. "내가 아직 인디웹에 있지?" 와 내 자신의 문제를 한탄하는 짧은 게시물 인디웹 기차를 타러 갑니다. 그러나 그것은 좋은 벌레 캔입니다.
그 짧은 글을 게시한 다음 날쯤이었던 것 같아요. 데이비드 샨스케 IndieWeb과 IndieWeb을 구성하는 구성 요소를 둘러싸고 내 머리를 감싸는 데 도움을 주겠다고 제안했습니다. 터무니없이 도움이 되지 않았다면 젠장! 싶을 정도로 David가 우리가 이야기를 나눈 후 쓴 새 게시물에 연결해 주세요., 그런 다음 (1) 내용을 기록하는 데 도움이 되고 (2) 나중에 참조할 수 있기 때문에 가능한 한 여기에서 내용을 요약합니다.
예, IndieWeb은 혼란스럽습니다.
David는 실제로 누군가가 IndieWeb 기능으로 WordPress 사이트를 설정하도록 도왔습니다. 그 사람도 여러 조각들이 어떻게 서로 맞물리는지 이해하려고 애썼다. 그래서 David는 Miriam과 내가 글을 쓰고 있을 때 이미 이 생각을 염두에 두고 있었습니다.
"IndieWeb"은 많은 사람들에게 새로운 용어이며 많은 혼란이 발생합니다. 프레임워크인가요? 철학? 일련의 표준? 그것이 무엇인지에 따라 기대는 그것이 그 일부가 되는 것처럼 보입니다.
위의 모든 것입니다. 그리고 그것은 조금 굳어질 필요가 있습니다. 다양한 렌즈를 통해 IndieWeb을 보면 본질적으로 혼동되는 것이 없습니다. David의 게시물을 읽은 후 내 이해는 IndieWeb이 프로토콜 집합에 가깝다는 것입니다. 마크업에서 구조화된 데이터나 OpenGraph로 작업하는 것과 비슷합니다. 그 자체로는 설치할 것이 없지만 작업에 통합하는 방법에 대한 표준이 있습니다.
귀하의 ID는 IndieWeb을 강화합니다. 다시 말해서, 귀하의 사이트는 귀하의 신원을 확립하고 다음과 같은 많은 작업을 수행하는 데 사용될 수 있습니다.
- 다른 IndieWeb 지원 사이트가 언급되면 알림
- 멘션되면 다른 IndieWeb 사이트에서 알림 받기
- 멘션에서 정보를 가져와 표시할 형식 지정
- 자신의 웹사이트(Google 로그인 버튼이지만 사이트에 연결됨)를 통해 신원을 인증합니다.
- …다른 것들 사이.
그 종류가 핑백처럼 들린다면, 글쎄요, 그렇습니다. 그러나 훨씬 더 강력하고 유지 관리됩니다.
워드프레스에서 IndieWeb 기능을 구현하는 것은 정적 사이트보다 다릅니다(아마도 더 쉽습니다).
가장 큰 차이점은 WordPress가 IndieWeb-y 작업을 수행하는 데 필요한 많은 요구 사항을 제공한다는 것입니다. 저는 David가 다음과 같이 설명하는 방식을 좋아합니다.
WordPress의 IndieWeb 구현은 사용하도록 선택할 수 있거나 선택할 수 없는 [시리즈] 빌딩 블록으로, 이것이 훌륭하지만 때로는 혼란스럽습니다. 워드프레스에는 옵션이 아닌 결정의 철학이 있습니다. 그러나 IndieWeb은 모든 옵션에 관한 것입니다. 귀하에게 적합한 기능을 구축하는 것입니다.
이러한 빌딩 블록은 IndieWeb 프로토콜 및 기술을 WordPress에 추가하기 위해 설치하는 플러그인입니다. 많은 작업이 필요하기 때문에 쉽게 사용할 수 있다는 것이 좋습니다. 그러나 정적 사이트를 실행하면 대부분의 사이트를 직접 구축해야 합니다.
David의 게시물은 100% WordPress 구현에 중점을 두고 있습니다. 마일리지는 다를 수 있지만 그의 게시물을 읽은 후 사용할 수 있는 프로토콜과 프로토콜이 어떻게 결합되는지에 대한 더 나은 아이디어를 얻을 수 있을 것입니다.
IndieWeb WordPress 플러그인은 귀하의 신원을 설정합니다.
나는 그것이 뒤에서 너무 많은 일을 하고 있다고 생각했지만, 그보다 훨씬 더 간단합니다.
플러그인은 자체적으로 IndieWeb에서 볼 때 ID 설정을 처리합니다. H카드 템플릿과 위젯을 제공합니다. H-Card는 사람이나 장소에 대한 정보를 표시하기 위한 마크업입니다. 따라서 이것은 많은 사람들이 어쨌든 자신의 사이트에 넣기로 선택하는 요소입니다.
따라서 실제로 WordPress 테마를 올바르게 표시하여 동일한 종류의 것을 얻을 수 있습니다. 여기서 편리함은 다음을 지원하기 위해 표시되는 편리한 작은 템플릿을 h-card
열린 형식 테마의 위젯 영역에 드롭하는 위젯.
다음은 매우 자세한 예입니다. h-card
에서 가져온 마크업 Microformats2에 대한 문서:
<div class="h-card"> <img class="u-photo" alt="photo of Mitchell" src="https://webfwd.org/content/about-experts/300.mitchellbaker/mentor_mbaker.jpg"/> <a class="p-name u-url" href="http://blog.lizardwrangler.com/" >Mitchell Baker</a> (<a class="u-url" href="https://twitter.com/MitchellBaker" >@MitchellBaker</a>) <span class="p-org">Mozilla Foundation</span> <p class="p-note"> Mitchell is responsible for setting the direction and scope of the Mozilla Foundation and its activities. </p> <span class="p-category">Strategy</span> <span class="p-category">Leadership</span>
</div>
저 클래스 이름이 보이시나요? 다음과 같은 수업 .h-card
, u-photo
, p-name
등은 모두 사람의 신원에 대한 컨텍스트 의미를 제공하고 JSON으로 구문 분석됩니다.
{ "items": [{ "type": ["h-card"], "properties": { "photo": ["https://webfwd.org/content/about-experts/300.mitchellbaker/mentor_mbaker.jpg"], "name": ["Mitchell Baker"], "url": [ "http://blog.lizardwrangler.com/", "https://twitter.com/MitchellBaker" ], "org": ["Mozilla Foundation"], "note": ["Mitchell is responsible for setting the direction and scope of the Mozilla Foundation and its activities."], "category": [ "Strategy", "Leadership" ] } }]
}
플러그인이 전송, 수신 또는 구문 분석을 수행하지 않습니다. 대신 마크업에서 신원을 확인할 수 있는 방법을 WordPress 사이트에 제공합니다.
모든 WordPress 테마가 Microformats를 지원하는 것은 아닙니다.
나처럼 "Microformats"를 처음 봤을 때 머리를 긁적였다면 David는 이를 멋지게 정의합니다.
[…] 마이크로포맷… 요소를 식별할 수 있도록 HTML을 마크업하는 방법. 이를 수행하는 여러 방법 중 하나이지만 매우 간단하고 읽기 쉬운 방법이므로 IndieWeb 커뮤니티에서 인기가 있습니다.
David가 계속 말하듯이 문제는 많은 테마가 Microformats에 친숙한 방식으로 표시되지 않는다는 것입니다. 마이크로포맷2 플러그인 고치도록 설계되었습니다. 즉, David는 플러그인이 이를 수행하는 방법이 극히 제한적이라는 점을 재빠르게 지적하고 대신 테마를 직접 표시할 것을 권장합니다.
David에 따르면 Webmention 플러그인의 다음 주요 릴리스에는 사용할 수 있는 콘텐츠와 이미지를 감지하고 Microformats2 지원을 위해 형식을 지정하는 더 스마트한 방법이 포함될 것입니다.
Webmentions는 알림을 보내고 받습니다.
알겠습니다. 사이트를 통해 신원을 확인하고 검색할 수 있도록 설정했다면 h-card
Microformats2를 사용하여 지원합니다. 엄청난! 알림을 보내고 받는 운영자로 작동하는 중간에 여전히 뭔가가 필요합니다. 다시 말해, 웹멘션이라고 하는 다른 사이트에서 귀하를 언급할 때 귀하를 언급하는 사이트는 해당 언급을 귀하에게 보낼 수 있는 방법이 필요하고 귀하의 사이트는 이를 수락할 방법이 필요합니다(또는 그 반대의 경우도 마찬가지).
그게 뭐야 웹멘션 플러그인 를 위한 것입니다. 그것은 또한 아마도 내 IndieWeb 혼란의 대부분의 원인일 것입니다. 데이터를 포매팅하는 것 같아서 보내고 받기 위한 추가 서비스가 필요하다고 생각했습니다. 아니요! 멘션을 생성하는 것이 아니라 실제로 데이터를 보내고 받는 것입니다. 데이비드에게 돌아가서:
플러그인이 구축되었을 때 플러그인은 웹멘션을 수신 및 전송하는 업무만 처리했으며 디스플레이는 어느 정도 처리하지 않았습니다. 별도의 플러그인인 Semantic Linkbacks는 웹멘션뿐만 아니라 이전 핑백 및 트랙백 프로토콜에 대해서도 이를 처리했습니다.
따라서 Webmention 플러그인은 알림을 전달합니다. 한편, Semantic Linkbacks라는 또 다른 플러그인이 데이터를 처리합니다. 그리고 시맨틱 링크백은 도대체 무엇입니까?
시맨틱 링크백은 데이터를 가져오고 처리합니다.
시맨틱 링크백 프로세스의 다른 부분을 처리하는 또 다른 플러그인입니다. David가 이미 한 것보다 더 잘 설명할 수 있는 방법은 없습니다.
시맨틱 링크백은 다른 사이트가 귀하의 사이트에 링크되어 있다는 알림인 웹멘션을 취하고 다른 사이트를 가져와서 정보 표시를 렌더링하려고 합니다. 수행 방법은 프로필 사진(찾을 수 있는 경우)에서 전체 댓글로 해석하는 것까지 다양합니다.
Microformats를 사용하여 이 작업을 수행합니다.
다른 마크업을 처리하기 때문에 기본 IndieWeb 플러그인이 이미 이 작업을 수행하고 있을 것으로 예상했습니다. 그러나 귀하의 사이트에서 귀하의 신원을 확인할 수 있는 템플릿과 위젯만 제공합니다. Semantic Linkbacks 플러그인이 들어오는 웹멘션을 가져오면 데이터를 가져와 형식을 지정한 다음 표시를 시도합니다.
플러그인이 Webmention 플러그인의 다음 버전과 어느 정도 병합(또는 대체)될 것 같습니다.
많은 사람들이 테마를 수정하는 것을 좋아하지 않거나 편안하지 않기 때문에 Webmentions의 새 버전에는 표시할 이미지나 요약을 찾는 여러 다른 방법이 포함됩니다. OpenGraph(Facebook 및 Twitter는 제공된 URL을 표시하기 위해 사용 ) 페이지의 WordPress REST API 버전을 감지하고 이를 사용하여 작성자 이름과 프로필 이미지를 가져옵니다. 그들 중 누구도 Microformats만큼 많은 컨텍스트를 제공하지는 않지만 경험은 여전히 설치할 가치가 있습니다.
JSON 응답 및 표시 형식을 위해 WordPress REST API를 활용하기 때문에 확실히 좋습니다.
Brid.gy는 상호 작용을 표시하는 데 도움이 되는 서비스입니다.
웹멘션은 상호작용이 될 수 있습니다. 예를 들어 누군가가 Twitter에서 귀하의 게시물을 좋아하거나 리트윗하는 경우입니다.
좋아요를 재게시와 댓글과 무슨 일이 필요한지 구별하고 이러한 구별을 하려면 Twitter(또는 무엇이든) API를 구현해야 합니다.
그것은 당신이 확실히 할 수 있는 일입니다! 그러나 플러그 앤 플레이를 원한다면 IndieWeb 커뮤니티 회원 중 한 명이 Brid.gy. 계정을 만들고 사이트를 연결하고 서비스에 앱 권한을 부여하면 끝입니다!
Brid.gy가 수행한 작업은 본질적으로 Twitter, Facebook, Instagram 및 기타용 API를 구현하여 해당 서비스에서 귀하의 신디케이트된 게시물과 상호 작용하는 게시물을 감지하면 Webmention이 귀하의 사이트로 전송되고 자신의 사이트에 게시하는 과정입니다.
더 많은 것이 있습니다!
빠른 조회수:
- 인디인증: OAuth 2 기반 프로토콜입니다. 플러그인 자체 호스팅 사이트(기본적으로 자체 Google 로그인 버튼이지만 해당 끝점을 직접 설정하거나 별도의 호스팅 API에 의존할 필요가 없음)를 통해 신원을 인증하는 데 사용할 수 있는 WordPress REST API의 끝점을 설정합니다.
- 마이크로펍: WordPress를 사용하지만 다른 편집기를 선호하는 사용자는 설치할 수 있습니다. 마이크로펍 플러그인. 이 끝점을 추가합니다 이를 통해 사이트에 콘텐츠를 게시하고 Micropub 지원 편집기를 사용하여 Microformats2 피드에서 항목을 생성할 수 있으므로 WordPress 블록 편집기 외부에서 콘텐츠를 작성할 수 있는 더 많은 옵션이 제공됩니다.
- 간단한 위치: David는 이 플러그인을 작성했습니다. 그리고 그가 나를 위해 그것을 시연했을 때 나는 매우 감동했습니다. 아이디어는 게시물을 작성한 시점의 날씨를 표시하는 것부터 게시물 위치를 기반으로 포함된 지도에 게시물의 전체 아카이브를 만드는 것까지 모든 것에 사용할 수 있는 현재 위치에서 데이터를 가져오는 것입니다. 솔직히 WordPress에 이와 같은 것이 직접 구워지는 것을 보고 싶습니다.
업데이트된 흐름
지난 게시물에서 다양한 부분을 설명하는 일러스트레이션을 만들려고 시도했지만 무슨 일이 일어나고 있는지에 대한 최신 정보를 가지고 다시 시도해 보겠습니다.
이 모든 것이 말이 됩니까?
시간을 내어 워드프레스에서 IndieWeb을 구현하는 방법을 보여주신 David에게 감사의 인사를 전합니다. 내가 모든 뉘앙스를 완전히 이해했다고 주장할 수는 없지만, 적어도 그것을 실현하는 데 필요한 철학, 프로토콜 및 기술과 같은 부분을 충분히 이해하고 있다고 느낍니다.
나는 그것을 당신에게 돌리고 싶습니다! 이것은 당신을 위해 사물을 명확히하는 데 도움이됩니까? 이해하기 어려운 점이 있습니까? 이제 IndieWeb 기능으로 WordPress 사이트를 구성할 수 있다고 생각하십니까? 댓글로 가져갑시다!
WordPress 사이트에서 IndieWeb을 신비화하기 원래에 게시 CSS 트릭. 너는해야한다. 뉴스레터 받기.
- "
- a
- 소개
- 계정
- 방과 후 액티비티
- 추가
- All
- 수
- 이미
- 대안
- 중
- 다른
- API를
- API
- 앱
- 아카이브
- 지역
- 약
- 가능
- 때문에
- 무대 뒤에서
- BEST
- 사이에
- 비트
- 블록
- 건물
- 사업
- 전화
- 범주
- 왼쪽 메뉴에서
- 청구
- 수업
- 수업
- 통신
- 커뮤니티
- 구성 요소들
- 혼동
- 연결
- 함유량
- 계속
- 편의
- 만들
- 만들기
- Current
- 데이터
- 일
- 결정
- 의존
- 설계
- 상세한
- DID
- 차이
- 다른
- 직접
- 디스플레이
- 아래 (down)
- 드롭
- 편집자
- 요소
- 임베디드
- 종점
- 본질적으로
- 확립 된
- 개설하다
- 등
- 모두
- 예
- 기대
- 기대하는
- 경험
- 페이스북
- 특징
- 먼저,
- 처음으로
- 맞게
- 수정
- 흐름
- 집중
- 체재
- Foundation
- 뼈대
- 에
- 가득 찬
- 점점
- 기부
- 좋은
- 구글
- 핸들
- 처리
- 발생
- 머리
- 도움
- 도움이
- 여기에서 지금 확인해 보세요.
- 호스팅
- 방법
- How To
- HTTPS
- 생각
- 통합 인증
- 영상
- 형상
- 구현
- 이행
- 기타의
- 포함
- 정보
- 인스타그램
- 설치
- 통합
- 상호 작용
- IT
- 그 자체
- Leadership
- 아마도
- 제한된
- 작은
- 위치
- 애정
- 만든
- 주요한
- 확인
- 제작
- 유튜브 영상을 만드는 것은
- 지도
- 의미
- 회원
- 언급하다
- 신경
- 배우기
- 가장
- 모질라
- 이름
- 필요
- 요구
- 공고
- 제공
- 제공
- 열 수
- 연산자
- 옵션
- 기타
- 자신의
- 부품
- 사람들
- 혹시
- 사람
- 철학
- 조각
- 개
- 연극
- 플러그인
- 플러그인
- 인기 문서
- 가능한
- 게시물
- 문제
- 방법
- 프로필
- 속성
- 프로토콜
- 프로토콜
- 제공
- 제공
- 제공
- 게시
- 출판
- 빠른
- RE
- 읽기
- 받다
- 추천하다
- 공개
- 대체
- 필수
- 요구조건 니즈
- 응답
- 책임
- REST
- 달리는
- 말했다
- 같은
- 장면
- 보고
- 감각
- 연속
- 서비스
- 서비스
- 세트
- 설정
- 몇몇의
- 공유
- 변화
- 짧은
- 단순, 간단, 편리
- 이후
- 대지
- 사이트
- So
- 어떤 사람
- 무언가
- 기준
- 아직도
- 전략
- 구조화
- SUPPORT
- 복용
- 기술
- 기술
- XNUMXD덴탈의
- 소스
- 테마
- 맡은 일
- 일
- 을 통하여
- 시간
- 함께
- 상단
- 트위터
- 이해
- 이해
- 곧 출시
- 사용
- 여러
- 확인
- 버전
- 관측
- 방법
- 웹 사이트
- 뭐
- 누구
- 없이
- 훌륭한
- 워드프레스(WordPress)
- 워드 프레스 플러그인
- 워드 프레스 테마
- 말
- 작업
- 운동하다
- 일하는
- 벌레
- 가치
- 쓰기
- 너의