> For the complete documentation index, see [llms.txt](https://docs.renderdraw.us/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.renderdraw.us/usage-scenarios/use-cases/3d/end-user-usage/3d-annotations-and-comments.md). # 3D Annotations & Comments {% embed url="" %} ## [Using Salesforce Annotations to Add a Video and Actions](https://app.tango.us/app/workflow/0dac8244-c0a6-4b2e-a515-201957020532?utm_source=magicCopy\&utm_medium=magicCopy\&utm_campaign=workflow%20export%20links) ​ ### # Start on a page that has our Canvas 3D component #### 1. Click on Show Action Menu ![Click on Show Action Menu](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/182bf520-64bd-49ab-8b3d-e56c9ba10c2f/eeadaf7b-f016-44f1-a371-7c40295855a4.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.0405\&fp-y=0.3981\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=88\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0xMTImaD04NiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 2. Click on Annotations ![Click on Annotations](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/ebf1a84f-6c8c-46dd-b87e-0008e81fde4a/22e5bd72-1f07-4c92-8875-e1bf7f8f654d.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.0907\&fp-y=0.5019\&fp-z=2.3220\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=71\&mark-y=342\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0zNjQmaD03MSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 3. You will see the annotations component popup. Looks like someone already created an annotations context here ![You will see the annotations component popup. Looks like someone already created an annotations context here](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/75db9fe4-9da2-4dda-979c-6274f0ba7461/13e0f3f4-c51b-4753-8a2d-1edbfb3701b4.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9144\&fp-y=0.3572\&fp-z=3.0145\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=767\&mark-y=341\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0yNDcmaD03MiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 4. Click on Add Action Item ![Click on Add Action Item](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/82d197ae-fe20-41ce-bebe-fd309f8f1cf1/d33cd66c-b8de-44a1-838f-e432021b203a.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.8475\&fp-y=0.3606\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=617\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz04NiZoPTg2JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D) #### 5. Click on the temporary title ![Click on the temporary title](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/d0ae313c-8075-46f3-b2bf-51cb079d6cc5/2cf03c78-e47a-40f8-99a4-9b0faa800716.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.8975\&fp-y=0.4971\&fp-z=3.0769\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=700\&mark-y=348\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0yNDMmaD01OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 6. Type your new title, here it will be contextual so those coming behind you will know what we're talking about. "Replace guard?" ![Type your new title, here it will be contextual so those coming behind you will know what we're talking about. "Replace guard?"](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/eb83af86-2e5c-4f27-828a-756f1f54dbab/350ef40d-f4de-4066-84b4-0c4288c0cf39.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.8832\&fp-y=0.3750\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=647\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0yNzkmaD04NiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 7. Click on Create Annotation ![Click on Create Annotation](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/a3424980-02cc-4027-9680-fd89bef2b8d8/c3ca8546-44a2-49a5-a78a-3c35a905ffc6.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9383\&fp-y=0.3750\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=938\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz04NiZoPTg2JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D) #### 8. Click on Content Type ![Click on Content Type](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/d87fca25-3561-4be5-aa66-394b7ef47f10/4a4df420-2f54-49bf-ac2d-911eb9959438.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.4010\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=602\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01MDImaD04NiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 9. There are four types of annotations we can add. Text is standard text, Image URL is the direct URL to an image, Video URL is a direct URL to a video, e.g. mp4, and iframe will load whatever page you want in the context of the annotation ![There are four types of annotations we can add.](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/2c0a602e-f898-4db2-b63a-dcad3c6356cd/7e3d7fc2-ca86-4d6f-8834-71c031801cc7.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.4399\&fp-z=2.9296\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=609\&mark-y=332\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz00OTMmaD05MSZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 10. Type your content "Should we replace the guard?" ![Type your content "Should we replace the guard?"](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/28eaeca6-12f6-4684-abf7-f3ae89f1a659/922136f6-9fac-49b7-b439-a5dd087a5cac.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.4784\&fp-z=2.7586\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=641\&mark-y=312\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz00NjkmaD0xMzAmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 11. Repeat as needed; remember to save periodically. ![Repeat as needed; remember to save periodically.](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/3ca479ca-46df-444d-bc92-c6d756cbee13/ed527936-2271-4aa8-a67c-98032c80c15f.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.6216\&fp-z=1.3282\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=912\&mark-y=2\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0yNjQmaD03NTEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 12. Let's embed a YouTube video. Click on Create Annotation ![Let's embed a YouTube video. Click on Create Annotation](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/a8542401-1c5b-4567-a847-90c3421e321f/d02e57fb-602e-42ed-a748-35689e4d744c.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9383\&fp-y=0.2808\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=938\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz04NiZoPTg2JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D) #### 13. Click on Content Type ![Click on Content Type](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/a14542a7-ad6a-4fe7-a7ff-9685b0b4d779/781a48b3-eed4-48fd-9601-70ee63151033.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.6154\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=602\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01MDImaD04NiZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw) #### 14. Click on IFrame URL ![Click on IFrame URL](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/8e75b773-50ca-404b-b2a4-ab0fb7cf1f57/e4f7eee4-e5e8-43ca-8e3b-03a4a28ab67b.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.7543\&fp-z=3.7545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=442\&mark-y=319\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz02MzImaD0xMTcmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 15. Paste in your youtube link in this case, "" ![Paste in your youtube link in this case, "https://www.youtube.com/watch?v=eB0aROCl530"](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/78b3d438-bf4f-4085-9967-b92ea6203382/b6efe94e-3541-4967-988a-8a1c277f0b9e.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.6928\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=602\&mark-y=308\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01MDImaD0xMzkmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 16. Click on Show Action Menu… ![Click on Show Action Menu…](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/973cde89-e56d-4ab2-8d6a-ecaf57fd488a/256d54e1-0a3b-4e3b-8884-eb74f463461a.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.6216\&fp-z=1.3282\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=912\&mark-y=2\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0yNjQmaD03NTEmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 17. fix the URL by replacing /watch?v= with /embed/ This is Youtube's convention to allow embedding inside of other websites "" ![fix the URL by replacing /watch?v= with /embed/ This is Youtube's convention to allow embedding inside of other websites "https://www.youtube.com/embed/eB0aROCl530"](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/140ab9b5-db74-4290-87f9-6a2671e40e73/b70db60f-03a8-4b3f-9ce5-719fb95a7307.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9020\&fp-y=0.6928\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=602\&mark-y=308\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01MDImaD0xMzkmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 18. Lets take a look, Click on the annotation, number 2 ![Lets take a look, Click on the annotation, number 2](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/37be4334-8430-4c1d-9616-d3589de2e39b/58228930-c266-4065-8f46-e6c1f57ec431.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.5620\&fp-y=0.5413\&fp-z=2.9714\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=559\&mark-y=337\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz04MiZoPTgyJmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D) #### 19. We see the video now when selected, Click on Play to view and hear the video ![We see the video now when selected, Click on Play to view and hear the video](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/b76948c9-45b9-48c5-b0b3-411a71ecd2ba/6a2dc5fc-e671-480a-8417-7f28e4d170d2.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.6636\&fp-y=0.6298\&fp-z=2.8261\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=522\&mark-y=320\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz0xNTYmaD0xMTUmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D) #### 20. When done, Click on Save. This will update our Interaction Definition Record related to this annotation ![When done, Click on Save. This will update our Interaction Definition Record related to this annotation](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/39e1348a-d4f1-411f-9bcc-a800471c3492/b8c42a87-e5b3-411f-af45-393a63f468ae.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.9661\&fp-y=0.2808\&fp-z=2.9545\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=1037\&mark-y=335\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz04NiZoPTg2JmZpdD1jcm9wJmNvcm5lci1yYWRpdXM9MTA%3D) #### 21. We see the record was updated. Repeat this as needed for each visual that needs annotations ![We see the record was updated. Repeat this as needed for each visual that needs annotations](https://images.tango.us/workflows/0dac8244-c0a6-4b2e-a515-201957020532/steps/e4699323-aa6f-48c3-864a-4c4e2c02b297/77eee561-999f-43bf-9945-51f155db610a.png?fm=png\&crop=focalpoint\&fit=crop\&fp-x=0.5003\&fp-y=0.1250\&fp-z=1.6800\&w=1200\&border=2%2CF4F2F7\&border-radius=8%2C8%2C8%2C8\&border-radius-inner=8%2C8%2C8%2C8\&mark-x=302\&mark-y=115\&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTQlMkNGRjc0NDImdz01OTUmaD04OCZmaXQ9Y3JvcCZjb3JuZXItcmFkaXVzPTEw)