Registre o conteúdo do construtor de páginas para tradução

Aprenda a registrar o conteúdo personalizado do construtor de páginas para tradução usando o arquivo wpml-config.xml. Registre strings, mídia, widgets do construtor de páginas, IDs de shortcode e muito mais.

Este guia é para desenvolvedores que criam temas e plugins ou adicionam código personalizado de construtor de páginas ao seu site.

Se você usa um construtor de páginas de terceiros e não consegue traduzir os widgets personalizados no seu site, entre em contato com o suporte do WPML.

Precisa gerar um arquivo wpml-config.xml? Visite nosso guia passo a passo para gerar automaticamente um arquivo de configuração usando o plugin Multilingual Tools.

Traduzir strings

Vamos considerar um exemplo em que você tem um separador de texto adicionado a uma página usando o Visual Composer. Esse separador tem um título, e seu shortcode é assim:

[vc_text_separator title="Separator Title"]

Para traduzir o título deste separador de texto, você precisa adicionar algumas linhas ao seu arquivo wpml-config.xml. Dessa forma, o WPML “saberá” que o título desse separador precisa de tradução.

O código a seguir é um exemplo do que você precisa adicionar ao arquivo wpml-config.xml neste caso.

Exemplo de adição de um shortcode de construtor de páginas ao arquivo wpml-config.xml

<wpml-config>
  <shortcodes>
    <shortcode>
        <tag>vc_text_separator</tag>
        <attributes>
            <attribute>title</attribute>
        </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

Vamos analisar a estrutura do exemplo acima:

Comece com a tag shortcodes. Quaisquer shortcodes no seu site que precisem ser traduzidos devem ser colocados sob esta tag.
Use a tag shortcode para envolver todas as tags pertencentes a um único shortcode.
Use a tag chamada tag para definir o nome do shortcode. Neste caso, é o vc_text_separator. Se preferir, você pode adicionar rótulos personalizados opcionais às tags. Esses rótulos serão exibidos ao lado do texto tanto no Editor de tradução avançado quanto no Editor de tradução clássico. Arquivos XLIFF exportados também incluem esses rótulos. Veja o exemplo abaixo de como adicionar rótulos a tags e atributos.
Os shortcodes podem ter um ou mais atributos, então você precisa envolvê-los na tag attributes (plural) e usar a tag attribute (singular) para definir o título de cada atributo.

Os construtores de páginas (às vezes) incluem elementos de design que têm atributos de link.

Você pode fazer com que os links internos apontem automaticamente para a versão traduzida desse post usando a opção de link: type="link".

Você pode usar o atributo encoding com este. Ele lida com a codificação especial que vários construtores de páginas usam. O atributo encoding geralmente é específico para o construtor de páginas que você usa. Ele aceita os seguintes valores:

base64 – Shortcode de HTML bruto do Visual Composer. O shortcode armazena o HTML como uma string base64.
vc_link– Formatação especial de link para o Visual Composer.
vc_values – Codificação especial do Visual Composer para valores em widgets de barra de progresso, gráfico de pizza e gráfico de linha.
av_link – Formatação especial de link para o Enfold.
allow_html_tags– Geralmente, as tags HTML são removidas dos atributos de shortcode. Defina o encoding como allow_html_tags se o atributo de shortcode dever permitir tags HTML. Use isso com cautela, pois permitir tags HTML em algumas situações pode bagunçar a formatação e pode ser um problema de segurança.

Exemplo de adição de atributo de link de shortcode: type="link"

<wpml-config>
  <shortcodes>
    <shortcode>
            <tag>av_button</tag>
            <attributes>
                <attribute>label</attribute>
                <attribute type="link" encoding="av_link">link</attribute>
            </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

Se você está pensando em usar shortcodes urlencoded, certifique-se de ler a página sobre Como traduzir shortcodes urlencoded.

Exemplo de adição de rótulos de tag e atributo

<wpml-config>
    <shortcodes>
        <shortcode>
            <tag label="My shortcode label">my_shortcode</tag>
            <attributes>
                <attribute label="Shortcode title">title</attribute>
            </attributes>
        </shortcode>
    </shortcodes>
</wpml-config>

Adicionar rótulos a tags e atributos permite que você exiba rótulos personalizados no Editor de tradução avançado ou no Editor de tradução clássico. Isso pode ajudar o tradutor a entender melhor o contexto da string.

Agrupar campos para melhor organização

Para melhorar a clareza e a organização da sua configuração XML, você pode adicionar o nome do grupo como prefixo aos rótulos dos campos. Considere este exemplo de um botão de CTA:

<wpml-config>
    <shortcodes>
        <shortcode>
            <tag label="Call To Action: Content">et_pb_cta</tag>
            <attributes>
                <attribute label="Call To Action: Title">title</attribute>
                <attribute label="Call To Action: Button Text">button_text</attribute>
                <attribute label="Call To Action: Button URL" type="link">button_url</attribute>
            </attributes>
        </shortcode>
    </shortcodes>
</wpml-config>

Aqui, cada atributo dentro do shortcode et_pb_cta é prefixado com o rótulo Call To Action: , que também aparece no Editor de tradução avançado:

Traduzindo o botão de CTA no Editor de tradução avançado

