تغییر رنگ آیکون در المنتور وردپرس

خیلی گشتم تا نتیجه رو از سایتهای زیر پیدا کردم(امر که فیلتر نبودن)

https://stackoverflow.com/questions/22252472/how-to-change-the-color-of-an-svg-element

که میگه:

To change any SVGs color

1. Add the SVG image using an <img> tag.

<img src="dotted-arrow.svg" class="filter-green"/>

2. To filter to a specific color, use the following Codepen(Click Here to open codepen) to convert a hex color code to a CSS filter:

For example, output for #00EE00 is

filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(87deg) brightness(119%) contrast(119%);

3. Add the CSS filter into this class.

    .filter-green{
        filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%);
    }

 

 

حالا اگر نمیدونید اسم آیکونتون چیه که باید به جای این بذارید:  .filter-green

باید بگم : من گذاشتم:

.elementor-icon-icon-alefsapp

چون:

 

مثلا من وقتی با fontello آیکونم رو ساختم (اول تصویر png بود بعد با inkscape اون رو به Svg تبدیل کردم بعد با سایت fontello به وبفونت تبدیلش کردم. موقعی که میساختم CSS Prefix آیکون رو گذاشتم icon-alef و اسم آیکون رو هم گذاشتم sapp

 

. بعد توی المنتور آپلودش کردم. خودتون هم میتونید بگردید ببینید اسمش چیه.

مهم: توی کد در قسمت اسم آیکونتون حتما باید تمام حروف کوچک باشند.