Search code examples
htmlimagehyperlinksrcimgur

inserting multiple direct image links into <img src=""> codes


I lined up multiple direct image links in my notepad. I'd like to convert them all into img src codes all at once without having to paste each link between the quotation marks. For example:

Direct image links:

-https://bbbbb.org/e/x1.jpg

-https://bbbbb.org/e/x2.jpg

-https://bbbbb.org/e/x3.jpg

img src codes:

<img src=" https://bbbbb.org/e/x1.jpg ">

<img src=" https://bbbbb.org/e/x2.jpg ">

<img src=" https://bbbbb.org/e/x3.jpg ">

It's really time consuming to do this with each link, especially when you have around 500-1000 images.

I'm looking for a method or a tool to save that time for me, by simply pasting all the links I have then converting them into codes.

the tool already exists in imgur, it generates multiple 'a herf' links by choosing the images I already uploaded in my account, only now I already have the direct links. I'm just looking for a way to convert them to the code and paste the HTML code in my blog directly. I'm doing this because blogger compresses my image size, this code prevents that.


Solution

  • Instead of Notepad, use a more sophisticated code editor in order to use multi-select. I like VS Code. There are multiple ways to activate this: https://code.visualstudio.com/docs/editor/codebasics#_multiple-selections-multicursor

    My favorite is by holding down the roller button on the mouse and then dragging down where you want the cursor to be on each line. Then you can edit each line at once.

    I made a gif for you:

    enter image description here