# How can I add a Copy Button?

**URL:** <https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333>\
**Category:** Questions about Thunkable X\
**Tags:** beginner\
**Created:** [December 19, 2020, 12:04pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333 "2020-12-19T12:04:19Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![mikailsarkar02g0m](https://avatars.discourse-cdn.com/v4/letter/m/3d9bf3/32.png) [@mikailsarkar02g0m](https://community.thunkable.com/u/mikailsarkar02g0m)\
**Post date:** [December 19, 2020, 12:04pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/1 "2020-12-19T12:04:19Z")

</div>

Please, Help me. I am making a Book app. I have written some Poems on different Label. I want to make a Copy Button under every Poem (Label) separately. Clicking this Button My app user can copy that poem. How can I make this Copy Button?  
Thank You

---

<div class="post-metadata">

**Author:** ![aaminahmansuri59h](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/aaminahmansuri59h/32/89753_2.png) [@aaminahmansuri59h](https://community.thunkable.com/u/aaminahmansuri59h)\
**Post date:** [December 19, 2020, 4:20pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/2 "2020-12-19T16:20:37Z")

</div>

I think this is impossible in thunkable.

---

<div class="post-metadata">

**Author:** ![aaminahmansuri59h](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/aaminahmansuri59h/32/89753_2.png) [@aaminahmansuri59h](https://community.thunkable.com/u/aaminahmansuri59h)\
**Post date:** [December 19, 2020, 4:35pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/3 "2020-12-19T16:35:13Z")

</div>

But I have tried something for you. Please check here.

 ![IMG_20201219_220312](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/4/b/4baec6d70625f613530aa79a9d8b91aac09ed077.jpeg)

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [December 19, 2020, 6:06pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/4 "2020-12-19T18:06:37Z")

</div>

You can definitely copy the contents of a label but where do you want those contents to be pasted/saved?

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [December 19, 2020, 7:02pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/5 "2020-12-19T19:02:46Z")

</div>

I would also like to see a “copy to clipboard “ on click event for buttons or labels.

---

<div class="post-metadata">

**Author:** ![drted](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/drted/32/92694_2.png) [@drted](https://community.thunkable.com/u/drted)\
**Post date:** [December 19, 2020, 10:53pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/6 "2020-12-19T22:53:37Z")

</div>

Unfortunately, I don’t think Thunkable has a copy to clipboard option. Most languages do, alas, not Thunkable.

As a bit of a hack, you COULD transfer the text from a LABEL into a TEXT\_INPUT control and prompt the user to copy the text from the TEXT\_INPUT.

Not a great solution, but better than nothing…

---

<div class="post-metadata">

**Author:** ![mikailsarkar02g0m](https://avatars.discourse-cdn.com/v4/letter/m/3d9bf3/32.png) [@mikailsarkar02g0m](https://community.thunkable.com/u/mikailsarkar02g0m)\
**Post date:** [December 20, 2020, 3:43pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/7 "2020-12-20T15:43:25Z")

</div>

I want “Copy to Clipboard”

---

<div class="post-metadata">

**Author:** ![mikailsarkar02g0m](https://avatars.discourse-cdn.com/v4/letter/m/3d9bf3/32.png) [@mikailsarkar02g0m](https://community.thunkable.com/u/mikailsarkar02g0m)\
**Post date:** [December 20, 2020, 3:54pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/8 "2020-12-20T15:54:21Z")

</div>

Sorry I cannot do this way.

---

<div class="post-metadata">

**Author:** ![mikailsarkar02g0m](https://avatars.discourse-cdn.com/v4/letter/m/3d9bf3/32.png) [@mikailsarkar02g0m](https://community.thunkable.com/u/mikailsarkar02g0m)\
**Post date:** [December 20, 2020, 3:57pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/9 "2020-12-20T15:57:07Z")

</div>

Oh. Ok Thanks a lot

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [December 20, 2020, 6:01pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/10 "2020-12-20T18:01:15Z")

</div>

I’m wondering if a JavaScript solution would work with the webviewer.

```auto

<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="https://thunkable.github.io/webviewer-extension/thunkableWebviewerExtension.js" type="text/javascript"></script>
  </head>
  <body>
  <script type="text/javascript">
 function copyToClipboard(value) {
  var tempInput = document.createElement("textarea");
  tempInput.value = value;
  document.body.appendChild(tempInput);
  tempInput.select();
  document.execCommand("copy");
  document.body.removeChild(tempInput);
} 

ThunkableWebviewerExtension.receiveMessage(function(message) {
copyToClipboard(message)
});
  </script>
</html>

```

[https://x.thunkable.com/copy/00c79b0c245b1c0101476aceac42981e](https://x.thunkable.com/copy/00c79b0c245b1c0101476aceac42981e)

this does in fact work!

the only blocks needed

 ![Screen Shot 2020-12-20 at 2.12.30 PM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/2/d/2d5e3871ae6c72463a0bd0f22e3dbd05418b3f78.png)

@darren this would be a cool addition to sendth.at perhaps?!

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [December 20, 2020, 7:21pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/11 "2020-12-20T19:21:10Z")

</div>

The copy part is easy… the paste isn’t. But you haven’t said yet where the content would be pasted. Is it going into the middle of a text input field (probably difficult but not impossible)? Is it replacing a single label (easy)?

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [December 20, 2020, 7:22pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/12 "2020-12-20T19:22:37Z")

</div>

This is true! Within or outside of the app. Do you mean otherwise?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [December 20, 2020, 8:17pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/13 "2020-12-20T20:17:36Z")

</div>

I’m waiting to hear back from @mikailsarkar02g0m who hasn’t specified the answer. But I meant within the app.

---

<div class="post-metadata">

**Author:** ![luv.ak.tech](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/luv.ak.tech/32/104896_2.png) [@luv.ak.tech](https://community.thunkable.com/u/luv.ak.tech)\
**Post date:** [December 21, 2020, 4:26pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/14 "2020-12-21T16:26:40Z")

</div>

@jared your app is not working it is not copying

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [December 21, 2020, 5:21pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/15 "2020-12-21T17:21:59Z")

</div>

Hey there. Sorry that it’s not working, I’m not sure why. I guess you’ll have to make it yourself.

All that it takes is a webviewer, the webviewer block post message, and whatever text do you want to clip to the clipboard you send as the message from the post message block. Direct your web viewer to the following URL  
[Jaredgibb.github.io/CopyToClipboard](http://Jaredgibb.github.io/CopyToClipboard)

---

<div class="post-metadata">

**Author:** ![luv.ak.tech](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/luv.ak.tech/32/104896_2.png) [@luv.ak.tech](https://community.thunkable.com/u/luv.ak.tech)\
**Post date:** [December 22, 2020, 3:43pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/16 "2020-12-22T15:43:09Z")

</div>

now it works but if we set web viewer visible false it not works maybe problem with web viewer still we can se the web viewer height to 0.1 and width 0.1 and it will be invisible

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [December 22, 2020, 3:48pm UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/17 "2020-12-22T15:48:38Z")

</div>

try this to make it dissapear

set height to 0px  
position to absolute  
top offset to -50px

 ![Screen Shot 2020-12-22 at 10.46.52 AM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/2/0/20284a4e7146d362a30423b806273e979582c103.png)

---

<div class="post-metadata">

**Author:** ![eko.devs.apploroceo](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/eko.devs.apploroceo/32/93147_2.png) [@eko.devs.apploroceo](https://community.thunkable.com/u/eko.devs.apploroceo)\
**Post date:** [December 23, 2020, 5:48am UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/18 "2020-12-23T05:48:09Z")

</div>

hey try  
this  
 ![Screen Shot 2020-09-30 at 11.42.44 AM](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/6/7/6791893c222446ec08be91f45d9ccdf75a195632.png)  
probably it is a rip

---

<div class="post-metadata">

**Author:** ![luv.ak.tech](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/luv.ak.tech/32/104896_2.png) [@luv.ak.tech](https://community.thunkable.com/u/luv.ak.tech)\
**Post date:** [December 23, 2020, 5:49am UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/19 "2020-12-23T05:49:00Z")

</div>

well it is just with in text to copy text to clipboard then you can use @jared’s method

---

<div class="post-metadata">

**Author:** ![jaythemanchs](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jaythemanchs/32/92809_2.png) [@jaythemanchs](https://community.thunkable.com/u/jaythemanchs)\
**Post date:** [December 24, 2020, 6:32am UTC](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333/20 "2020-12-24T06:32:04Z")

</div>

This example will not work for live test on the web as it is missing the ending tag:

```
</body>

```

It should be placed before the ending tag:

```
</html>
```

[Next page](https://community.thunkable.com/t/how-can-i-add-a-copy-button/1040333.md?page=2)