Hide Current Post from Related Grids in Salient (No IDs)

When displaying related posts or blog grids on a single post page in Salient, a common issue appears:

The current post shows up inside its own related post grid.

This creates redundancy, weakens internal linking effectiveness, and disrupts the user journey. Unlike themes that rely on static queries, Salient renders blog grids dynamically, which means many traditional WordPress fixes do not work reliably.

This guide explains:

Why this issue happens in Salient
Why common WordPress fixes fail
How Salient renders blog grids
A production-tested solution that works consistently
How to implement it safely using Code Snippets or a child theme

All solutions shown here:

Do not rely on post IDs
Do not modify WordPress queries
Do not break grid layouts
Work automatically across all posts

Why This Happens in Salient

Salient’s blog layouts (including Classic, Classic Enhanced, and masonry-style grids) are built using a dynamic rendering layer.

Depending on layout and settings, grids may be:

Rendered after page load
Rebuilt as images finish loading
Reflowed during responsive breakpoint changes
Reconstructed on window resize or interaction

Because of this behavior, the current post can be injected into the grid after server-side logic or one-time scripts have already executed.

Why Common Fixes Don’t Work in Salient

❌ Excluding Post IDs Manually

Not scalable across growing content libraries
Easy to forget during publishing
Requires ongoing editorial maintenance

❌ PHP Query Filters (pre_get_posts)

Often bypassed by Salient’s layout engine
Ineffective when grids are rebuilt client-side
Can fail when grids are reused across templates

❌ CSS-Only Hiding

Leaves empty columns or broken masonry alignment
Still renders the post in the DOM
Causes layout instability on resize

❌ One-Time JavaScript

Runs before the grid is fully rendered
Fails when Salient rebuilds the layout
Breaks under lazy-loading conditions

To solve this correctly, the fix must respect how and when Salient renders its grids.

The Core Strategy (Salient-Specific)

A reliable Salient-compatible solution must:

Detect blog cards dynamically
Match each card to the current post URL or path
Remove the entire column container, not just the inner content
Allow for delayed rendering and layout rebuilds
Stop execution once the layout stabilizes

This ensures the fix is both reliable and performant.

How Salient Renders Blog Grids

Salient blog grids are typically composed of:

A .blog-recent container
Individual .col elements for each post
Clickable overlays using .entire-meta-link

These elements may not exist immediately on page load and may be reconstructed multiple times during the page lifecycle.

Salient Solution (Production-Tested)

This solution waits for Salient to finish rendering, removes the current post card when it appears, and then stops itself automatically.

Where to Add the Code
You can add this solution using either:

A child theme, or
The Code Snippets plugin (recommended for easier maintenance)

Full Implementation Code


add_action('wp_footer', function () {
  ?>
  <script>
    (function () {
      var currentPath = window.location.pathname.replace(/\/$/, '');
      var maxTries = 50;
      var tries = 0;

      var interval = setInterval(function () {
        tries++;
        var removed = false;

        document.querySelectorAll('.blog-recent .col').forEach(function(card) {
          var link = card.querySelector('a.entire-meta-link');
          if (!link) return;

          var linkPath = link.pathname.replace(/\/$/, '');
          if (linkPath === currentPath) {
            card.remove();
            removed = true;
          }
        });

        if (removed || tries >= maxTries) {
          clearInterval(interval);
        }
      }, 200);
    })();
  </script>
  <?php
}, 999);

Using the Recommended Code Snippets Plugin

If you prefer not to add custom PHP to a child theme, this solution works cleanly with the Code Snippets plugin and is often the safest option for long-term maintenance.

Recommended Snippet Settings

When adding the snippet:

Code Type: PHP Snippet
Run Snippet: Only on site front-end
Scope: Global
Priority: Default

The wp_footer hook ensures the script runs after Salient’s dynamic blog grid begins rendering, which is critical for consistent behavior.

Why Code Snippets Is a Good Fit

Keeps theme files untouched
Avoids issues during theme updates
Makes the snippet easy to disable or adjust later
Widely used and actively maintained
Safer than editing functions.php directly

Do not enable this snippet for the WordPress admin area.
It relies on front-end DOM access and should only run on the public site.

Why This Solution Works Reliably

Accounts for delayed rendering and image-based reflows
Handles grid reconstruction and lazy loading
Removes the full column to prevent layout gaps
Stops execution automatically for performance
Does not interfere with other scripts or layouts

Key Takeaway

If the current post appears inside its own related content grid in Salient:

It’s not a WordPress bug
It’s not user error
It’s a result of Salient’s dynamic rendering behavior

The fix must respect render timing, not just query logic.

Understanding how Salient builds and rebuilds its grids is the key to solving this cleanly and reliably.

How to Hide the Current Post from Related Post Grids in Salient

A dynamic, ID-free solution for Salient blog layouts