diff --git a/assets/javascripts/discourse-staff-notes/connectors/user-card-post-names/show-staff-notes-on-card.js.es6 b/assets/javascripts/discourse-staff-notes/connectors/user-card-post-names/show-staff-notes-on-card.js.es6
new file mode 100644
index 0000000..a43df2b
--- /dev/null
+++ b/assets/javascripts/discourse-staff-notes/connectors/user-card-post-names/show-staff-notes-on-card.js.es6
@@ -0,0 +1,21 @@
+import { emojiUrlFor } from "discourse/lib/text";
+
+export default {
+  shouldRender(args, component) {
+    const { siteSettings, currentUser } = component;
+    return siteSettings.staff_notes_enabled && currentUser && currentUser.staff;
+  },
+
+  setupComponent(args, component) {
+    const { user } = args;
+    const count =
+      user.get("staff_notes_count") ||
+      user.get("custom_fields.staff_notes_count") ||
+      0;
+    component.set("staffNotesCount", count);
+    component.set("emojiEnabled", component.siteSettings.enable_emoji);
+    component.set("emojiUrl", emojiUrlFor("pencil"));
+    component.set("user", user);
+    component.set("staffNotesTitle", I18n.t("staff_notes.show", { count }));
+  }
+};
diff --git a/assets/javascripts/discourse-staff-notes/templates/connectors/user-card-post-names/show-staff-notes-on-card.hbs b/assets/javascripts/discourse-staff-notes/templates/connectors/user-card-post-names/show-staff-notes-on-card.hbs
new file mode 100644
index 0000000..daa8634
--- /dev/null
+++ b/assets/javascripts/discourse-staff-notes/templates/connectors/user-card-post-names/show-staff-notes-on-card.hbs
@@ -0,0 +1,9 @@
+{{#if staffNotesCount}}
+  {{#link-to "user" user title=staffNotesTitle}}
+    {{#if emojiEnabled}}
+      <img src={{emojiUrl}} title={{staffNotesTitle}} alt="pencil" class="emoji">
+    {{else}}
+      {{d-icon "sticky-note"}}
+    {{/if}}
+  {{/link-to}}
+{{/if}}