# Listing Buttons Block

A container block that groups multiple website and booking buttons for a listing. This block only allows Listing Website Button blocks as children, providing a structured way to display multiple action buttons together.

## Overview

The Listing Buttons block is designed for template pages where you want to display multiple action buttons for a listing (such as website, booking, or other external links). It acts as a container that automatically creates and manages Listing Website Button blocks, ensuring consistent styling and layout for all buttons.

## Block Features & Options

### Layout Options
- **Alignment** - Controls block alignment (wide, full)
- **Custom CSS Class** - Adds custom CSS classes for styling
- **Typography Controls** - Font size, family, weight, and style options
- **Spacing Controls** - Margin and block gap settings

### Button Management
- **Automatic Button Creation** - Automatically creates a default Listing Website Button when the block is added
- **Button Styling Inheritance** - Child buttons inherit typography and spacing settings from the container
- **Flexible Layout** - Buttons are arranged in a flexible layout with customizable spacing

## How it Works

The Listing Buttons block is a specialized container that only accepts Listing Website Button blocks as children. When you add this block, it automatically creates a default button. You can then add additional buttons or modify the existing ones. The container provides consistent styling and spacing for all child buttons.

## How to Add & Configure

1. **Add the block** to a template page with Page Type set to "Listing"
2. **Configure the default button** that's automatically created
3. **Add additional buttons** by clicking the "+" button or using the block inserter
4. **Set alignment** if needed (wide or full width)
5. **Adjust typography and spacing** in the block sidebar
6. **Add custom CSS classes** if you need specific styling

## Shortcode Usage

### Basic Shortcode
```
[tourismo-listing-buttons]
```

### Available Options

| Option | Type | Default | Description |
|--------|------|---------|-------------|
| `custom_template_name` | string | `""` | Custom template name for advanced customization |
| `class_name` | string | `""` | Custom CSS classes |

### Examples

**Basic button container:**
```
[listing-buttons]
```

**With custom styling:**
```
[listing-buttons class_name="my-custom-buttons"]
```

**With custom template:**
```
[listing-buttons custom_template_name="custom-buttons-layout"]
```

## Content Displayed

The Listing Buttons block displays:

- **Container wrapper** with WordPress buttons styling
- **Child buttons** (Listing Website Button blocks) arranged in a flexible layout
- **Consistent spacing** between buttons using block gap controls
- **Responsive layout** that adapts to different screen sizes

Each child button can be configured independently with:
- Button type (website or booking website)
- Button text
- Width settings (25%, 50%, 75%, 100%)
- Color and typography styling
- Border and spacing options

## Related Blocks

- **Listing Website Button Block** - Individual button blocks used within this container
- **Listing Info Block** - For displaying comprehensive listing information including buttons
- **Title Block** - For displaying the listing name
- **Description Block** - For displaying the listing description