Traduzir mídia

Você pode usar a Tradução de mídia do WPML para usar imagens diferentes para idiomas diferentes no conteúdo do construtor de páginas. Isso é feito convertendo IDs de imagem e URLs de imagem. Você deve “dizer” ao construtor de páginas que usa shortcodes como fazer essa conversão. O código a seguir é um exemplo do que você precisa adicionar ao arquivo wpml-config.xml neste caso.

Exemplo de adição de um shortcode de construtor de páginas ao arquivo wpml-config.xml para tradução de imagem

<wpml-config>
  <shortcodes>
    <shortcode>
        <!-- Convert media IDs in `gallery_ids` attribute, and ignore the shortcode content -->
        <tag ignore-content="1">et_pb_gallery</tag>
        <attributes>
          <attribute type="media-ids">gallery_ids</attribute>
        <attributes>
    </shortcode>
    <shortcode>
        <!-- Convert the media URL in the content, translate some string attributes for `title` and `alt`, convert media URL in `src` attribute -->
        <tag type="media-url">et_pb_image</tag>
        <attributes>
          <attribute>title_text</attribute>
          <attribute>alt</attribute>
          <attribute type="media-url">src</attribute>
        </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

Você pode usar os seguintes valores:

ignore-content – Você pode usá-lo dentro de um elemento tag. Este valor é opcional e pode ser 0 ou 1. Você pode usar este atributo para obter compatibilidade com versões anteriores para novos shortcodes de mídia. Se o valor for definido como 1, o conteúdo do shortcode não será processado.
type – Você pode usá-lo dentro de um elemento tag. Você também pode usar conteúdo de shortcode que contenha URL de mídia como o valor opcional dentro de media-url.
type – Você também pode usá-lo dentro de um elemento attribute. Neste caso, ele pode ter um dos seguintes valores opcionais:
- media-ids – uma lista separada por vírgulas de IDs de mídia.
- media-url – URL da mídia
- link – aponta para outra página no site e o WPML o converterá automaticamente para o URL da página traduzida

Traduzir mídia em atributos de bloco

Você também pode usar os tipos de atributos media-url e media-ids com os blocos do Gutenberg para traduzir mídias, como imagens de fundo. Isso funciona de forma semelhante aos shortcodes, mas usa o elemento <gutenberg-block> com elementos <key> aninhados para definir type="media-url" e type="media-ids".

Usar este elemento permite que nosso complemento Tradução de mídia do WPML traduza imagens de fundo.

Isso funciona tanto para os blocos do Gutenberg quanto para o Divi 5. Esta versão do Divi usa blocos para armazenar conteúdo, então o elemento <gutenberg-block> funciona para adicionar a tradução de mídia.

Aqui está um exemplo de adição de tradução de mídia para atributos de bloco do Gutenberg:

<wpml-config>
  <gutenberg-blocks>
        <gutenberg-block type="divi/section" translate="1">
            <key name="module">
                <key name="decoration">
                    <key name="background">
                        <key name="desktop">
                            <key name="value">
                                <key name="image">
                                    <key name="url" type="media-url" />
                                </key>
                            </key>
                        </key>
                    </key>
                </key>
            </key>
        </gutenberg-block>
  </gutenberg-blocks>
</wpml-config>

Traduzir widgets do construtor de páginas

O WPML permite que você registre widgets do construtor de páginas dentro do seu arquivo de configuração de idioma. Para informações detalhadas, veja nossa página de documentação sobre como registrar widgets do construtor de páginas para tradução.

Converter IDs de shortcode automaticamente

A partir do WPML 4.5.9, você pode declarar os IDs de posts ou termos de taxonomia localizados nos atributos de shortcode. Esses IDs podem então ser convertidos automaticamente no frontend do seu site.

A partir do WPML 4.8, essa mesma lógica se estende aos IDs de objetos armazenados em textos de administração, bem como aos IDs em campos personalizados de posts e campos de termos de taxonomia personalizados.

Por exemplo, considere o seguinte shortcode:

[foo_product_list product_ids="12,34,56"]

Você pode declarar que o atributo product_ids está contendo IDs de post com a seguinte configuração:

Declarando que o atributo product_ids contém IDs de post

<shortcode>
    <tag ignore-content="1">foo_product_list</tag>
    <attributes>
        <attribute type="post-ids" sub-type="product">product</attribute>
    </attributes>
</shortcode>

No frontend, o shortcode é convertido automaticamente para:

[foo_product_list product_ids="13,35,57"]

Você pode usar os seguintes atributos de configuração:

type – pode ser post-ids ou taxonomy-ids
sub-type (opcional) – uma entidade específica do type se já for conhecida. Por exemplo, product para o tipo de post personalizado Product vindo do WooCommerce. Se não for definido, a entidade específica será adivinhada.

A conversão de ID é versátil e tenta se adaptar à maioria dos formatos possíveis de IDs (ID único, lista de IDs, array serializado, array codificado em JSON).

Recursos adicionais

Para saber mais sobre o arquivo wpml-config.xml , visite o guia Arquivos de configuração de idioma.

Para personalizar outros elementos usando o arquivo wpml-config.xml, visite nossos guias adicionais: