How can i add photos to my sololearn playground

Question

Please how can I add image or video from my file to sololearn code playground 🙏🙏😎😎 😎

Answer 1

Try this way explained in code

https://code.sololearn.com/WZZou4tJQrjO/?ref=app

https://code.sololearn.com/WVHIFpWweKDk/?ref=app

Answer 2

There are basically 2 options for adding images to a "web" code in Sololearn's Code Playground. None are as ideal or elegant as you probably want but they work.

1. Use base 64 encoding for all of the images data and embed that encoding in either HTML or CSS. I use a tool at: https://www.base64-image.de/ to quickly upload and get encodings and then paste them into the 'background-image' value in CSS or to the SRC attribute of an img element in HTML.

I used this technique in a couple of my web codes including:
- https://code.sololearn.com/WiH4n0rrvD1B/ for a little thumbnail at the end of the animation
- https://code.sololearn.com/Wj4ErOsPXhhk/#css for the edited image of the pastor

2. You can reference your image from another host. If you found the image on another site, you could use an absolute URL to it. If it isn't already publicly accessible, you could upload images to many places to get a working URL including facebook, Google Drive, pinterest. Just make sure you can access it without being logged into any accounts.

Base 64 is ok for small images but video is a lot more data. I would upload the videos to youtube, Google Drive or similar and link a player to that.