{"id":225882,"date":"2023-02-28T11:40:00","date_gmt":"2023-02-28T08:40:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=225882"},"modified":"2022-11-08T00:43:09","modified_gmt":"2022-11-07T21:43:09","slug":"como-criar-um-catalogo-de-produtos-no-wordpress","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pt-pt\/como-criar-um-catalogo-de-produtos-no-wordpress\/","title":{"rendered":"Como criar um cat\u00e1logo de produtos no WordPress"},"content":{"rendered":"\n<h2>N\u00e3o tem certeza sobre a melhor maneira de criar um cat\u00e1logo de produtos no WordPress? Publicando seu cat\u00e1logo e n\u00e3o sabe como faz\u00ea-lo melhor sem qualquer codifica\u00e7\u00e3o?<\/h2>\n<p>Muitos desenvolvedores iniciantes ficam confusos quando precisam publicar um cat\u00e1logo de tabela de produtos ou lista de pre\u00e7os: a marca\u00e7\u00e3o HTML \u00e9 confusa; alguns deles podem fazer a marca\u00e7\u00e3o, mas n\u00e3o est\u00e3o satisfeitos com a apar\u00eancia, ou gostariam de ter alguma solu\u00e7\u00e3o que fosse classific\u00e1vel, que pudesse dividir os dados em p\u00e1ginas, n\u00e3o seria muito dif\u00edcil de atualizar. De fato: atualizar a tabela HTML toda vez que o pre\u00e7o do produto muda, ou quando voc\u00ea adiciona um novo produto, ou quando a quantidade muda \u00e9 frustrante.<\/p>\n<p>Este artigo ir\u00e1 gui\u00e1-lo atrav\u00e9s do processo de cria\u00e7\u00e3o de um cat\u00e1logo de produtos no WordPress com o plugin wpDataTables, que provavelmente \u00e9 a maneira mais f\u00e1cil.<\/p>\n<h2>Primeiro \u2013 prepare os dados para seu futuro cat\u00e1logo de produtos no WordPress<\/h2>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-207586-61e8d6ce4f1a0.png\" data-rel=\"lightbox\" ><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-207586-61e8d6ce4f1a0.png\" alt=\"Como criar um cat\u00e1logo de produtos no WordPress\" ><\/a><\/p>\n<p>Claro, nenhum cat\u00e1logo faria sentido sem ter alguns produtos nele. Presumo que voc\u00ea j\u00e1 tenha preparado os dados, agora precisaria compil\u00e1-los de uma forma que nosso plugin WordPress &#8220;entenderia&quot;. Pode ser um dos seguintes:<\/p>\n<ul>\n<li><strong>Arquivo Excel ou CSV:<\/strong> se voc\u00ea n\u00e3o \u00e9 um desenvolvedor e acompanha seus produtos no Excel \u2013 essa maneira provavelmente seria a mais f\u00e1cil para voc\u00ea. Basta preparar um arquivo Excel com uma planilha que teria todas as informa\u00e7\u00f5es sobre seus produtos organizadas na tabela. O arquivo CSV seria o preferido, pois funciona um pouco mais r\u00e1pido.<\/li>\n<li><strong>Tabela MySQL (preferencial):<\/strong> esta \u00e9 provavelmente a melhor fonte de dados para o seu cat\u00e1logo. Ele fornece trabalho r\u00e1pido, atualiza\u00e7\u00f5es em tempo real sem nenhum re-upload e, se voc\u00ea tiver 10.000 produtos, \u00e9 a melhor solu\u00e7\u00e3o. Voc\u00ea pode converter seus dados de CSV para MySQL.<\/li>\n<li><strong>Matriz PHP:<\/strong> Se voc\u00ea coletar dados de v\u00e1rias fontes de dados, ou se eles dependerem de algumas entradas externas, e se voc\u00ea tiver algumas habilidades de desenvolvimento PHP, talvez prefira preparar os dados em uma matriz PHP e, em seguida, preparar um arquivo PHP que imprimiria em uma string serializada (com fun\u00e7\u00e3o <a href=\"http:\/\/www.php.net\/manual\/en\/function.serialize.php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">serialize<\/a>) como <a href=\"https:\/\/wpdatatables.com\/input_source\/cars_serialized.php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">esta<\/a>.<\/li>\n<li><strong>Fonte de dados JSON ou XML<\/strong> \u2013 se voc\u00ea tiver um servi\u00e7o Web XML ou JSON, poder\u00e1 preparar os dados nesses formatos. Voc\u00ea pode ler sobre como us\u00e1-los <a href=\"https:\/\/wpdatatables.com\/documentation\/creating-wpdatatables\/creating-wpdatatables-from-xml\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">aqui<\/a> e <a href=\"https:\/\/wpdatatables.com\/documentation\/creating-wpdatatables\/creating-wpdatatables-from-json-input\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">aqui<\/a><\/li>\n<\/ul>\n<p>Depois que os dados estiverem prontos, podemos passar para a pr\u00f3xima etapa<\/p>\n<h2>Instale o plugin wpDataTables WordPress, que renderizar\u00e1 seu cat\u00e1logo de produtos<\/h2>\n<p>Antes de prosseguirmos, precisamos ter certeza de que o plugin wpDataTables est\u00e1 instalado. Voc\u00ea pode obt\u00ea-lo <a href=\"http:\/\/codecanyon.net\/item\/wpdatatables-responsive-tables-in-wordpress\/3958969?ref=cjbug\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">aqui<\/a>.<\/p>\n<p>A instala\u00e7\u00e3o \u00e9 bastante simples:<\/p>\n<ul>\n<li>Carregue o plugin para o seu diret\u00f3rio de plugins.<\/li>\n<li>Ative o plug-in.<\/li>\n<\/ul>\n<p>Voc\u00ea pode ler mais sobre isso <a href=\"https:\/\/wpdatatables.com\/documentation\/general\/installation\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">aqui.<\/a><\/p>\n<h2>Crie um novo wpDataTable para o seu cat\u00e1logo WordPress<\/h2>\n<p>Abra o painel de administra\u00e7\u00e3o do WordPress e encontre o painel de administra\u00e7\u00e3o do wpDataTables. Em seguida, pressione o bot\u00e3o &#8220;Adicionar novo&#8221; para criar um novo wpDatatable.<\/p>\n<p>Adicione um t\u00edtulo de tabela. Voc\u00ea pode cham\u00e1-lo de &#8220;Cat\u00e1logo de produtos no exemplo do WordPress&#8221; ou algo assim.<\/p>\n<p>Em seguida, selecione um tipo de tabela. Depende do que voc\u00ea escolheu na etapa 1: arquivo Excel, arquivo CSV, consulta MySQL, array PHP serializado, fonte de entrada JSON ou XML.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-207586-61e8d6cf34c21.jpg\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-207586-61e8d6cf34c21.jpg\" alt=\"Como criar um cat\u00e1logo de produtos no WordPress\" ><\/a><\/p>\n<p>Se voc\u00ea decidiu criar o cat\u00e1logo com base nos dados do MySQL, forne\u00e7a uma consulta SELECT correta. Pode ser algo como:<\/p>\n<pre><code>SELECT * FROM my_product_catalog<\/code><\/pre>\n<p>Em seguida, voc\u00ea pode definir uma das seguintes caixas de sele\u00e7\u00e3o e par\u00e2metros, se desejar para o seu cat\u00e1logo:<\/p>\n<ul>\n<li><strong>Processamento do lado do servidor<\/strong> \u2013 Se voc\u00ea marcar esta caixa de sele\u00e7\u00e3o, toda a filtragem, classifica\u00e7\u00e3o e outros processamentos ser\u00e3o enviados em uma solicita\u00e7\u00e3o AJAX do navegador do cliente e processados \u200b\u200bpelo servidor. Use isso se voc\u00ea tiver um grande conjunto de dados MySQL<\/li>\n<li><strong>Responsivo<\/strong> \u2013 Se o seu site for responsivo, marque esta caixa de sele\u00e7\u00e3o, seu cat\u00e1logo do WordPress tamb\u00e9m se tornar\u00e1 responsivo.<\/li>\n<li><strong>Filtragem avan\u00e7ada<\/strong> \u2013 Ativar esta caixa de sele\u00e7\u00e3o adicionar\u00e1 um filtro abaixo de cada coluna em seu novo cat\u00e1logo do WordPress. Assim, permitir\u00e1 que seus usu\u00e1rios, por exemplo, filtrem por pre\u00e7o, por data de lan\u00e7amento ou qualquer outra coisa.<\/li>\n<li><strong>Ferramentas de tabela<\/strong> \u2013 A ativa\u00e7\u00e3o de ferramentas de tabela adicionar\u00e1 a possibilidade de exportar dados em CSV, PDF ou Excel ou copiar dados do cat\u00e1logo para a \u00e1rea de transfer\u00eancia.<\/li>\n<li><strong>Habilitar classifica\u00e7\u00e3o<\/strong> \u2013 Esta caixa de sele\u00e7\u00e3o habilitar\u00e1 a classifica\u00e7\u00e3o em seu cat\u00e1logo. Assim, por exemplo, seu usu\u00e1rio poder\u00e1 classificar todos os seus produtos por ordem alfab\u00e9tica, por pre\u00e7o ou o que preferir.<\/li>\n<li><strong>Limitar layout da tabela<\/strong> \u2013 Esta caixa de sele\u00e7\u00e3o limitaria a largura do cat\u00e1logo \u00e0 largura do cont\u00eainer pai.<\/li>\n<li><strong>Quebra de palavras<\/strong> \u2013 Voc\u00ea pode marcar esta caixa de sele\u00e7\u00e3o se tiver descri\u00e7\u00f5es longas de seus produtos no cat\u00e1logo ou nomes de produtos longos. Isso far\u00e1 com que as c\u00e9lulas da tabela se estiquem.<\/li>\n<li><strong>Comprimento de exibi\u00e7\u00e3o<\/strong> \u2013 Isso definir\u00e1 quantos produtos ser\u00e3o mostrados em uma p\u00e1gina do seu cat\u00e1logo.<\/li>\n<\/ul>\n<p>Pressione &#8220;Salvar tabela&#8221; e seu cat\u00e1logo estar\u00e1 pronto para publica\u00e7\u00e3o.<\/p>\n<p>Voc\u00ea pode ler mais detalhadamente sobre as configura\u00e7\u00f5es de tabela\/cat\u00e1logo na se\u00e7\u00e3o do tutorial. Por exemplo <a href=\"https:\/\/wpdatatables.com\/wordpress-table-mysql-queries\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">, aqui<\/a><\/p>\n<h2>Publique seu novo cat\u00e1logo de produtos em seu blog WordPress<\/h2>\n<p>Voc\u00ea receber\u00e1 um shortcode gerado no plugin. Cole-o em sua p\u00e1gina ou postagem de blog \u2013 e seu novo cat\u00e1logo est\u00e1 pronto.<\/p>\n<p>Aqui est\u00e1 o resultado:<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte de grava\u00e7\u00e3o:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/wpdatatables.com\" class=\"external external_icon\">wpdatatables.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Neste artigo, mostrarei como usar o wpDataTables para criar um cat\u00e1logo de produtos no WordPress, pois \u00e9 um dos casos de uso mais popupar<\/p>\n","protected":false},"author":1,"featured_media":224083,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[1110,816,816,846,846,857,857,867,867],"tags":[1170],"class_list":["post-225882","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","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\/225882","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=225882"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/225882\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media\/224083"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media?parent=225882"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/categories?post=225882"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/tags?post=225882"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}