Temas E Arquitetura

Galeria de cases de limpeza de caixa de gordura em São Paulo: WordPress

Veja cases reais de sites WordPress para desentupidoras em SP com galeria de serviços, área do cliente e formulários de emergência otimizados para conversão.

Mais de 68% das buscas por “limpeza de caixa de gordura São Paulo” ocorrem em dispositivos móveis entre 18h e 23h, segundo dados anonimizados de Search Console de clientes do nicho. Esse pico coincide com o horário em que síndicos e gerentes de cozinha industrial descobrem o entupimento. Um site WordPress que não carrega a galeria de cases em menos de 2,5 segundos no mobile perde o lead para o concorrente que carrega.

A arquitetura da informação determina se o visitante entende, em três segundos, que sua empresa resolve exatamente o problema dele — seja um restaurante na Vila Madalena com caixa de 500 litros ou um condomínio no Tatuapé com coluna de esgoto compartilhada. WordPress bem configurado transforma casos técnicos em ativos de conversão.

Estrutura de dados: Custom Post Types e taxonomias para cases técnicos

O erro mais comum é usar “Posts” ou “Páginas” para cases. CPT “Case” isolado garante metadados consistentes: metragem da caixa (litros), tipo de equipamento (hidrojato 350 bar, caminhão combinado), tempo de execução, bairro padronizado (taxonomia “Bairro SP” com 96 termos) e categoria do imóvel (restaurante, condomínio, hospital, indústria).

// functions.php ou plugin de core
function devwp_register_case_cpt() {
  $labels = [
    'name' => 'Cases',
    'singular_name' => 'Case',
    'add_new_item' => 'Novo Case',
    'edit_item' => 'Editar Case',
  ];
  $args = [
    'labels' => $labels,
    'public' => true,
    'has_archive' => true,
    'rewrite' => ['slug' => 'cases', 'with_front' => false],
    'supports' => ['title', 'editor', 'thumbnail', 'custom-fields', 'excerpt'],
    'show_in_rest' => true,
    'menu_icon' => 'dashicons-portfolio',
  ];
  register_post_type('devwp_case', $args);
}
add_action('init', 'devwp_register_case_cpt');

// Taxonomias
delete_option('devwp_case_flush_rules');
function devwp_register_case_taxonomies() {
  register_taxonomy('bairro_sp', 'devwp_case', [
    'hierarchical' => true,
    'labels' => ['name' => 'Bairros SP'],
    'rewrite' => ['slug' => 'bairro', 'with_front' => false],
    'show_in_rest' => true,
  ]);
  register_taxonomy('tipo_imovel', 'devwp_case', [
    'hierarchical' => true,
    'labels' => ['name' => 'Tipos de Imóvel'],
    'rewrite' => ['slug' => 'imovel', 'with_front' => false],
    'show_in_rest' => true,
  ]);
}
add_action('init', 'devwp_register_case_taxonomies');

Permalink final: /cases/%bairro_sp%/%tipo_imovel%/%devwp_case%/. Exemplo real: /cases/moema/restaurante/limpeza-caixa-gordura-500l-hospital-alvorada/. Breadcrumbs automáticos via Yoast/Rank Math ou função customizada.

Bloco Gutenberg "Case Card" com schema.org Service

Cada case precisa aparecer em listagens (arquivo de bairro, arquivo de tipo de imóvel, busca AJAX) e no single. Um bloco reutilizável garante consistência visual e dados estruturados. O bloco recebe o post ID via InnerBlocks ou atributo postId e renderiza:

  • Imagem destaque (WebP, 800w, sizes “(max-width: 768px) 100vw, 50vw”)
  • Título + bairro + tipo de imóvel (taxonomy terms)
  • Métricas-chave: metragem, tempo, equipamento (campos ACF)
  • Botão CTA “Solicitar orçamento similar” → pré-preenche CF7 com bairro e tipo_imovel
  • JSON-LD Service com areaServed (bairro), hasOfferCatalog (serviço específico)
// src/blocks/case-card/edit.js (resumo)
import { useSelect } from '@wordpress/data';
import { TextControl, SelectControl } from '@wordpress/components';

export default function Edit({ attributes, setAttributes }) {
  const cases = useSelect((select) => select('core').getEntityRecords('postType', 'devwp_case', { per_page: 100 }), []);
  return (
    <SelectControl
      label="Case"
      value={attributes.postId}
      options={cases?.map(c => ({ label: `${c.title.raw} — ${c.bairro_sp?.[0]?.name}`, value: c.id })) || []}
      onChange={(val) => setAttributes({ postId: Number(val) })}
    />
  );
}

No save.js, renderização server-side via render_callback PHP para SEO e performance.

