Nova API WP_Customize - como funciona sob o capô?


16

Percebi que, se você fizer alterações através do novo recurso "personalizar", quando você navega em uma página diferente no documento de visualização do iframe, suas alterações ainda se aplicam, mesmo que não sejam salvas.

Parece que o WP está armazenando as alterações temporárias em algum lugar e as aplica no site se o site for exibido no modo "personalizar".

Mas como o site sabe que está no modo de personalização? Porque eu não vejo nenhum argumento de consulta anexado aos links ou algo assim.

Respostas:


9

Existem alguns bits aqui aplicáveis, mas o mais curto é esse código em customize-preview.js:

this.body.on( 'click.preview', 'a', function( event ) {
    event.preventDefault();
    self.send( 'scroll', 0 );
    self.send( 'url', $(this).prop('href') );
});

O event.preventDefault impede que os links realmente funcionem. O código a seguir envia uma mensagem de volta para cima informando a) a) rolar de volta para o topo da página eb) alterar o URL.

A razão para as mensagens aqui é porque não há apenas um iframe, há dois. A página em que você clicou é carregada dentro de outro iframe com as configurações do personalizador adicionadas a ela (via um POSTfato), então um efeito de desbotamento é usado para desbotar a antiga e desbotar a nova perfeitamente. Isso evita que a tela fique branca e feia e pisque quando mudar para a nova página.

Também elimina a necessidade de fazer filtragem no código do tema e potencialmente modificar a aparência da página. O tema é, assim, exibido como está, sem alterações significativas no conteúdo.

Existe um código semelhante para impedir que o envio do formulário funcione (ele simplesmente não faz nada) e assim por diante.

O filtro para interceptar e manipular os valores do personalizador está em class-wp-customize-setting.php. A preview()função adiciona os filtros necessários para lidar com os valores recebidos, a _preview_filter()função é esse filtro. Ele simplesmente recebe as chamadas get_option()ou get_theme_mod(), percebe quando elas devem ser modificadas e, em vez disso, retorna os valores modificados.


1

Você notará que, quando você clica em um link na janela de visualização do personalizador, a solicitação gerada é uma POSTsolicitação, e não uma normal GET. O personalizador parece substituir todos os cliques no link e fazer isso POSTcom os seguintes dados do formulário:

wp_customize: on
theme: themename
customized: {json-encoded-options-here}
customize_messenger_channel: preview-1

O campo personalizado é o que contém as opções que você modificou, para que os dados estejam sendo transmitidos para o seu tema. O código do personalizador intercepta (por meio de um filtro, não sei exatamente qual) as opções do seu tema quando elas são solicitadas e as substitui pelos valores no parâmetro customizado .


2
Dê uma olhada aqui: /wp-includes/class-wp-customize-manager.php...
brasofilo
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.