Customizing Typography and Icon Sizes #

Typography and icon sizing directly impact readability and visual hierarchy. Adjusting them thoughtfully improves the visitor experience – especially for accessibility and mobile users.

When to Adjust Font Sizes #

• Accessibility: Increase label and value sizes for older audiences or when WCAG compliance matters
• Mobile readability: If text feels cramped on phones, bump search result values and names up one size
• Brand alignment: Your theme may use larger or smaller base fonts – match the plugin to your design
• Emphasis: Make titles Extra Large to draw attention, keep labels Small to reduce visual noise

Font Size Strategy #

Icon Size Strategy #

• Search overlays: Default (40px) works well for most templates. Go Large if photos are large.
• Detail pet icons: Default (32px) is balanced. Increase for accessibility or if icons are a key browsing tool.
• Label icons: Usually fine at default. Only increase if they feel lost next to text.

Per-page override for special layouts:

[pmp-search type="adopt" icon="enable" icon_size="large"]

Admin vs Shortcode #

• Admin (Fonts tab + Display Options): Set site-wide defaults that apply everywhere
• Shortcode (title_size, icon_size, etc.): Override per page for specific layouts

Use admin settings for your baseline, shortcodes for exceptions.

Tips #

• Change one thing at a time and preview – cascading size changes can have unexpected effects
• Test on mobile and desktop – what looks right on a laptop may be too small on a phone
• The “Default” option always matches the template’s built-in size – start there and only change what needs it
• Typography and icon size controls require Junior license or higher

Next Steps #

• Font Size Customization — Full Fonts tab reference
• Icon Size Customization — Icon size admin and shortcode controls
• Color Customization — Complete color settings guide