Having a large list with icons to include in HTML

icon-picons-abacus icon-picons-add icon-picons-airplay icon-picons-alert


<div class="col-sm-4 col"><em class="icon-picons-diamond"></em>

The word 'diamond should be replaced with the last word of the list (abacus, add, airplay, alert, and so on)

Tried it with find:


And several variations of replace, here only one:

\1<div class="col-sm-4 col"><em class="(*)"></em>

Always missing the part 'icon-picons-' and the place holder word (abacus, add, airplay, alert, and so on) appears at the end and not at the position after 'class'.
Getting search result:

<div class="col-sm-4 col"><em class="*"></em>abacus

Instaed of

<div class="col-sm-4 col"><em class="icon-picons-abacus"></em>

Thanks in advance, for your help, Go

  • 1
    I am confused. What is <div class="col-sm-4 col"><em class="icon-picons-diamond"></em> supposed to turn into? – MonkeyZeus Aug 28 '15 at 20:16

With extended expression you capture with parens () and replace the "n"th capture with \n. Note that isn't newline but n should be a number.

However, if I understood the question correctly, you have numerous diamond and need to replace each one with a different icon? Each successive one in the list of icons? I would look into replacing with a python plugin.

| improve this answer | |

The word "diamond" should be replaced with the last word of the list (abacus, add, airplay, alert, and so on)

  • Menu "Search" > "Replace" (or Ctrl + H)

  • Set "Find what" to icon-picons(.*)

  • Set "Replace with" to <div class="col-sm-4 col"><em class="icon-picons\1"></em>

  • Enable "Regular expression"

  • Click "Replace All"

    enter image description here




<div class="col-sm-4 col"><em class="icon-picons-abacus"></em>
<div class="col-sm-4 col"><em class="icon-picons-add"></em>
<div class="col-sm-4 col"><em class="icon-picons-airplay"></em>
<div class="col-sm-4 col"><em class="icon-picons-alert"></em>

Further reading

| improve this answer | |
  • Thanks a lot David, that's perfectly what I wanted. Sorry, your post crossed with my last post You're leaving me happy - Go – Go- Aug 28 '15 at 21:30

Thanks a lot, Hank,

I want to clarify this:
1. I have a list with over 500 rows icons and I want to add HTML code to the icon names, here three examples:

icon-picons-abacus, icon-picons-add, icon-picons-airplay and so on...

2. I want to add this HTML Code before:

<div class="col-sm-4 col"><em class="

and this HTML code after the icon name


3. The result for all 500 rows should look like:

<div class="col-sm-4 col"><em class="icon-picons-abacus"></em>

4. Instead of 'abacus' always the last word of 'icon-picon-'. Next would be 'add', then 'airplay', 'alert' and so on.

Hope I explained it well


| improve this answer | |
  • Welcome to Super User! Please use the Post Your Answer button only for actual answers. You should edit your original post to add additional information. – DavidPostill Aug 28 '15 at 21:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.