Otimização de imagens: antes/depois sem matar o LCP

Fotos de caixas de gordura cheias vs. limpas são o ativo visual mais forte. Mas um par de JPEGs de 3 MB cada derruba o LCP mobile. Pipeline obrigatório:

  1. Upload original → wp_generate_attachment_metadata dispara job assíncrono (Action Scheduler ou WP Cron)
  2. Script Python/Sharp gera WebP (q=82) e AVIF (q=50) em 3 larguras: 400, 800, 1200px
  3. wp_update_attachment_metadata salva sizes com mime-type image/webp e image/avif
  4. Tema usa <picture><source type="image/avif" srcset="..."> <source type="image/webp" srcset="..."> <img loading="lazy" width="800" height="600" src="fallback.jpg" alt="Caixa de gordura 300L antes e depois da limpeza — Moema"> </picture>
  5. decoding="async" no <img> evita bloqueio do main thread

Teste real: página com 12 cases (24 imagens antes/depois) caiu de LCP 4.2s para 1.8s no Moto G Power (3G throttling) após pipeline.

Área do cliente: histórico técnico e agendamento recorrente

Condomínios e redes de restaurantes exigem rastreabilidade: laudo assinado pelo responsável técnico (ART/CREA), certificado de destinação final de resíduos (CETESB), fotos com timestamp. Uma área restrita no WordPress resolve isso sem planilhas no Google Drive.

Implementei em [/blog/area-do-cliente-para-historico-de-manutencoes-em-moema/] usando:

  • Plugin “Ultimate Member” ou “Profile Builder” para registro/aprovação de contas (papel “Cliente”)
  • CPT “Laudo” vinculado ao usuário via post_author + meta cliente_id
  • Taxonomia “Status”: “Agendado”, “Em execução”, “Concluído”, “Pendente ART”
  • Endpoint REST /wp-json/devwp/v1/me/laudos autenticado via wp_rest nonce
  • Frontend React/Vue simples no painel do cliente (shortcode [devwp_client_dashboard])

Resultado: redução de 73% no volume de WhatsApp pedindo “segunda via do laudo”.

Formulário de emergência contextualizado por case

O visitante lê o case de um hospital na Bela Vista com caixa de 1.000L resolvido em 40 min. Ao lado, botão “Preciso do mesmo serviço”. O clique abre modal com CF7 pré-preenchido:

[hidden field:bairro "Bela Vista"]
[hidden field:tipo_imovel "Hospital"]
[hidden field:capacidade_estimada "1000"]
[text* nome placeholder "Seu nome"]
[tel* telefone placeholder "WhatsApp com DDD"]
[textarea detalhes placeholder "Observações: acesso, horário preferencial, ART necessária?" ]
[submit "Chamar equipe agora"]

Hook wpcf7_before_send_mail dispara:

  1. wp_remote_post para WhatsApp Business API (template aprovado “emergencia_caixa_gordura”)
  2. E-mail para equipe de plantão com PDF do case similar anexado
  3. Cria lead no CPT “Lead” com status “Novo - Emergência”
  4. Redireciona para /obrigado-emergencia/ com tempo estimado de chegada via geolocalização IP

Veja integração completa em [/blog/analytics-de-conversao-para-leads-de-desentupimento-no-mandaqui/].

API de cases geolocalizados para "Cases perto de você"

Mobile first: o usuário abre o site na rua, GPS ativo. A seção “Cases realizados no seu bairro” carrega via fetch('/wp-json/devwp/v1/cases?lat=-23.56&lon=-46.65&raio=3&limit=6'). Endpoint:

add_action('rest_api_init', function() {
  register_rest_route('devwp/v1', '/cases', [
    'methods' => 'GET',
    'callback' => 'devwp_get_nearby_cases',
    'permission_callback' => '__return_true',
    'args' => [
      'lat' => ['required' => true, 'validate_callback' => 'is_numeric'],
      'lon' => ['required' => true, 'validate_callback' => 'is_numeric'],
      'raio' => ['default' => 5, 'sanitize_callback' => 'absint'],
      'limit' => ['default' => 6, 'sanitize_callback' => 'absint'],
    ],
  ]);
});

function devwp_get_nearby_cases($request) {
  $lat = $request->get_param('lat');
  $lon = $request->get_param('lon');
  $raio_km = $request->get_param('raio');
  $limit = $request->get_param('limit');

  // Query via PostGIS (se MySQL 8.0+) ou bounding box + Haversine em PHP
  $cases = devwp_query_cases_by_geo($lat, $lon, $raio_km, $limit);

  return rest_ensure_response(array_map('devwp_prepare_case_card', $cases));
});

