Bem, caramba. Abri uma latinha de minhocas ao compartilhar o da Miriam “Já estou no IndieWeb?” com uma postagem curta lamentando meu próprio problema entrando no trem IndieWeb. Mas é uma boa lata de minhocas.
Acho que foi algo como no dia seguinte à publicação daquele pequeno post que David Shanske entrei em contato e me ofereci para ajudar a entender o IndieWeb e os componentes que ele compreende. E caramba, se não foi ridiculamente útil! Tanto que eu gostaria vincule você a uma nova postagem que David escreveu depois que conversamos, então resuma as coisas aqui da melhor maneira possível porque (1) é útil anotar as coisas e (2) ter uma referência para mais tarde.
Sim, o IndieWeb é confuso.
Na verdade, David ajudou alguém a configurar seu site WordPress com poderes IndieWeb. Essa pessoa também estava lutando para entender como as diversas peças se encaixavam. Então, David já tinha isso em mente quando Miriam e eu estávamos escrevendo.
“IndieWeb” é um termo novo para muitas pessoas e é aí que surge muita confusão. É uma estrutura? Uma filosofia? Um conjunto de padrões? Dependendo de qual for, as expectativas mudam quanto à aparência de fazer parte dele.
É mais ou menos tudo isso. E isso precisa ser solidificado um pouco. Não há nada inerentemente confuso no próprio IndieWeb, uma vez que você o vê através dessas lentes diferentes. Depois de ler a postagem de David, entendi que o IndieWeb é mais um conjunto de protocolos. Mais ou menos como trabalhar com dados estruturados ou OpenGraph na marcação. Não há nada para instalar em si, mas existem padrões sobre como integrá-los ao seu trabalho.
Sua identidade fortalece o IndieWeb. Em outras palavras, seu site estabelece sua identidade e pode ser usado para fazer muitas coisas, como:
- Notificar outros sites suportados pelo IndieWeb quando eles forem mencionados
- Receba notificações de outros sites IndieWeb quando você for mencionado
- Obtenha informações de uma menção e formate-as para exibição
- Autentique sua identidade por meio de seu próprio site (como um botão de login do Google, mas conectado ao seu site)
- …entre outras coisas.
Se isso soa como pingbacks, bem, meio que é. Mas muito mais robusto e mantido.
É diferente (e talvez mais fácil) implementar recursos do IndieWeb no WordPress do que em um site estático.
A grande diferença é que o WordPress fornece muitos dos requisitos necessários para fazer coisas do tipo IndieWeb. Gosto de como David explica isso:
A implementação do IndieWeb no WordPress é uma [série] de blocos de construção que você pode ou não escolher usar, o que o torna maravilhoso, mas às vezes confuso. WordPress tem uma filosofia de decisões, não de opções. Mas o IndieWeb tem tudo a ver com opções… sobre construir os recursos certos para você.
Esses blocos de construção são plug-ins que você instala para adicionar protocolos e tecnologias IndieWeb ao WordPress. É incrível que eles estejam prontamente disponíveis porque isso tira muito trabalho das coisas. Porém, administrando um site estático, você terá que estabelecer a maior parte disso sozinho.
O post de David é 100% focado na implementação do WordPress. Sua milhagem pode variar, mas você certamente terá uma ideia melhor de quais protocolos estão disponíveis e como eles se encaixam depois de ler a postagem dele – e espero que esta também.
O plugin IndieWeb WordPress estabelece sua identidade.
Achei que estava fazendo muita coisa nos bastidores, mas é muito mais simples do que isso:
O plugin por si só cuida do estabelecimento de sua identidade conforme o IndieWeb a vê. Ele oferece um modelo e widget de cartão h. H-Card é a marcação para marcar informações sobre uma pessoa ou lugar. Então, esse é um elemento que muitas pessoas optam por colocar em seus sites de qualquer maneira.
Então, realmente, é possível obter o mesmo tipo de coisa marcando corretamente um tema WordPress. A conveniência aqui é que você obtém um pequeno modelo útil marcado para suportar o h-card
formato aberto e um widget para soltá-lo na área de widgets de um tema.
Aqui está um exemplo super detalhado do h-card
marcação extraída do documentação para microformatos2:
<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>
Veja esses nomes de classe? Aulas como .h-card
, u-photo
, p-name
, etc., todos fornecem significado contextual para a identidade de uma pessoa, que é então analisada como 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" ] } }]
}
O plugin não está enviando, recebendo ou analisando. Em vez disso, ele fornece ao site WordPress uma maneira de verificar sua identidade na marcação.
Nem todos os temas WordPress suportam microformatos
Se você coçou a cabeça na primeira vez que viu “Microformatos” como eu, David define muito bem:
[…] Microformatos…uma forma de marcar HTML para permitir a identificação de elementos. É uma das várias maneiras de fazer isso, mas é muito simples e legível, por isso é popular na comunidade IndieWeb.
O problema, como David continua, é que muitos temas não são marcados de maneira compatível com microformatos - que é o que o Plug-in Microformatos2 foi projetado para consertar. Dito isso, David é rápido em ressaltar que o plugin é extremamente limitado na forma como faz isso e recomenda, em vez disso, marcar um tema manualmente.
De acordo com David, o próximo grande lançamento do plugin Webmention provavelmente incluirá maneiras mais inteligentes de detectar conteúdo e imagens que ele pode usar e formatá-los para suporte a Microformats2.
Webmenções enviam e recebem notificações.
OK, então se você estabeleceu sua identidade por meio de seu site para que possa ser descoberto e seu site esteja marcado para h-card
suporte usando Microformatos2. Ótimo! Você ainda precisa de algo intermediário funcionando como uma operadora que envia e recebe notificações. Em outras palavras, quando outro site menciona você – chamado Webmention – o site que menciona você precisa de uma forma de suportar o envio dessa menção para você, e seu site precisa de uma forma de aceitá-la (ou vice-versa).
Isso é o que o Plug-in de menção na web é para. Provavelmente também é a fonte da maior parte da minha confusão no IndieWeb. Achei que estava formatando dados e precisava de um serviço adicional para enviá-los e recebê-los. Não! Na verdade, é enviar e receber os dados, em vez de criar a menção. De volta a Davi:
Na época em que foi construído, o plugin cuidava apenas do recebimento e envio de menções na web, não lidando com a exibição em nenhum grau. Semantic Linkbacks, um plug-in separado, cuidava disso não apenas para menções na web, mas também para os protocolos mais antigos de pingback e trackback.
Portanto, o plugin Webmention está comunicando notificações. Enquanto isso, outro plugin chamado Semantic Linkbacks é quem trata os dados. E o que diabos são Linkbacks Semânticos?
Linkbacks semânticos buscam e manipulam dados.
Linkbacks semânticos é outro plugin que cuida de outra parte do processo. Não há como explicar melhor do que David já faz:
Os Linkbacks Semânticos recebem uma menção na web, que é uma notificação de que outro site criou um link para algo em seu site, busca o outro site e tenta exibir as informações. A forma como isso é feito pode variar desde apenas uma foto de perfil (se for possível encontrar uma) até a interpretação como um comentário completo.
Isso é feito usando microformatos.
Eu esperava que o plugin principal do IndieWeb já estivesse fazendo isso, pois ele lida com outras marcações. Mas ele fornece apenas o modelo e o widget para colocar sua identidade em seu site. Depois que o plug-in Semantic Linkbacks busca uma menção da web recebida, ele pega os dados, formata-os e tenta exibi-los.
Parece que o plugin será mesclado (ou substituído por) uma versão futura do plugin Webmention:
Como muitas pessoas não estão inclinadas ou não se sentem confortáveis em modificar um tema, a nova versão do Webmentions incluirá várias maneiras alternativas diferentes de tentar encontrar uma imagem ou resumo para exibir… do OpenGraph (que o Facebook e o Twitter usam para exibir URLs fornecidos a ele ) para detectar a versão da API REST do WordPress de uma página e usá-la para obter o nome do autor e a imagem do perfil. Nenhum deles fornecerá tanto contexto quanto os microformatos, mas a experiência ainda valerá a pena instalar.
Isso certamente é bom, pois utiliza a API REST do WordPress para a resposta JSON e a formata para exibição.
Brid.gy é um serviço para ajudar a exibir interações.
Uma Webmention pode ser uma interação, digamos que alguém gostou da sua postagem no Twitter ou a retuitou.
Diferenciando uma curtida de uma repostagem de um comentário de tudo o que precisa acontecer, e você precisaria implementar a API do Twitter (ou qualquer outra coisa) para traçar essas distinções.
Isso é algo que você certamente pode fazer! Mas se você preferir plug and play, um dos membros da comunidade IndieWeb criou um serviço chamado Noiva.gy. Você cria uma conta, conecta seu site e concede permissões de aplicativo ao serviço... então pronto!
O que o Brid.gy fez foi essencialmente implementar APIs para Twitter, Facebook, Instagram e outros, para que ao detectar que uma postagem nesses serviços que interage com sua postagem sindicalizada, uma Webmention seja enviada ao seu site e passe pelo processo de publicação em seu próprio site.
Há muito mais!
Acessos rápidos:
- Autenticação Indie: Este é um protocolo baseado em OAuth 2. O plugin estabelece um ponto de extremidade na API REST do WordPress que pode ser usado para autenticar sua identidade por meio de seu próprio site auto-hospedado - essencialmente seu próprio botão de login do Google, mas sem estabelecer esse ponto de extremidade você mesmo ou precisar depender de uma API hospedada separada.
- Micropub: Para quem usa WordPress mas prefere um editor diferente pode instalar o Plug-in de micropub. Este adiciona um ponto final que permite que você publique conteúdo em seu site e, usando um editor compatível com Micropub, crie itens em um feed Microformats2, oferecendo muito mais opções para escrever conteúdo fora do Editor de blocos do WordPress.
- Localização simples: David escreveu este plugin e fiquei super impressionado quando ele fez uma demonstração para mim. A ideia é extrair dados de sua localização atual que podem ser usados para tudo, desde exibir o clima no momento em que você escreveu uma postagem até criar um arquivo inteiro de postagens em um mapa incorporado com base na localização da postagem. Sinceramente, eu adoraria ver algo assim inserido diretamente no WordPress.
O fluxo atualizado
Tentei fazer uma ilustração que descreva as diversas peças do meu último post, mas vamos tentar novamente com uma compreensão atualizada do que está acontecendo:
Tudo isso faz sentido?
Parabéns a David por entrar em contato e dedicar um tempo para me mostrar como é implementar o IndieWeb no WordPress. Não posso afirmar que entendo completamente todas as nuances, mas pelo menos sinto que tenho uma compreensão decente das peças – a filosofia, os protocolos e a tecnologia – que são necessárias para que isso aconteça.
Eu gostaria de virar isso para você! Isso ajuda a esclarecer as coisas para você? Há alguma coisa que você está lutando para entender? Você acha que agora consegue configurar um site WordPress com recursos do IndieWeb? Vamos aos comentários!
Desmistificando o IndieWeb em um site WordPress publicado originalmente em Truques de CSS. Você deve receba o boletim informativo.
- "
- a
- Sobre
- Conta
- atividades
- Adicional
- Todos os Produtos
- permite
- já
- alternativa
- entre
- Outro
- api
- APIs
- app
- arquivo
- ÁREA
- por aí
- disponível
- Porque
- Por trás das cenas
- MELHOR
- entre
- Pouco
- Bloquear
- Prédio
- negócio
- chamada
- Categoria
- Escolha
- reivindicar
- classe
- aulas
- comunicação
- comunidade
- componentes
- confusão
- conectado
- conteúdo
- continua
- facilidade
- crio
- Criar
- Atual
- dados,
- dia
- decisões
- Dependendo
- projetado
- detalhado
- DID
- diferença
- diferente
- diretamente
- Ecrã
- down
- Cair
- editor
- elementos
- incorporado
- Ponto final
- essencialmente
- estabelecido
- estabelece
- etc.
- tudo
- exemplo
- expectativas
- esperado
- vasta experiência
- Funcionalidades
- Primeiro nome
- primeira vez
- caber
- Fixar
- fluxo
- focado
- formato
- Foundation
- Quadro
- da
- cheio
- obtendo
- Dando
- Bom estado, com sinais de uso
- manipular
- Manipulação
- acontecer
- cabeça
- ajudar
- útil
- SUA PARTICIPAÇÃO FAZ A DIFERENÇA
- hospedado
- Como funciona o dobrador de carta de canal
- Como Negociar
- HTTPS
- idéia
- Dados de identificação:
- imagem
- imagens
- executar
- implementação
- Em outra
- incluir
- INFORMAÇÕES
- instalar
- integrar
- interação
- IT
- se
- Liderança
- Provável
- Limitado
- pequeno
- localização
- gosta,
- moldadas
- principal
- fazer
- FAZ
- Fazendo
- mapa,
- significado
- Membros
- menções
- mente
- mais
- a maioria
- Mozilla
- nomes
- necessitando
- Cria
- notificação
- oferecido
- Oferece
- aberto
- operador
- Opções
- Outros
- próprio
- parte
- Pessoas
- possivelmente
- pessoa
- filosofia
- peça
- peças
- Jogar
- plug-in
- plugins
- Popular
- possível
- POSTAGENS
- Problema
- processo
- Perfil
- Propriedades
- protocolo
- protocolos
- fornecer
- fornecido
- fornece
- publicar
- Publishing
- Links
- RE
- Leitura
- receber
- recomenda
- liberar
- substituído
- requeridos
- Requisitos
- resposta
- responsável
- DESCANSO
- corrida
- Dito
- mesmo
- Cenas
- vê
- sentido
- Série
- serviço
- Serviços
- conjunto
- contexto
- vários
- compartilhando
- mudança
- Baixo
- simples
- desde
- local
- Locais
- So
- Alguém
- algo
- padrões
- Ainda
- Estratégia
- estruturada
- ajuda
- tomar
- tecnologia
- Tecnologias
- A
- A fonte
- tema
- coisa
- coisas
- Através da
- tempo
- juntos
- topo
- compreender
- compreensão
- os próximos
- usar
- vário
- verificar
- versão
- Ver
- maneiras
- Site
- O Quê
- QUEM
- sem
- Maravilhoso
- WordPress
- WordPress Plugin
- Tema WordPress
- palavras
- Atividades:
- exercite-se
- trabalhar
- vermes
- Equivalente há
- escrita
- investimentos