{"id":234018,"date":"2023-02-27T16:06:00","date_gmt":"2023-02-27T13:06:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=234018"},"modified":"2022-11-11T13:56:17","modified_gmt":"2022-11-11T10:56:17","slug":"codificacao-para-woocommerce-uma-introducao","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pt-pt\/codificacao-para-woocommerce-uma-introducao\/","title":{"rendered":"Codifica\u00e7\u00e3o para WooCommerce: Uma introdu\u00e7\u00e3o"},"content":{"rendered":"\n

Esta \u00e9 a introdu\u00e7\u00e3o de um desenvolvedor iniciante ao plugin WordPress WooCommerce<\/a>. Neste post, veremos o b\u00e1sico de como o WooCommerce funciona e como podemos personaliz\u00e1-lo em nosso tema ou plugin usando ganchos e modelos.<\/p>\n

Em primeiro lugar, o WooCommerce oferece grande flexibilidade para desenvolvedores de temas e plugins ajustarem sua funcionalidade. Para modifica\u00e7\u00f5es simples, voc\u00ea geralmente tem pelo menos duas alternativas. A escolha de como voc\u00ea modifica depende de como voc\u00ea prefere trabalhar, qu\u00e3o flex\u00edvel e leg\u00edvel seu c\u00f3digo deve ser e como voc\u00ea prefere continuar fazendo a manuten\u00e7\u00e3o futura do seu site quando se trata de atualiza\u00e7\u00f5es de plugins (e WordPress).<\/p>\n

Antes de come\u00e7ar a modificar a funcionalidade do WooCommerce via c\u00f3digo, voc\u00ea deve verificar se o que deseja alcan\u00e7ar \u00e9 poss\u00edvel alterando as configura\u00e7\u00f5es. O WooCommerce vem com uma enorme p\u00e1gina de configura\u00e7\u00f5es, permitindo que voc\u00ea mude bastante. Nas vers\u00f5es mais recentes, o WooCommerce tamb\u00e9m adicionou e moveu configura\u00e7\u00f5es adicionais para o WordPress Customizer. Aqui voc\u00ea poder\u00e1, por exemplo, ajustar o n\u00famero de colunas e ajustar alguns dos campos de checkout.<\/p>\n

Modelos WooCommerce<\/h2>\n

O WooCommerce oferece uma grande variedade de arquivos de modelo nos quais voc\u00ea, como desenvolvedor de temas, pode substituir. A maneira como voc\u00ea faz isso \u00e9 fazendo uma c\u00f3pia do modelo original do WooCommerce em sua pasta de temas. E ent\u00e3o voc\u00ea faz suas altera\u00e7\u00f5es no arquivo em seu tema.<\/p>\n

Navegue at\u00e9 a pasta do plugin WooCommerce em \/wp-content\/plugins\/woocommerce\/<\/code>. Aqui voc\u00ea encontrar\u00e1 a subpasta templates<\/code>. Todo o conte\u00fado dos arquivos (h\u00e1 muito!) ao \/wp-content\/plugins\/woocommerce\/templates\/<\/code>incluir suas subpastas s\u00e3o todos os arquivos de modelo que voc\u00ea pode substituir em seu tema.<\/p>\n

Para que o WooCommerce encontre seus modelos modificados, voc\u00ea precisa de uma subpasta no diret\u00f3rio raiz do seu tema chamada woocommerce<\/code>. Se o slug do seu tema for ‘awhitepixel’, sua pasta deve estar localizada em \/wp-content\/themes\/awhitepixel\/woocommerce\/<\/code>. Dentro desta pasta voc\u00ea pode colocar suas c\u00f3pias modificadas dos arquivos de template do WooCommerce. Tenha em mente que os arquivos de modelo localizados em subpastas precisam ser colocados nas subpastas correspondentes na sua pasta woocommerce. Por exemplo; substituir o WooCommerce \/templates\/single-product\/add-to-cart\/simple.php<\/code>exige que voc\u00ea coloque sua c\u00f3pia simple.php<\/code>na \/woocommerce\/single-product\/add-to-cart\/<\/code>pasta do seu tema.<\/p>\n

Voc\u00ea tamb\u00e9m deve ter notado que h\u00e1 muitas a\u00e7\u00f5es e filtros nos modelos. A maioria deles s\u00e3o preenchidos com do_action()<\/code>s. Para o uso ideal do WooCommerce, voc\u00ea n\u00e3o deve remover nenhum dos ganchos nos modelos. Na maioria dos casos, voc\u00ea pode considerar alterar a funcionalidade usando a\u00e7\u00f5es e filtros em vez de substituir modelos. Deixe-me explicar o porqu\u00ea!<\/p>\n

Observa\u00e7\u00e3o importante sobre a substitui\u00e7\u00e3o de modelos e atualiza\u00e7\u00f5es de plug-ins<\/h3>\n

Para um iniciante, substituir um modelo pode parecer a solu\u00e7\u00e3o mais f\u00e1cil e intuitiva. Por que mexer com ganchos se voc\u00ea pode alterar diretamente o modelo que gera a coisa que voc\u00ea deseja alterar? Resposta: Porque essa estrat\u00e9gia gera mais trabalho para manter a manuten\u00e7\u00e3o da sua loja virtual.<\/p>\n

O WooCommerce \u00e9 atualizado com frequ\u00eancia e, \u00e0s vezes, atualiza um arquivo de modelo. Para manter sua loja virtual atualizada, voc\u00ea tamb\u00e9m precisa atualizar os arquivos de modelo substitu\u00eddos em seu tema. Normalmente, voc\u00ea precisar\u00e1 substituir todo o arquivo de modelo pelo arquivo atualizado mais recente e, em seguida, adicionar novamente suas altera\u00e7\u00f5es. Isso rapidamente se torna muito mais dif\u00edcil se voc\u00ea n\u00e3o se lembrar de todas as altera\u00e7\u00f5es feitas. Acredite em mim, que tem anos de experi\u00eancia na corre\u00e7\u00e3o de arquivos de modelo WooCommerce de outros desenvolvedores durante as atualiza\u00e7\u00f5es de plugins. Confie em mim, n\u00e3o \u00e9 um trabalho divertido de fazer!<\/p>\n

Agora que sabemos que os ganchos s\u00e3o uma estrat\u00e9gia melhor, vamos ver como fazer isso.<\/p>\n

Ganchos WooCommerce<\/h2>\n

O WooCommerce oferece uma enorme quantidade de ganchos, tanto de a\u00e7\u00f5es quanto de filtros. Usar ganchos \u00e9 realmente muito simples!<\/p>\n

Com ganchos, voc\u00ea tamb\u00e9m pode alterar muito mais do que apenas a sa\u00edda dos modelos. Voc\u00ea pode personalizar pre\u00e7os de produtos, campos de checkout ou fazer sua loja virtual fazer algo quando um produto for adicionado ao carrinho.<\/p>\n

Se voc\u00ea est\u00e1 desenvolvendo um plugin, os ganchos tamb\u00e9m s\u00e3o o \u00fanico caminho a percorrer. Voc\u00ea s\u00f3 pode substituir modelos em um tema, n\u00e3o em um plug-in. (Ok, existem maneiras de superar isso, mas \u00e9 muito incomum e n\u00e3o recomendado).<\/p>\n

Se voc\u00ea olhou em alguns dos arquivos de modelo do WooCommerce, deve ter visto muitos arquivos do_action()<\/code>. Estes s\u00e3o ganchos; pontos de verifica\u00e7\u00e3o que voc\u00ea pode conectar e adicionar seu c\u00f3digo ou modificar uma vari\u00e1vel. Se voc\u00ea n\u00e3o tiver certeza sobre como os ganchos funcionam, tenho um post que explica<\/a> isso em profundidade.<\/p>\n

Se voc\u00ea deseja produzir algo, por exemplo, um texto ou algo semelhante, procure por a\u00e7\u00f5es (do_action()<\/code>). Por exemplo, produzindo algo no modelo de carrinho, voc\u00ea tem a op\u00e7\u00e3o de se conectar a woocommerce_before_cart<\/code>, woocommerce_before_cart_table<\/code>, woocommerce_before_cart_contents<\/code>, woocommerce_cart_contents<\/code>, woocommerce_cart_actions<\/code>, woocommerce_after_cart_contents<\/code>, woocommerce_after_cart_table<\/code>, woocommerce_cart_collaterals<\/code>ou woocommerce_after_cart<\/code>. Basta escolher aquele que est\u00e1 posicionado onde voc\u00ea deseja sua sa\u00edda. Este \u00e9 um exemplo de exibi\u00e7\u00e3o de um texto antes da tabela e do formul\u00e1rio na p\u00e1gina do carrinho:<\/p>\n

add_action('woocommerce_before_cart', function() {\n    _e('Here are the products you have added in the cart so far', 'textdomain');\n});<\/code><\/pre>\n
Os filtros (procure por apply_filters()<\/code>) s\u00e3o para modificar uma sa\u00edda ou uma vari\u00e1vel. Um uso comum de filtros no WooCommerce \u00e9 modificar o texto "Adicionar ao carrinho" nos bot\u00f5es de compra. O WooCommerce oferece v\u00e1rios filtros para isso, permitindo que voc\u00ea controle o texto em diferentes p\u00e1ginas. Por exemplo, voc\u00ea pode personalizar o texto no loop da loja ou na visualiza\u00e7\u00e3o de um \u00fanico produto. Os filtros geralmente fornecem v\u00e1rios argumentos para maior controle; por exemplo, o objeto do produto. Veja um exemplo simples de como alterar os textos "Adicionar ao carrinho" na visualiza\u00e7\u00e3o de um \u00fanico produto:<\/p>\n
add_filter('woocommerce_product_single_add_to_cart_text', function($original_text, $product) {\n    return __('Buy this', 'textdomain');\n}, 10, 2);<\/code><\/pre>\n
Com algum conhecimento de como os ganchos funcionam e simplesmente olhando dentro dos arquivos de modelo, voc\u00ea pode encontrar muitas funcionalidades facilmente alter\u00e1veis. Obviamente WooCommerce oferece modifica\u00e7\u00f5es muito mais avan\u00e7adas, alterando pre\u00e7os, m\u00e9todos de pagamento, modifica\u00e7\u00f5es de produtos ou importa\u00e7\u00f5es, tudo poss\u00edvel com o uso de ganchos.<\/p>\n
Conclus\u00e3o<\/h2>\n
O objetivo deste post \u00e9 dar ao iniciante o b\u00e1sico de como fazer modifica\u00e7\u00f5es no WooCommerce e as consequ\u00eancias de como voc\u00ea faz as altera\u00e7\u00f5es. Eu sempre recomendo usar ganchos sobrescrevendo arquivos de modelo, a menos que seja absolutamente necess\u00e1rio.<\/p>\n
O pr\u00f3ximo passo \u00e9 mergulhar nas modifica\u00e7\u00f5es avan\u00e7adas conhecendo os ganchos, processos e objetos do WooCommerce. Como o WooCommerce<\/a> \u00e9 a plataforma de com\u00e9rcio eletr\u00f4nico mais popular que existe, h\u00e1 muitos recursos e exemplos de c\u00f3digo dispon\u00edveis na web. D\u00ea uma olhada na categoria Woocommerce<\/a> aqui neste site para saber mais tamb\u00e9m.<\/p>\n
Fonte de grava\u00e7\u00e3o:  awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
A introdu\u00e7\u00e3o de um desenvolvedor ao b\u00e1sico do WordPress WooCommerce; como funciona e como voc\u00ea pode personalizar sua funcionalidade em seu tema ou plugin.<\/p>\n","protected":false},"author":1,"featured_media":239407,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[898,898,1110,816,816,846,846,857,857,867,867],"tags":[1170],"class_list":["post-234018","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codigo-2","category-n-a","category-plug-ins","category-tutoriais","category-woocommerce-8","category-wordpress-8","tag-affiai-pt-pt"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/234018","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/comments?post=234018"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/234018\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media\/239407"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media?parent=234018"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/categories?post=234018"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/tags?post=234018"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}