Depending on the visuals and construction of your website's graphic button components, you may want additional help updating them. This can be seasonal or as-needed.
CivicPlus can evaluate your graphic buttons and decide if a button template would help. The template and instructions are always unique to your site. The outline below gives you an idea of what to expect and what CivicPlus provides.
Visual Resources
If you need help on where to start with collecting new visual components, check out the following potential options:
Free Icon Resources:
Paid-for Icon/Image Resources:
Figma Graphic Button Template
You will need access to Figma to open and edit your provided template. Figma offers a free, online UI tool if you do not already have it installed.
Once you receive your Figma template, open the file to access the graphics and update them as needed. Review the notes and document layer names for instructions on what to update.
Make sure the new icon you place in the template is the correct color. This setting is on the right side of Figma when you click into the icon layer.
Saving your Files
Icon-based visuals: SVG. PNG is the second alternative
Image-based visuals: JPG
Tips for Updating a Graphic Button Within Your Website
Always start with a copy of an existing button. This keeps the structure, style, and hover effect consistent. You will not need to build a new button from scratch.
Find which layer the original file lives in, either Background (outer) or Background (inner), and modify that image asset.
