Gerador de Botões para WordPress

Crie botões de CTA no estilo do print e copie o HTML pronto para colar no meio do post.

Botões (2)

Botão #1

Texto do botão

Link

Cor de fundo

Cor do texto

Ícone

Presets

Botão #2

Texto do botão

Link

Cor de fundo

Cor do texto

Ícone

Presets

Preview

How to find love after 40 with apps Best dating apps for people over 40

Código HTML

<div style="display:flex;flex-direction:column;gap:10px;margin:24px 0;max-width:100%;"><a href="https://example.com" target="_blank" rel="noopener noreferrer" style="display:flex;align-items:center;gap:12px;background:#e2007a;color:#ffffff;padding:16px 20px;border-radius:14px;text-decoration:none;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-weight:700;font-size:15px;line-height:1.3;text-align:left;text-transform:uppercase;letter-spacing:0.02em;box-shadow:0 4px 14px rgba(0,0,0,0.12);"><span style="display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:rgba(255,255,255,0.25);border-radius:50%;flex:0 0 24px;"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"/></svg></span><span style="flex:1 1 auto;">How to find love after 40 with apps</span><span style="flex:0 0 auto;display:inline-flex;align-items:center;"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M8 5l8 7-8 7V5z"/></svg></span></a><a href="https://example.com" target="_blank" rel="noopener noreferrer" style="display:flex;align-items:center;gap:12px;background:#00b4d8;color:#ffffff;padding:16px 20px;border-radius:14px;text-decoration:none;font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;font-weight:700;font-size:15px;line-height:1.3;text-align:left;text-transform:uppercase;letter-spacing:0.02em;box-shadow:0 4px 14px rgba(0,0,0,0.12);"><span style="display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:rgba(255,255,255,0.25);border-radius:50%;flex:0 0 24px;"><svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"/></svg></span><span style="flex:1 1 auto;">Best dating apps for people over 40</span><span style="flex:0 0 auto;display:inline-flex;align-items:center;"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M8 5l8 7-8 7V5z"/></svg></span></a></div>

Cole esse código no editor de HTML do WordPress, no meio do post.