Las Vegas Nevada Home Sales – Image Gallery Demo
Beautiful image galleries for Las Vegas Nevada Home Sales with RealScout widget integration
Grid Gallery
Clean grid layout with hover effects and lightbox functionality
Stunning exterior with modern design
Gourmet kitchen with premium finishes
Bright and airy living space
Luxurious master bedroom
Private backyard with pool
Two-car garage with ample parking
Carousel Gallery
Auto-playing carousel with navigation controls and indicators
Stunning exterior with modern design
Gourmet kitchen with premium finishes
Bright and airy living space
Luxurious master bedroom
Private backyard with pool
Two-car garage with ample parking
Masonry Gallery
Pinterest-style masonry layout with varying image heights
Stunning exterior with modern design
Gourmet kitchen with premium finishes
Bright and airy living space
Luxurious master bedroom
Private backyard with pool
Two-car garage with ample parking
Contemporary design with clean lines
Formal dining area with chandelier
Dedicated workspace with natural light
Spacious master closet
Luxury bathroom with premium fixtures
Comfortable family gathering space
RealScout Widget Gallery
Direct integration with RealScout widget data
Gallery Features
Lightbox View
Click any image to open in full-screen lightbox with navigation
Auto-Play
Configurable auto-play carousel with pause/resume controls
Mobile Responsive
Optimized for all devices with touch-friendly controls
Hover Effects
Beautiful hover animations and caption reveals
Accessibility
Keyboard navigation and screen reader support
RealScout Ready
Seamless integration with RealScout widget data
How to Add Your Own Photos
Method 1: Upload to Public Folder
1. Upload your images to public/images/properties/
2. Reference them in your code:
const images = [
{
src: "/images/properties/your-image.jpg",
alt: "Your property description",
caption: "Your caption"
}
]Method 2: Use External URLs
1. Host images on a CDN or external service
2. Use the full URL in your code:
const images = [
{
src: "https://your-cdn.com/images/property.jpg",
alt: "Your property description",
caption: "Your caption"
}
]Method 3: RealScout Integration
1. Use your RealScout widget ID
2. Images will load automatically:
<RealScoutWidgetGallery
widgetId="your-real-scout-widget-id"
galleryType="grid"
columns={3}
/>Image Requirements
• Format: JPG, PNG, WebP
• Size: 800x600px minimum
• File size: Under 500KB
• Naming: Use descriptive names
• Alt text: Always include for accessibility
Usage Examples
Basic Grid Gallery
<RealScoutImageGallery
images={propertyImages}
galleryType="grid"
columns={3}
showCaptions={true}
/>Auto-Play Carousel
<RealScoutImageGallery
images={propertyImages}
galleryType="carousel"
autoPlay={true}
interval={4000}
/>Masonry Layout
<RealScoutImageGallery
images={propertyImages}
galleryType="masonry"
columns={4}
gap={4}
/>RealScout Widget
<RealScoutWidgetGallery
widgetId="your-widget-id"
galleryType="grid"
columns={3}
/>