> For the complete documentation index, see [llms.txt](https://docs.boldminded.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.boldminded.com/ansel/docs/usage/channel-form.md).

# Channel:Form

Ansel works in channel:form, however you will notice that it will appear largely unstyled. This is because it relies on many styles and icons normally found within ExpressionEngine's control panel, but are not easily available on the front-end.

<figure><img src="https://3476660910-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Ly1eNBG1JvS5rivVtg3%2Fuploads%2FoUKvaRwTBlF1OUkixTMD%2Fansel-cf-unstyled.png?alt=media&amp;token=038ca724-9996-47f2-8fcf-73d4be109ad9" alt=""><figcaption></figcaption></figure>

Including the following css file, per the channel:form docs, is not sufficient.

```html
<link href="{path='css/_ee_channel_form_css'}" type="text/css" rel="stylesheet" media="screen">
```

You can include the entire `common.min.css`file, which is what is used by ExpressionEngine in the control panel, but it may apply more styles than necessary. If you include this you will notice that the Ansel field displays its missing styles.

```html
<link href="/themes/ee/cp/css/common.min.css" type="text/css" rel="stylesheet" media="screen">
```

<figure><img src="https://3476660910-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Ly1eNBG1JvS5rivVtg3%2Fuploads%2FnqzKzSe90gSbaUPvwgf6%2Fansel-cf-styled.png?alt=media&amp;token=d808d8bd-39d9-4fed-8b25-9ee8a5d89906" alt=""><figcaption></figcaption></figure>

If you're using the legacy grid view in Ansel, you will not need to include the `common.min.css` file, it still renders most of it's styles.

<figure><img src="https://3476660910-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-Ly1eNBG1JvS5rivVtg3%2Fuploads%2Fb9cB40Gacl72aSoNf0Vo%2Fansel-cf-grid.png?alt=media&amp;token=c573b7a7-decd-489f-810d-b8b838ea64b7" alt=""><figcaption></figcaption></figure>

**Ultimately it is up to you how to render the Ansel field in a channel:form. A little extra work to add custom styles may be necessary if you do not want to include `common.min.css`.**

We do recommend hiding the meta edit button since the slide out modal normally find when inside of the ExpressionEngine control panel is not available in channel:form tags.

```css
.js-ansel-edit-meta { display: none; }
```
