> For the complete documentation index, see [llms.txt](https://docs.newbot.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.newbot.io/conversescript-syntax/the-decorators/use-format.md).

# Use @Format

## Use formats

### Quick response

Show quick answers like this:

```typescript
@Event('start')
start() {
    @Format('quickReplies', ['yes', 'no'])
    > Continue ?
    Prompt()
    > Ok !
}
```

### Carousel

Here's how to display a carousel:

```typescript
@Event('start')
start() {
    @Format('carousel', [
        {
            title: 'TITLE',
            subtitle: 'SUBTITLE',
            image: 'URL_IMAGE',
            buttons: [
                {
                    url: 'URL',
                    title: 'TITLE BUTTON'
                }
            ]
        }
    ])
    > Continue ?
}
```

### Display an image

```typescript
@Event('start')
start() {
    @Format('image', 'http://url.com/image.png')
    > Nice picture !
}
```

### Send text with buttons

```typescript
@Event('start')
start() {
    @Format('buttons', [
        {
            title: 'An url',
            url: 'https://google.fr'
        },
        {
            type: 'postback',
            title: 'Postback'
        }
    ])
    > Buttons
}
```

### Webview

1. Create an `webviews` folder at the root of the project
2. Put an HTML file (eg `webviews/map.html`)

```typescript
@Event('start')
start() {
    @Format('webview', {
        url: '/webview/map.html', // required
        button: 'View map', // for other platforms,
        fbHeight: 'full', // compact, tall or full (only for Messenger)
        height: 600 // in pixels, only for chatbox
    })
    > Ok, here is the webview
}
```

#### Share button

On Facebook Messenger, NewBot ChatBox and Twitter, we can share content with the following code

```typescript
@Event('start')
start() {
    @Format('buttons', [
        {
           type: 'share'
        }
    ])
    > Buttons
}
```

**On Twitter**

On Twitter, let's add the `tweet` property:

```typescript
@Event('start')
start() {
    @Format('buttons', [
        {
           type: 'share',
           tweet: {
               text: 'Partagez-moi',
               url: 'https://newbot.io'
               via: '@me',
               hashtags: ['one', 'two']
           }
       }
    ])
    > Share
}
```

* `tweet.text` (required): Text in the tweet
* `tweet.url` (optional): Url to share
* `tweet.via` (optional): User Profile to Share
* `tweet.hashtags` (optional): Embed Hashtags

### Show a video

```typescript
@Event('start')
start() {
    @Format('video', 'http://url.com/video.mp4')
    > Nice video !
}
```

### Send a contact

```typescript
@Event('start')
start() {
    @Format('contact', '0123456789', 'Sam R')
    > Here is my friend !
}
```