Oculta los posts patrocinados en LinkedIn / Facebook / Twitter / X — CSS + MutationObserver
Los feeds de las redes sociales son ~30% de posts patrocinados mezclados con el orgánico. Los posts patrocinados están diseñados para no parecer publicidad — hashes de clases aleatorios, DOM dinámico. Los bloqueadores de anuncios estándar los interceptan por patrones de URL (DoubleClick, Adsense), no por el layout del feed. Ahí es donde JustZix, combinando CSS + JS, brilla.
LinkedIn (linkedin.com)
LinkedIn tiene el DOM más ofuscado. Los nombres de clases como .feed-shared-update-v2--ad son estables pero cambian con cada restyling. El text matching es fiable:
/* Intento CSS — intercepta algunos */
[data-ad-banner], .feed-shared-update-v2--promoted,
.feed-shared-actor__sub-description:has-text("Promoted") {
display: none !important;
}
El CSS :has-text() NO es estándar — es una pseudo-clase exclusiva de JustZix. Fallback vía MutationObserver JS:
// Regla JS — text-match «Promoted» en las cards del feed
const hideSponsored = () => {
document.querySelectorAll('.feed-shared-update-v2, [data-id*="urn:li:activity"]').forEach(card => {
if (card.dataset.jzChecked) return;
card.dataset.jzChecked = '1';
const text = card.textContent;
if (/^Promoted|Sponsored/m.test(text) ||
/\bPromoted\b/.test(card.querySelector('.feed-shared-actor__sub-description')?.textContent || '')) {
card.style.display = 'none';
JUSTZIX.log(`[LinkedIn] Card patrocinada oculta`);
}
});
};
new MutationObserver(hideSponsored).observe(document.body, {childList: true, subtree: true});
hideSponsored();
Facebook (facebook.com)
FB tiene marcadores basados en ARIA — más estables que los nombres de clases:
/* Posts con etiqueta «Sponsored» — Facebook usa atributos aria */
div[aria-label="Sponsored"],
div:has(> * > span[aria-label="Sponsored"]),
[data-pagelet*="Sponsored"] {
display: none !important;
}
/* Rail lateral con «Suggested for you» */
[aria-label="Suggested for you"], [aria-label="Reels and short videos"] {
display: none !important;
}
Booster JS — limpia el feed al hacer scroll, dado que el scroll infinito carga nuevos posts:
// Regla JS
new MutationObserver(() => {
document.querySelectorAll('div[role="feed"] > div').forEach(post => {
if (post.dataset.jzChecked) return;
post.dataset.jzChecked = '1';
if (post.querySelector('[aria-label="Sponsored"]')) {
post.style.display = 'none';
JUSTZIX.log('[FB] Patrocinado oculto');
}
});
}).observe(document.body, {childList: true, subtree: true});
Twitter / X (twitter.com / x.com)
X tiene una etiqueta «Promoted» como icono SVG + texto. Twitter tiene también barras laterales «Sugerencias» / «Tendencias para ti»:
/* Tweets patrocinados */
article:has([data-testid="promotedIndicator"]),
article:has(svg[data-testid="ad"]) {
display: none !important;
}
/* Barra lateral Tendencias + A quién seguir */
[aria-label="Timeline: Trending now"],
[data-testid="sidebarColumn"] [data-testid="UserCell"] {
display: none !important;
}
Caso de uso 1 — TOGGLE3 «Nivel de protección anti-anuncios»
Severidad de 3 estadios por plataforma:
// Acción TOGGLE3 «🛡️ Protección»
states[0] = { label: 'Off', value: 'off' } // sin filtrado
states[1] = { label: 'Normal', value: 'normal' } // ocultar patrocinado
states[2] = { label: 'Strict', value: 'strict' } // ocultar patrocinado + sugerido + tendencias
code: |
document.documentElement.dataset.jzProtection = value;
JUSTZIX.log(`Protección: ${value}`);
La regla CSS usa el atributo data:
html[data-jz-protection="off"] .jz-hide-sponsored { display: block !important; }
html[data-jz-protection="strict"] [aria-label*="Suggested"] { display: none !important; }
Caso de uso 2 — la Output Console cuenta los elementos ocultos
// En una regla JS:
let hiddenCount = 0;
window.JZ_HIDDEN_SPONSORED = () => {
JUSTZIX.log(`[${location.hostname}] Número de patrocinados ocultos: ${hiddenCount}`);
};
// Incrementa en cada .style.display = 'none': hiddenCount++;
// Llama desde la JS Console: JZ_HIDDEN_SPONSORED()
Trampas
- Los selectores cambian. Las plataformas sociales reorganizan a menudo el DOM para hacer más difícil el bloqueo. Prueba las reglas cada mes.
- El text-matching es frágil para el i18n. «Promoted» / «Sponsored» / «Patrocinado» / «Reklama» — idiomas distintos. Añade una disyunción regex.
- MutationObserver es costoso en los feeds grandes. Throttle el observer (debounce setTimeout 200 ms) si los FPS caen.
- :has-text() no es CSS estándar. JustZix lo admite. En CSS nativo usa :has(div:contains(...)) (también no estándar) o un observer JS.
Qué hacer después
- Oculta los banners de cookies — patrón gemelo
- Personaliza las apps de chat IA — patrón CSS + observer JS
- TOGGLE3 — selector de protección de 3 estados
Instala JustZix y recupera el 30% de tu feed para el contenido orgánico.
Valora este artículo
Sin valoraciones — sé el primero.