<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>woocommerce checkout &#8211; Turbosite &#8211; Blog</title>
	<atom:link href="https://www.turbosite.com.br/blog/tag/woocommerce-checkout/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.turbosite.com.br/blog</link>
	<description></description>
	<lastBuildDate>Wed, 17 Dec 2014 13:38:32 +0000</lastBuildDate>
	<language>pt-BR</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.1.2</generator>

<image>
	<url>https://www.turbosite.com.br/blog/wp-content/uploads/2026/09/cropped-logo_turbo_vermelha-32x32.png</url>
	<title>woocommerce checkout &#8211; Turbosite &#8211; Blog</title>
	<link>https://www.turbosite.com.br/blog</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Como adicionar campos personalizados no &#8220;checkout&#8221; do Woocommerce</title>
		<link>https://www.turbosite.com.br/blog/como-adicionar-campos-personalizados-no-checkout-do-woocommerce/</link>
		
		<dc:creator><![CDATA[turboajuda]]></dc:creator>
		<pubDate>Wed, 17 Dec 2014 13:38:32 +0000</pubDate>
				<category><![CDATA[Dicas]]></category>
		<category><![CDATA[Tutoriais]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[adicionar campos woocommerce]]></category>
		<category><![CDATA[woocommerce checkout]]></category>
		<guid isPermaLink="false">http://blog.turbosite.com.br/?p=3962</guid>

					<description><![CDATA[As vezes é necessário personalizar um pouco o Checkout do Woocommerce e é isto que vamos ensinar, como criar novos campos na tela de fechamento de pedido.]]></description>
										<content:encoded><![CDATA[<p>Sem dúvida, o Woocommerce é unânime em questão e-commerce com WordPress, são mais de 5 milhões de Downloads e diversos plugins para estender suas funcionalidades.</p>
<p>Diante deste gigante do e-commerce, as vezes é necessário personalizar um pouco e é isto que vamos ensinar, como criar novos campos na tela de fechamento de pedido. Criar campos personalizados no Woocommerce pode parecer complicado, mas, vamos mostrar uma maneira fácil, rápida e sem a necessidade de utilizar mais plugins.</p>
<p>O que vamos precisar fazer é:</p>
<ol>
<li>Criar o campo na tela de Checkout</li>
<li>Validar o novo campo</li>
<li>Salvar o valor do novo campo no banco de dados</li>
<li>Mostrar o campo na tela gerencial de pedidos</li>
</ol>
<p>&nbsp;</p>
<p>Vamos começar, acesse a pasta do seu tema e edite o arquivo functions.php, adicione no final os códigos citados.</p>
<p>&nbsp;</p>
<h2>1 &#8211; Criar o campo na tela de Checkout</h2>
<pre class="top-margin:20 bottom-margin:20 left-set:true left-margin:20 right-set:true right-margin:20 whitespace-before:2 whitespace-after:2 lang:php decode:true " title="Criando o novo campo">add_action( 'woocommerce_after_order_notes', 'novo_campo_woocommerce' );
 
function novo_campo_woocommerce( $checkout ) {
 
    echo '&lt;div id="novo_campo_woocommerce"&gt;&lt;h2&gt;' . __('Novo campo, informação de teste') . '&lt;/h2&gt;';
 
    woocommerce_form_field( 'novo_campo', array(
        'type'          =&gt; 'text',
        'class'         =&gt; array('novo_campo form-row-wide'),
        'label'         =&gt; __('Campo de Teste'),
        'placeholder'   =&gt; __('Digite suas informações aqui'),
        ), $checkout-&gt;get_value( 'novo_campo' ));
 
    echo '&lt;/div&gt;';
 
}</pre>
<p>&nbsp;</p>
<p>Exemplo de como ficará na tela de Checkout.</p>
<p><img fetchpriority="high" decoding="async" class="alignnone size-full wp-image-3964" src="https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/planos-de-revenda-hostgator.jpg" alt="planos-de-revenda-hostgator" width="477" height="124" srcset="https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/planos-de-revenda-hostgator.jpg 477w, https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/planos-de-revenda-hostgator-300x78.jpg 300w" sizes="(max-width: 477px) 100vw, 477px" /></p>
<p>&nbsp;</p>
<h2>2 &#8211; Validar o novo campo</h2>
<p>O próximo passo agora é validar o campo conforme nossa necessidade.</p>
<pre class="top-margin:20 bottom-margin:20 left-set:true left-margin:20 right-set:true right-margin:20 whitespace-before:2 whitespace-after:2 lang:php decode:true" title="Validação">add_action('woocommerce_checkout_process', 'validar_novo_campo_woocommerce');
 
function validar_novo_campo_woocommerce() {

    if ( empty( $_POST['novo_campo']) )
        wc_add_notice( __( 'Obrigatório o preenchimento.' ), 'error' );
}</pre>
<p>&nbsp;</p>
<p>Exemplo de mensagem de erro retornada.</p>
<p><img decoding="async" class="alignnone size-full wp-image-3965" src="https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-mensagem-de-erro.jpg" alt="exemplo-mensagem-de-erro" width="987" height="73" srcset="https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-mensagem-de-erro.jpg 987w, https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-mensagem-de-erro-300x22.jpg 300w, https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-mensagem-de-erro-768x57.jpg 768w" sizes="(max-width: 987px) 100vw, 987px" /></p>
<p>&nbsp;</p>
<h2>3 &#8211; Salvar o novo valor no banco de dados</h2>
<pre class="top-margin:20 bottom-margin:20 left-set:true left-margin:20 right-set:true right-margin:20 whitespace-before:2 whitespace-after:2 lang:php decode:true" title="my_custom_checkout_field_update_order_meta">add_action( 'woocommerce_checkout_update_order_meta', 'novo_campo_checkout_order' );
 
function novo_campo_checkout_order( $order_id ) {
    if ( ! empty( $_POST['novo_campo'] ) ) {
        update_post_meta( $order_id, 'Novo Campo', sanitize_text_field( $_POST['novo_campo'] ) );
    }
}</pre>
<p>&nbsp;</p>
<h2>4 &#8211; Mostrar o campo na tela de gerenciamento</h2>
<pre class="top-margin:20 bottom-margin:20 left-set:true left-margin:20 right-set:true right-margin:20 whitespace-before:2 whitespace-after:2 lang:php decode:true">add_action( 'woocommerce_admin_order_data_after_billing_address', 'mostrar_novo_campo', 10, 1 );
 
function mostrar_novo_campo($order){
    echo '&lt;p&gt;&lt;strong&gt;'.__('Novo Campo').':&lt;/strong&gt; ' . get_post_meta( $order-&gt;id, 'Novo Campo', true ) . '&lt;/p&gt;';
}</pre>
<p>&nbsp;</p>
<p>Exemplo de como aparecerá na tela de gerenciamento de pedido, campo destacado com a cor <span style="color: #000000;">amarela</span>.</p>
<p><img decoding="async" class="alignnone wp-image-3966 size-full" src="https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-tela-gerencial.jpg" alt="exemplo-tela-gerencial" width="1100" height="366" srcset="https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-tela-gerencial.jpg 1100w, https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-tela-gerencial-300x100.jpg 300w, https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-tela-gerencial-1024x341.jpg 1024w, https://www.turbosite.com.br/blog/wp-content/uploads/2014/12/exemplo-tela-gerencial-768x256.jpg 768w" sizes="(max-width: 1100px) 100vw, 1100px" /></p>
<p>&nbsp;</p>
<p>Também é possível remover os campos que não são necessários, vamos postar esta dica amanhã.</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
