diff --git a/sharing_portal/static/sharing_portal/index.js b/sharing_portal/static/sharing_portal/index.js
index b6d97e17..0d9c592c 100644
--- a/sharing_portal/static/sharing_portal/index.js
+++ b/sharing_portal/static/sharing_portal/index.js
@@ -36,3 +36,10 @@
     }
   }
 })();
+
+function filter_artifacts(badge_filter) {
+  const filterInput = document.getElementById('cardFilter');
+  filterInput.value = ""; // reset the value in field
+  filterInput.value = badge_filter;
+  filterInput.dispatchEvent(new KeyboardEvent('keyup')); // trigger a keyup to apply filter
+}
diff --git a/sharing_portal/templates/sharing_portal/index.html b/sharing_portal/templates/sharing_portal/index.html
index a4b80058..f131432f 100644
--- a/sharing_portal/templates/sharing_portal/index.html
+++ b/sharing_portal/templates/sharing_portal/index.html
@@ -118,11 +118,12 @@ <h1>Trovi</h1>
       <h4>Badges</h4>
       {% for badge in badges %}
         <div>
-          <a href="{% url 'sharing_portal:index_all' %}?filter=badge:{{ badge.name|urlencode }}">
+          <button onclick="filter_artifacts('badge:{{ badge.name|urlencode }}')"
+          style="border:0.5px; padding-bottom:1 px; background-color: transparent;">
             {% with 'images/'|add:badge.name|add:'-logo-small.png' as logo_static %}
               <img src="{% static logo_static %}" alt="Small {{badge.name}} logo">
             {% endwith %}
-          </a>
+          </button>
           {% if badge.redirect_link %}
             <a target="_blank" href="{{ badge.redirect_link }}">{{badge.description}}</a>
           {% else %}
@@ -131,7 +132,7 @@ <h4>Badges</h4>
         </div>
       {% endfor %}
     </div>
-    
+
     <div class="sidebarNav__separator">
       <h4>Tags</h4>
       {% for tag in tags %}
@@ -140,7 +141,7 @@ <h4>Tags</h4>
       </div>
       {% endfor %}
     </div>
-    
+
   </div>
 </div>
 {% endblock %}