Cursor positioning effects offer interactive visual elements that engage visitors when hovering over images. Here's how to implement them across different site elements:

Image Blocks

• Enable caption overlay on hover through the Design tab
• Select "Caption Overlay on hover" from the Caption dropdown
• Add your caption text in the black overlay that appears
• Save and style using tweaks

Slideshow Gallery Block

• Only available in Slideshow design mode
• Add titles and descriptions per image
• Enable "Show title and description" in Design tab
• Select position and "Show on hover"
• Note: Effects may not display on mobile devices under 480px

Portfolio Pages Support Three Hover Styles:

• Scrolling Background: Project image becomes section background
• Scrolling Fixed: Project image appears in fixed position
• Scrolling Follow: Image follows cursor movement

Store Pages Functionality:

• Shows alternative product images on hover
• Advanced pages: Displays secondary image, details, or Quick View
• Classic pages: Shows product name and price with color overlay
• Template-specific options vary for Galapagos and Supply stores

Gallery Pages Features:

• Available in Slides and Grid layouts
• Shows titles and descriptions on hover
• Compatible with major templates (Adirondack, Aviator, Bedford, etc.)
• Customize through Site Styles > Gallery Styles
• Special effects vary by template family

Index Pages Template Effects:

• Avenue: Changes opacity and shows navigation title
• Flatiron: Enlarges image with panoramic view
• Montauk: Modifies opacity
• Tremont: Shows page's featured image as background
• York: Enables blur effect and mini titles

Mobile Considerations:

• Hover effects adapt for tablets and landscape orientation
• Touch-activated on mobile devices
• Visibility depends on screen size and device capabilities

Related Articles

Previous Articles