Hi all customer,
In this topic tutorial we’ll help you change SVG image in Heading of our theme.
We’ll use Shang theme as example:
Step 1: Use Inspect tool of Browser to see Heading SVG image like this:

View Larger Image
You can right click on the Heading Element to view it.
Step 2: You will get image SVG url like this: http://dev.harutheme.com/harutheme/shang/wp-content/themes/shang/assets/images/img-scissor.svg
You need upload your own SVG image in Media -> Add New and get new image URL
Step 3: Go to Appearance -> Customize -> Additional CSS and add this code:
.vc_custom_heading.heading_style_4:before {
width: 49px; // Change to your new image width
height: 25px; // Change to your new image height
-webkit-mask-image: url(new_image_url.svg);
mask-image: url(new_image_url.svg);
}
How to get this: .vc_custom_heading.heading_style_4:before please see in the screenshot above.
Hope this help you all and thanks for reading!
*****
Regards,
HaruTheme
-
This topic was modified 1 year, 11 months ago by
admin.
-
This topic was modified 1 year, 11 months ago by
admin.
-
This topic was modified 1 year, 11 months ago by
admin.