The components in VibeBP come with their own icon set. The icons run on filter : vibebp_component_icon , the usual icon size is 24px x 24px
- Download a suitable SVG icon [ checkout https://feathericons.com]
- Copy the svg icon code
- Note the component’s name. Also available in url as #component=COMPONENT-NAME
- Add below code in your child theme – functions.php
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
add_filter('vibebp_component_icon'function($icon,$compoent({ | |
if($id == 'wishlist'){ // Check component id , set $icon as svg | |
$icon = '<svg width="24" height="24" viewBox="0 0 24 24" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> | |
<path d="M15.473,19.593C14.365,20.679 13.198,21.812 12,23C5.57,16.619 0,11.853 0,7.192C0,0.423 8.852,-1.154 12,4.248C15.125,-1.114 24,0.4 24,7.192C24,7.938 23.844,8.688 23.577,9.445C22.461,8.543 21.043,8 19.5,8C15.916,8 13,10.916 13,14.5C13,16.563 13.97,18.401 15.473,19.593Z" style="fill-opacity:0.6;fill-rule:nonzero;"/> | |
<path d="M19.5,10C17.017,10 15,12.015 15,14.5C15,16.985 17.017,19 19.5,19C21.983,19 24,16.985 24,14.5C24,12.015 21.983,10 19.5,10ZM22,15L20,15L20,17L19,17L19,15L17,15L17,14L19,14L19,12L20,12L20,14L22,14L22,15Z" style="fill-rule:nonzero;"/></svg>'; | |
} | |
return $icon; | |
},10,2); |
Leave A Comment?