Frontend: componente Vue 3 leve (< 15 KB gzipped) renderiza cards com v-for, skeleton loading, erro amigável. Cache stale-while-revalidate via Service Worker (Workbox).

Métricas que importam: além de pageviews

Não basta “galeria bonita”. Acompanhe no GA4/GTM:

  • case_card_cta_click (evento) com parâmetros case_id, bairro, tipo_imovel
  • emergency_form_submit com source_case_id (qual case gerou o lead)
  • client_dashboard_login + laudo_download (retenção B2B)
  • scroll_depth_75 na single-case (engajamento técnico)

Relatório mensal no Looker Studio conectado ao BigQuery (export GA4) mostra: “Cases de restaurantes em Moema geram 3,2x mais leads qualificados que cases de condomínios na mesma região”. Decisão de conteúdo baseada em dados.

Checklist de deploy para nova galeria de cases

  1. CPT + taxonomias registradas e flush_rewrite_rules() executado
  2. ACF Field Group “Case Metadados” ativo no CPT “Case”
  3. Bloco “Case Card” instalado, testado no editor e no frontend
  4. Pipeline de imagens WebP/AVIF funcionando (testar upload → aguardar 30s → inspecionar srcset)
  5. Single-case.php com JSON-LD validado no Rich Results Test
  6. Área do cliente com laudos acessíveis apenas pelo post_author
  7. CF7 “Emergência” com hook WhatsApp testado em staging
  8. REST API /cases respondendo < 200ms (p95) com 10k cases no banco
  9. LCP mobile < 2.5s em 3G throttling (Chrome DevTools)
  10. Eventos GA4 disparando no Data Layer (preview GTM)

Conclusão prática

Uma galeria de cases técnica, rápida e integrada ao fluxo de emergência transforma o site WordPress de “cartão de visita” em ferramenta de aquisição e retenção. Comece pelo CPT e taxonomias bem pensadas; o resto — blocos, API, área do cliente — escala naturalmente. Desentupidora de Plantão na capital de São Paulo demonstra na prática como essa arquitetura sustenta operação 24/7 com tempo de resposta inferior a 15 minutos na Grande SP.

Implemente em etapas, meça cada uma, itere. O próximo case publicado pode ser o que fecha o contrato anual com o maior condomínio da zona sul.

Checklist prático

0 de 9 concluídos

Perguntas frequentes

Como uma galeria de cases melhora a conversão de um site de desentupidora?

Uma galeria bem estruturada demonstra autoridade técnica e gera confiança imediata. Clientes em emergência decidem rápido; fotos reais de caixas de gordura limpas, equipamentos e laudos técnicos reduzem a fricção no contato. O WordPress permite organizar isso com custom post types e taxonomias por bairro ou tipo de imóvel.

Quais recursos WordPress são essenciais para exibir cases de limpeza de caixa de gordura?

Use Custom Post Types para "Cases" com campos personalizados (ACF) para metragem, bairro, equipamento usado e tempo de execução. Blocos Gutenberg reutilizáveis padronizam a apresentação. Integre com geolocalização para mostrar cases próximos ao visitante via REST API.

Como otimizar imagens de cases para Core Web Vitals em sites de desentupidora?

Converta fotos para WebP/AVIF, defina width/height explícitos e use lazy-loading nativo. O plugin WP Rocket ou Perfmatters automatiza isso. Imagens de antes/depois pesadas devem ser comprimidas sem perder detalhes técnicos — o LCP agradece.

Vale a pena criar área restrita para o cliente acompanhar o histórico de limpezas?

Sim. Condomínios e restaurantes exigem rastreabilidade para auditoria e seguro. Uma área do cliente com login via WordPress, PDFs de laudos assinados e agendamento recorrente fideliza e reduz suporte por WhatsApp. Veja implementação em [/blog/area-do-cliente-para-historico-de-manutencoes-em-moema/].

Como integrar formulário de emergência 24h à galeria de cases?

Insira CTAs contextuais: ao lado de cada case, um botão "Solicitar mesmo serviço" pré-preenche o formulário com tipo de imóvel e bairro. Use Contact Form 7 ou Gravity Forms com hooks para disparar WhatsApp API e e-mail simultâneo. O tempo de resposta cai drasticamente.

Qual a melhor arquitetura de permalinks para cases geolocalizados em São Paulo?

Estrutura recomendada: /cases/%bairro%/%tipo-imovel%/%postname%/. Exemplo: /cases/moema/restaurante/limpeza-caixa-gordura-200l/. Isso melhora SEO local, permite breadcrumbs automáticos e facilita filtros AJAX por taxonomia. Evite datas no slug.