How can i user add picture and text on my website? :D [closed]

enter image description here

Help 😀

  1. i want that u drag and drop from desktop a picture into the image div

2.bit more complicated i want to save the image and the “enter your favorite” text. Maybe add a little button where you can go like in edit mode. So the answer isnt always changable via one click if you catch my drift

Here my simple code:

<!----1 Rank--->
        
        <div class="container">
          <div class="row">
            <div class="col-sm">
              <div class="rankbox">
                <h2>1</h2>
                <input type="image" style="height: 200px; width: 200px;">
                <br>
                <br>
                <input type="text" id="rank_1" placeholder="Enter your favourite" style="text-align:center;"> 
              </div>
            </div>
          </div>
        </div>

thanks for ur attention