Insert Magnifying Glass Image (icon) Inside Search Bar? - Question | JoomShaper
Back to the questions

Insert Magnifying Glass Image (icon) Inside Search Bar?

SC

Shirley Craig

Helix Framework 1 year ago

How to insert a magnifying glass image/icon inside the search bar instead of the text "Search..." ?

I tried this but nothing changes...

sp-search #sp-search-submit{background-image: url(https://dev.revuptech.com/templates/shaper_helixultimate/images/search.png) 50% 50% no-repeat;width:26px;height:26px;z-index:9999;border:none;right:15px;top:2px;position:absolute;text-indent:-99999px;}

Thank you.

0
1 Answers
Order by
Oldest Newest Votes
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 year ago #102940

Hi Shirley,

#mod-search-searchword265::placeholder {
  color: transparent;
}

#mod-search-searchword265 {
  background-image: url(www.dev.revuptech.com/images/icon.png);
  background-position: right;
  background-repeat: no-repeat;
}

first find magnifying glass icon (png, 16x16px) and upload to /images folder

Whole rest is in your hands!

0