Hide the Current Post Card in Avada

Hide the Current Post Card in Avada Without Post IDs

Remove the current post from Avada’s Related Posts or Post Cards

If you’re using the Avada theme for your WordPress site, you may have noticed that automatically generated post cards or related post grids sometimes include the current post itself. That can feel redundant and impact user experience. Fortunately, there’s a simple fix — and you don’t need to manually exclude individual post IDs.

In this article, we’ll show you how to dynamically hide the current post’s card across all single post pages in Avada v7.13.3, using a lightweight JavaScript snippet.

Why This Matters

  • Prevents redundancy by hiding the post you’re already reading.
  • Creates a cleaner, more professional related-post grid.
  • Works automatically for all posts — no need to update IDs.
  • Enhances user experience and overall content presentation.

How Avada Renders Post Cards

In Avada, related post sections often appear with markup like this:


<div class="fusion-post-cards fusion-post-cards-1 fusion-grid-archive fusion-grid-columns-4">
  <ul class="fusion-grid fusion-grid-4">
    <li class="post-card fusion-grid-column fusion-post-cards-grid-column">
      <a href="https://your-site.com/current-post/">…</a>
    </li>
    <!-- other post cards -->
  </ul>
</div>

Each post card sits inside an <"li"> element with the class post-card, and each includes a link to the post. By comparing the current page’s URL to the link inside each card, we can detect and hide the one that matches.

The Solution: Dynamic JavaScript Snippet

Because Avada’s “Space before <'/body'>” field requires valid HTML/JavaScript, we’ll use the snippet below.

Paste this code directly into AvadaTheme OptionsAdvancedCode FieldsSpace before :


<script>
document.addEventListener('DOMContentLoaded', function() {
    // Get the current URL of the page
    var currentURL = window.location.href;

    // Select all post cards inside the grid
    var postCards = document.querySelectorAll('.fusion-post-cards .post-card');

    postCards.forEach(function(card) {
        var link = card.querySelector('a');
        if (link && (link.href === currentURL || link.href === currentURL.replace(/\/$/, ''))) {
            // Hide this card if its link matches the current page URL
            card.style.display = 'none';
        }
    });
});
</script>

How It Works

1. The script waits until the page fully loads.
2. It retrieves the current post’s full URL
3. If any card’s link matches the current post’s URL, that card is hidden automatically.

Result: The current post disappears from the related post grid dynamically — no post ID or manual update required.

Optional Layout Adjustment

If your grid leaves a gap where the post was removed, you can ensure smooth layout flow with this small CSS tweak:


<style>
.fusion-post-cards .fusion-grid .post-card {
    transition: none;
}
</style>

This ensures your post grid gracefully reflows after the card is hidden.

Why Not Use Post IDs or Built-In Options?

Earlier versions of Avada didn’t include an “Exclude Current Post” option in the Theme Options panel. Manually entering post IDs for each article is inefficient and not scalable. This JavaScript approach automates the process globally — simple, elegant, and maintenance-free.

About Tech Prime Web

Tech Prime Web provides professional WordPress development and customization services, specializing in the Avada theme. Our team helps businesses and agencies unlock Avada’s full potential through advanced configurations, performance optimization, and custom functionality—like this dynamic post-card exclusion.

Whether you need help building a high-performance WordPress site or fine-tuning your Avada design, Tech Prime Web delivers scalable, code-clean, and SEO-friendly solutions.

Get in touch to discover how we can help your website perform better, load faster, and work smarter.