> For the complete documentation index, see [llms.txt](https://docs.beefree.io/beefree-sdk/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.beefree.io/beefree-sdk/data-structures/simple-schema/image-schema.md).
# Image Schema
### Introduction
Schemas are structured definitions that describe the format, rules, and relationships of data within a system. They ensure consistency and validate inputs. In Beefree SDK, the Simple Image Schema defines how image blocks are configured and rendered within email, page, and popup builders. It manages image sources, alt text, click behavior, and styling such as padding. This documentation breaks down the schema's properties, requirements, and usage examples to help you implement and customize image blocks effectively.
{% hint style="success" %}
Reference the [Simple Schema GitHub repository](https://github.com/BeefreeSDK/beefree-sdk-simple-schema/tree/main) for more information.
{% endhint %}
### Schema Overview
This section summarizes the purpose and key characteristics of the Simple Image Schema.
* **Schema Name:** Simple Image
* **Purpose:** Defines image elements with support for alt text, links, dynamic sources, and styling.
* **Related Schemas:**
* `definitions.schema.json` (for padding definitions)
### Structure Definition
Below is the JSON Schema definition and a detailed breakdown of each property.
#### JSON Schema
```json
{
"$schema": "http://json-schema.org/draft-07/schema",
"$id": "simple_image.schema.json",
"title": "Simple Image",
"type": "object",
"additionalProperties": false,
"properties": {
"type": {
"const": "image"
},
"alt": {
"type": "string"
},
"href": {
"type": "string"
},
"src": {
"type": "string",
"format": "urlOrMergeTags"
},
"dynamicSrc": {
"type": "string"
},
"target": {
"enum": ["_blank", "_self", "_top"]
},
"padding-top": {
"$ref": "definitions.schema.json#/definitions/padding"
},
"padding-right": {
"$ref": "definitions.schema.json#/definitions/padding"
},
"padding-bottom": {
"$ref": "definitions.schema.json#/definitions/padding"
},
"padding-left": {
"$ref": "definitions.schema.json#/definitions/padding"
},
"locked": {
"type": "boolean"
},
"customFields": {
"type": "object"
}
}
}
```
### Field Descriptions
The following table lists the field descriptions along with their corresponding data type, whether or not they are mandatory, and their description.
| Property | Type | Mandatory | Description |
| ---------------- | ------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------- |
| `src` | string |  No | The source URL of the image |
| `alt` | string |  No | The alt text for the image |
| `href` | string |  No | The URL the image links to |
| `dynamicSrc` | string |  No | The dynamic source URL of the image |
| `target` | enum |  No | The target for the link |
| `padding-top` | integer |  No | The top padding (0-60) |
| `padding-right` | integer |  No | The right padding (0-60) |
| `padding-bottom` | integer |  No | The bottom padding (0-60) |
| `padding-left` | integer |  No | The left padding (0-60) |
| `customFields` | object |  No | Custom fields |
| `locked` | boolean |  No | Whether the module is locked.
Note: Not available for Single Content AddOn.
|
### Usage Examples
Reference an example of the schema in the following code snippet.
#### Example Image
```json
{
"src": "",
"alt": "Sample Image",
"href": "",
"dynamicSrc": "",
"target": "_blank",
"padding-top": 10,
"padding-right": 10,
"padding-bottom": 10,
"padding-left": 10,
"customFields": {
"custom1": "value1",
"custom2": "value2"
}
}
```
### Additional Considerations
Consider the following when working with the Simple Image Schema in Beefree SDK:
* **Accessibility:** Always provide meaningful `alt` text for screen readers and fallback scenarios.
* **Extensibility:** Use `customFields` for non-standard properties.
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://docs.beefree.io/beefree-sdk/data-structures/simple-schema/image-schema.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.