{"id":5760,"date":"2017-05-11T11:06:13","date_gmt":"2017-05-11T14:06:13","guid":{"rendered":"https:\/\/blog.hostinger.io\/br-tutoriais\/?p=5760"},"modified":"2021-01-07T12:07:31","modified_gmt":"2021-01-07T15:07:31","slug":"como-otimizar-imagens-wordpress-usando-o-wp-smush","status":"publish","type":"post","link":"\/br\/tutoriais\/como-otimizar-imagens-wordpress-usando-o-wp-smush","title":{"rendered":"Como otimizar as imagens WordPress usando o WP Smush"},"content":{"rendered":"<p><b><\/b><span style=\"font-weight: 400\">Se voc&ecirc; usa o WordPress e quer melhorar ainda mais a performance do seu site, um dos modos mais f&aacute;ceis de faz&ecirc;-lo &eacute; otimizando suas imagens. Voc&ecirc; pode usar suas imagens escaladas, saiba como fazer isso manualmente com <\/span><a href=\"https:\/\/www.hostinger.com\/br\/tutoriais\/melhorando-o-desempenho-do-site-servidor-imagens-escalas\/\"><span style=\"font-weight: 400\">este tutorial<\/span><\/a><span style=\"font-weight: 400\">. Mas voc&ecirc; pode ir ainda mais longe, otimizando suas imagens e escalonando-as automaticamente utilizando o <\/span><b>Plugin WP Smush<\/b><span style=\"font-weight: 400\">.<\/span><\/p><h2 id=\"h-o-que-voce-precisa\"><b>O que voc&ecirc; precisa?<\/b><\/h2><p><span style=\"font-weight: 400\">Antes de come&ccedil;ar este guia, voc&ecirc; precisar&aacute; do seguinte:<\/span><\/p><ul>\n<li style=\"font-weight: 400\"><a href=\"https:\/\/www.hostinger.com\/tutorials\/wordpress\/how-to-login-to-wordpress-dashboard\"><span style=\"font-weight: 400\">Acesso ao Painel de Controle do WordPress<\/span><\/a><\/li>\n<\/ul><h2 id=\"h-passo-1-instalando-o-plugin-wp-smush\"><b>Passo 1 &mdash; Instalando o plugin WP Smush<\/b><\/h2><p><span style=\"font-weight: 400\">Primeiramente acesse seu Painel de Controle do WordPress e v&aacute; para as op&ccedil;&otilde;es <\/span><b>Plugins &gt; Adicionar Novo<\/b><span style=\"font-weight: 400\">.<\/span><\/p><p><img decoding=\"async\" class=\"wp-image-5769 aligncenter\" src=\"https:\/\/blog.hostinger.io\/br-tutoriais\/wp-content\/uploads\/sites\/53\/2017\/05\/Screenshot_18-e1494514263606-300x89.png\" alt=\"op&ccedil;&atilde;o de instalar plugins no wordpress\" width=\"327\" height=\"97\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/Screenshot_18-e1494514263606.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/Screenshot_18-e1494514263606.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/Screenshot_18-e1494514263606.png\/w=322,fit=scale-down 322w\" sizes=\"(max-width: 327px) 100vw, 327px\" \/><\/p><p>Voc&ecirc; ser&aacute; encaminhado para a p&aacute;gina de Instala&ccedil;&atilde;o de plugins.<\/p><p><img decoding=\"async\" class=\"wp-image-5762 aligncenter\" src=\"https:\/\/blog.hostinger.io\/br-tutoriais\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin-300x126.png\" alt=\"campo de busca de plugins na biblioteca do wordpress\" width=\"490\" height=\"206\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin.png\/w=990,fit=scale-down 990w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/install_plugin.png\/w=1030,fit=scale-down 1030w\" sizes=\"(max-width: 490px) 100vw, 490px\" \/><\/p><ol>\n<li>Digite &ldquo;smush&rdquo; na barra de busca para encontrar o plugin que estamos procurando.<\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Clique em <\/span><b>Instalar Agora <\/b><span style=\"font-weight: 400\">para instalar o Plugin WP Smush.<\/span><\/li>\n<\/ol><p><span style=\"font-weight: 400\">Quando este plugin estiver instalado, o bot&atilde;o que antes aparecia como instalar, mudar&aacute; para <\/span><b>Ativar<\/b><span style=\"font-weight: 400\">.<\/span><\/p><p><img decoding=\"async\" class=\"aligncenter wp-image-5761\" src=\"https:\/\/blog.hostinger.io\/br-tutoriais\/wp-content\/uploads\/sites\/53\/2017\/05\/activate_button-300x192.png\" alt=\"instalar e ativar o plugin wp smush no wordpress\" width=\"484\" height=\"310\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/activate_button.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/activate_button.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/activate_button.png\/w=509,fit=scale-down 509w\" sizes=\"(max-width: 484px) 100vw, 484px\" \/><\/p><p><span style=\"font-weight: 400\">Clique em <\/span><b>Ativar<\/b><span style=\"font-weight: 400\"> para que o plugin Smush seja ativado. Uma vez que a ativa&ccedil;&atilde;o tenha sido um sucesso, voc&ecirc; ser&aacute; encaminhado para a p&aacute;gina do plugin Smush.<\/span><\/p><p><span style=\"font-weight: 400\">Mais detalhes de como instalar os plugins do WordPress podem ser encontrados neste tutorial <\/span><a href=\"https:\/\/www.hostinger.com\/br\/tutoriais\/como-instalar-plugins-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\"><span style=\"font-weight: 400\">aqui<\/span><\/a><span style=\"font-weight: 400\">.<\/span><\/p><h2 id=\"h-passo-2-configurando-o-plugin-wp-smush\"><b>Passo 2 &mdash; Configurando o plugin WP Smush<\/b><\/h2><p><span style=\"font-weight: 400\">Uma vez que na p&aacute;gina do plugin Smush voc&ecirc; poder&aacute; fazer a configura&ccedil;&atilde;o para seu site.<\/span><\/p><p><img decoding=\"async\" class=\"aligncenter wp-image-5763\" src=\"https:\/\/blog.hostinger.io\/br-tutoriais\/wp-content\/uploads\/sites\/53\/2017\/05\/settings-300x258.png\" alt=\"op&ccedil;&otilde;es de configura&ccedil;&atilde;o do plugin wp smush\" width=\"487\" height=\"419\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/settings.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/settings.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/settings.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/settings.png\/w=990,fit=scale-down 990w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/settings.png\/w=1005,fit=scale-down 1005w\" sizes=\"(max-width: 487px) 100vw, 487px\" \/><\/p><ol>\n<li><b>Automatically smush my images on upload<\/b><span style=\"font-weight: 400\"> &ndash; Esta op&ccedil;&atilde;o ir&aacute; otimizar automaticamente as imagens adicionadas e as imagens que s&atilde;o criadas pelo WordPress.<\/span><\/li>\n<li style=\"font-weight: 400\"><b>Preserve image EXIF data<\/b><span style=\"font-weight: 400\"> &ndash; Se voc&ecirc; precisa de informa&ccedil;&otilde;es sobre sua imagem (por exemplo: hor&aacute;rio e localiza&ccedil;&atilde;o) ent&atilde;o voc&ecirc; precisa selecionar esta op&ccedil;&atilde;o, para que n&atilde;o sejam removidas durante o processo de otimiza&ccedil;&atilde;o. No entanto, estas informa&ccedil;&otilde;es tomam um espa&ccedil;o adicional, portanto, se n&atilde;o for realmente necess&aacute;rio para voc&ecirc;, deixe essa op&ccedil;&atilde;o desabilitada, para melhorar a otimiza&ccedil;&atilde;o das imagens.<\/span><\/li>\n<li style=\"font-weight: 400\"><b>Resize original images<\/b><span style=\"font-weight: 400\"> &ndash; Se voc&ecirc; quiser economizar espa&ccedil;o no seu disco e n&atilde;o quer armazenar imagens muito grandes no seu servidor, ent&atilde;o voc&ecirc; pode selecionar essa op&ccedil;&atilde;o e definir os valores m&aacute;ximos de dimens&otilde;es para as imagens. Se voc&ecirc; adicionar imagens que excedem os valores determinados, elas ser&atilde;o automaticamente redimensionadas.<\/span><\/li>\n<\/ol><p><span style=\"font-weight: 400\">Para salvar essas mudan&ccedil;as feitas clique no bot&atilde;o <\/span><b>Update Settings<\/b><span style=\"font-weight: 400\">. O plugin Smush ir&aacute; verificar todas as imagens j&aacute; carregadas e otimiz&aacute;-las. Assim que terminar voc&ecirc; receber&aacute; uma mensagem de confirma&ccedil;&atilde;o afirmando que <\/span><b>todas as imagens foram atualizadas pelo Smush<\/b><span style=\"font-weight: 400\">.<\/span><\/p><p><span style=\"font-weight: 400\">E &eacute; isso, seu plugin Smush agora est&aacute; configurado e toda as suas imagens que foram carregadas e que ser&atilde;o carregadas no futuro ir&atilde;o ser automaticamente otimizadas. Se voc&ecirc; quiser saber quanto espa&ccedil;o voc&ecirc; est&aacute; economizando com este plugin, pode acessar em cada imagem a op&ccedil;&atilde;o <\/span><b>Smush Stats<\/b><span style=\"font-weight: 400\"> que mostrar&aacute; todas as informa&ccedil;&otilde;es da otimiza&ccedil;&atilde;o.<\/span><\/p><p><img decoding=\"async\" class=\"wp-image-5764 aligncenter\" src=\"https:\/\/blog.hostinger.io\/br-tutoriais\/wp-content\/uploads\/sites\/53\/2017\/05\/smush_stats-272x300.png\" alt=\"informa&ccedil;&otilde;es de otimiza&ccedil;&atilde;o do plugin wp smush\" width=\"472\" height=\"521\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/smush_stats.png\/w=272,fit=scale-down 272w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/smush_stats.png\/w=136,fit=scale-down 136w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2017\/05\/smush_stats.png\/w=331,fit=scale-down 331w\" sizes=\"(max-width: 472px) 100vw, 472px\" \/><\/p><h2 id=\"h-conclusao\"><b>Conclus&atilde;o<\/b><\/h2><p><span style=\"font-weight: 400\">Depois de seguir este tutorial voc&ecirc; aprendeu como melhorar ainda mais a performance do seu site WordPress otimizando as imagens do seu site. Isso ir&aacute; ajudar a reduzir o espa&ccedil;o ocupado em seu disco e ir&aacute; melhorar o desempenho do site WordPress diminuindo o tempo de resposta do carregamento do site. <\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Se voc&ecirc; usa o WordPress e quer melhorar ainda mais a performance do seu site, um dos modos mais f&aacute;ceis de faz&ecirc;-lo &eacute; otimizando suas imagens. Voc&ecirc; pode usar suas imagens escaladas, saiba como fazer isso manualmente com este tutorial. Mas voc&ecirc; pode ir ainda mais longe, otimizando suas imagens e escalonando-as automaticamente utilizando o [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/br\/tutoriais\/como-otimizar-imagens-wordpress-usando-o-wp-smush\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":74,"featured_media":22081,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"","rank_math_description":"Se voc\u00ea quer ir ainda mais longe na otimiza\u00e7\u00e3o de suas imagens e escalonando-as automaticamente, o Plugin WP Smush far\u00e1 isso pra voc\u00ea.","rank_math_focus_keyword":"Smush","footnotes":""},"categories":[4911],"tags":[4805,4956,4955,4798],"class_list":["post-5760","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress","tag-otimizar","tag-sites","tag-smush","tag-wordpress"],"hreflangs":[{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/como-otimizar-imagens-wordpress-usando-o-wp-smush","default":1},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/como-otimizar-imagens-wordpress-usando-o-wp-smush","default":0}],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/5760","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/users\/74"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/comments?post=5760"}],"version-history":[{"count":10,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/5760\/revisions"}],"predecessor-version":[{"id":22083,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/5760\/revisions\/22083"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/media\/22081"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/media?parent=5760"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/categories?post=5760"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/tags?post=5760"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}