🎯 Purpose
The Image Box widget allows you to display an image, a title, and a description together in a clean, structured layout. It’s ideal for presenting services, team members, features, benefits, or any content block that requires visual and textual elements combined.
⚙️ Main Features
Content Setup
You can upload or select an image, add a heading, write a short description, and include an optional clickable link. There’s also the ability to control whether the link opens in a new tab and whether it’s marked as nofollow.Image Positioning
Choose where the image appears in relation to the text—above, left, or right. This gives you layout flexibility depending on the surrounding content or design goals.Image Size Control
Choose from preset sizes (thumbnail, medium, full, etc.) or define a custom size to maintain image consistency across widgets.
🎨 Styling Options
Image Styling
Adjust the size, alignment, spacing, border radius, and apply hover animations such as grow, shrink, bounce, or fade. You can also apply CSS filters like blur, brightness, or grayscale for visual effects.Title and Description Styling
Customize typography (font family, size, weight, transform, spacing), color, alignment, and shadows. You can also control spacing between the title and description and apply different styles for normal and hover states.
📱 Responsive Control
Each part of the widget—image, title, and description—can be styled separately for desktop, tablet, and mobile views. This ensures your content looks great on any device.
🧰 Advanced Options
Add motion effects (like scroll animations), custom margins and padding, background overlays, or custom CSS.
Use custom positioning and z-index settings to layer the widget in creative ways within more complex layouts.
âś… Best Practices
Use consistent image sizes and alignment across similar widgets to maintain a cohesive design.
Optimize images for fast loading without sacrificing quality.
Match hover effects and typography with your brand or site theme.
Ensure titles use semantic HTML tags (like H2 or H3) for accessibility and SEO.
Always preview and test the widget on different devices.
The Image Box widget is a powerful and easy-to-use tool that helps you visually present content in a compact, stylish way—blending imagery with text to create engaging user experiences.
