Get instant access to this builder accessibility guide.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Choose Your Builder
Menu

Make Click Targets Large - Elementor

Buttons and links should be large enough to tap easily.
Appearance
Developed by DAPEN.org

Make Click Targets Large in Elementor

  1. Open your WordPress dashboard, navigate to the page you want to adjust, and click Edit with Elementor.
  2. Select the first interactive element (Button, Icon, Image Link, Nav Menu item, Form submit button, or custom clickable widget). The Elementor panel will load its settings.
  3. For Buttons:
    • Select the button → open the Advanced tab.
    • Increase Padding (top/bottom/left/right) until the button’s clickable area is at least 44px × 44px.
    • Return to Style → confirm text size remains readable.
  4. For Icon Widgets acting as controls (e.g., arrows, close icons, menu triggers):
    • Select the icon widget → Style → Icon → increase the icon’s size.
    • Open Advanced → add padding around the icon to enlarge the clickable area.
    • Ensure the final size meets or exceeds 44px × 44px.
  5. For Image Links:
    • Select the image → Content → confirm a Link is set.
    • Resize the image via drag handles or adjust the column width to ensure the click target is comfortably large.
    • Add padding in the Advanced tab if the image is small but must be clickable.
  6. For Nav Menu items:
    • Select the Nav Menu widget.
    • Open the Style tab → adjust Padding for each link under the Typography or Dropdown sections.
    • Increase vertical spacing so each item reaches roughly 44px in height.
  7. For Form Submit Buttons:
    • Select the Form widget → click the submit button field in the left panel.
    • Open Advanced → increase padding to meet minimum target size.
  8. If using Columns or Inner Sections as click targets (via custom code):
    • Select the container → Advanced → add padding or adjust min-height.
    • Ensure custom links inside code blocks wrap the entire region, not just small text areas.
  9. Switch to Tablet and then Mobile mode using the responsive icons at the bottom of the Elementor panel.
  10. Repeat all sizing adjustments for smaller screens:
    • Ensure mobile menu items are tall enough,
    • Resize icons and add padding to mobile triggers (hamburger menu, close icons),
    • Confirm all tap targets meet the 44px guideline.
  11. Click Update to save your changes.
  12. Preview the page in a new tab and test with both mouse and keyboard to ensure each interactive element is easy to activate without precision.
Previous
Use Legible Text Sizes - Elementor
Use Legible Text Sizes - Elementor
Next
Run a Quick Automated Scan - Elementor
Run a Quick Automated Scan - Elementor