Hide “Copy” and Feedback (👍/👎) Buttons in Pickaxe Chats
Hey team! Today’s custom script lesson falls under the umbrella of chat UI. This one shouldn’t be too tough to implement either!
Script can be found at the bottom of this post (-:
Use case: Minimalist chat UI: remove Copy and feedback controls from message action bars. Works for Studio and script-embed (same DOM). For iframes, see the note below.
- custom-js
- studio
- script-embed
- ui-cleanup
What it does
- Hides “Copy” buttons immediately via CSS (prevents flash on load).
- Removes any matching buttons from the DOM (covers theme/markup variations).
- Hides/removes feedback (👍/👎, like/dislike, upvote/downvote).
- Resilient to re-renders via a
MutationObserver.
How to use
- In Studio’s “Settings->Website Code Injection->HEADER” (or after your script-embed on your site), paste the Code Snippet from below.
- Reload and verify that Copy/👍/👎 are gone for new and existing messages.
- Optional: set
DEBUG = truein the snippet to log what gets removed.
Compatibility
- Studio: ✅ Paste in “Custom Scripts”.
- Script Embed: ✅ Paste after your Pickaxe script.
- Iframe (same-origin): ✅ Works if you inject the snippet inside the iframe’s document.
- Iframe (cross-origin): ⚠️ Not accessible from the host page so use Script Embed or inject from the iframe origin.
Troubleshooting
- Buttons flash on load: Keep the inline
<style>part of the snippet so it prevents the flash of unwanted content. - Custom theme classes: Add your extra selectors to the CSS list if needed.
- Nothing happens: Turn on
DEBUGand check the console for matches/removals.
Please please reply below with any questions, we're here to help!!
<style id="pa-hide-copy-buttons">
/* Hide copy buttons immediately (prevents flash on page load) */
/* Copy buttons by aria-label or title */
button[aria-label*="copy" i],
button[title*="copy" i],
/* Pickaxe embed specific (pxe- prefixed classes) */
.pxe-flex.pxe-h-4.pxe-items-center.pxe-gap-3 > button.pxe-flex.pxe-items-center.pxe-gap-1.pxe-opacity-70,
/* Pickaxe Studio specific (unprefixed classes) */
.flex.h-4.items-center.gap-3 > button.flex.items-center.gap-1.opacity-70,
/* Feedback buttons (thumbs up/down, like/dislike) */
[aria-label*="thumb" i],
[aria-label*="like" i],
[aria-label*="dislike" i],
[aria-label*="upvote" i],
[aria-label*="downvote" i] {
display: none !important;
visibility: hidden !important;
pointer-events: none !important;
}
</style>
<style id="pa-hide-copy-buttons">
/* hide copy button and feedback buttons */
.pxe-flex.pxe-h-4.pxe-items-center.pxe-gap-3
> button.pxe-flex.pxe-items-center.pxe-gap-1.pxe-opacity-70,
.flex.h-4.items-center.gap-3 > button.flex.items-center.gap-1.opacity-70,
[aria-label*="thumb" i],
[aria-label*="like" i],
[aria-label*="dislike" i] {
display: none !important;
}
</style>
<script>
(() => {
if (window.__PA_HIDE_COPY__) return;
window.__PA_HIDE_COPY__ = true;
const DEBUG = false; // set to true for console logs
if (DEBUG) console.log("[pickaxe] hide copy button active");
function removeButtons() {
let removed = 0;
// remove unlabeled icon buttons in action bars
document
.querySelectorAll(
".pxe-flex.pxe-h-4.pxe-items-center.pxe-gap-3 button, .flex.h-4.items-center.gap-3 button",
)
.forEach((btn) => {
if (
btn.querySelector("svg") &&
!btn.getAttribute("aria-label") &&
!btn.textContent.trim()
) {
btn.remove();
removed++;
}
});
// remove feedback buttons
document
.querySelectorAll("[aria-label*='thumb' i], [aria-label*='like' i]")
.forEach((btn) => {
btn.remove();
removed++;
});
if (DEBUG && removed > 0) {
console.log(`[pickaxe] removed ${removed} button(s)`);
}
}
removeButtons();
new MutationObserver(removeButtons).observe(document.body, {
childList: true,
subtree: true,
});
})();
</script>