Add Images or Icons to Any Part of a Heading in Elementor - Fully Responsive - WordPress
The CSS required to do this is pinned 📌 to the top comment.
Get Elementor: https://be.elementor.com/visit/?bta=2...
Hosting I love and recommend for most clients and for those on a budget: https://www.hostg.xyz/SHBd2
🧙 Wizards of Webcraft – A series where I’ll be reviewing your websites - https://www.reialesa.com/wow/ Apply now!
You've probably seen websites with headings that have images or icons placed in between the words. It looks cool, it makes everything more unique and it's just a very good looking effect. But if you try to create something similar by combining the heading and image widgets in Elementor, it's very difficult. And worse yet, it's not responsive. At all.
Luckily, there's an easy solution. Placing images inside a heading is easy to do with a little bit of CSS. By using this method, the image actually acts as a part of the heading, which means that it's fully responsive. You can control how large the images are and whether or not they have a rounded edge or not. On top of that, you can always add in more media queries to make sure the effect looks amazing on every device.
And since this is created entirely with CSS, it doesn't just work with Elementor. It works anywhere, including other WordPress page builders.
Adding in pictures or icons to your headings is a great way to stand out and to make your website more interesting.
#elementor #heading #images
Get in touch:
https://www.reialesa.com/youtube/
Don’t be shy! Let me know what you’d like to see next, ask me anything related to design or just simply say hi.
Please note that some of the above are affiliate links, which means I earn a commission if you make a purchase, at no additional cost to you. Thank you very much if you decide to use them!
