Prepare the artwork
Choose a symbol that explains the topic or action, then edit its color and padding. Check it against the section background. PNG is a straightforward option for image placement when your WordPress installation does not accept SVG uploads. Export at a sensible resolution for its final display size.
Use a supported insertion method
Upload rules depend on the site’s configuration and permissions. If SVG is unsupported, use PNG or an administrator-approved sanitizing SVG workflow. Do not enable arbitrary file uploads just to add an icon. An image element can display a downloaded asset; an icon-specific widget may support different libraries or formats.
Connect the actual action
A phone image does not create a working call button by itself. Add the intended link to the correct element and provide a readable label where practical. If the icon is decorative beside a heading, avoid repeating that heading in alternative text. Meaningful standalone artwork needs an appropriate text description.
Check responsive behavior
Inspect desktop and mobile layouts. Keep proportions intact and give interactive controls enough space around the image. When an icon becomes cramped beside text, fix the spacing rather than hoping that a higher-resolution export will solve the layout.
Keep a maintainable project
Save the source icon, export, and license notices with the website files. Record the collection and identifier for clients who may add matching artwork later. A PNG screenshot alone makes matching a visual system difficult.
See SVG versus PNG for export choices and accessible icon buttons for action labels.
An Elementor implementation example
For a services card with a heading and a decorative icon, use the relevant Image or Icon widget and keep the real service name as text. Add enough spacing that the symbol does not collide with the heading on mobile. If the card links to a service page, make the entire intended interactive area clear and keyboard accessible rather than placing a separate ambiguous icon button inside it.
SVG upload permissions differ between installations and security configurations. When an upload fails, do not disable WordPress file protections indiscriminately; use a trusted, sanitized SVG workflow or choose PNG. Test the image in the actual frontend, not just Elementor's editor. For scale choices, see icon sizing; for recoloring, see SVG with CSS.