# 能否将搜索表单放在我们404页面的顶部？

**URL:** <https://meta.discourse.org/t/can-i-put-the-search-form-at-the-top-of-our-404-page/210406>\
**Category:** Support\
**Created:** [2021年十一月29日 14:30 UTC](https://meta.discourse.org/t/can-i-put-the-search-form-at-the-top-of-our-404-page/210406 "2021-11-29T14:30:45Z")\
**Posts on this page:** 1\
**Showing post:** 6

<div class="post-metadata">

**Author:** ![cocococosti](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/cocococosti/32/231474_2.png) [@cocococosti](https://meta.discourse.org/u/cocococosti)\
**Post date:** [2021年十二月2日 01:19 UTC](https://meta.discourse.org/t/can-i-put-the-search-form-at-the-top-of-our-404-page/210406/6 "2021-12-02T01:19:11Z")

</div>

似乎 404 页面没有插件插槽，并且根据 [https://meta.discourse.org/t/how-to-add-custom-js-code-to-the-404-pages/165214，您必须使用纯](https://meta.discourse.org/t/how-to-add-custom-js-code-to-the-404-pages/165214%EF%BC%8C%E6%82%A8%E5%BF%85%E9%A1%BB%E4%BD%BF%E7%94%A8%E7%BA%AF) JS。

尝试在主题组件的 `Body` 选项卡中添加类似以下内容：

```plaintext
<script type="text/javascript">
    var x = document.getElementsByClassName("page-not-found");
    var search = '<div class="page-not-found-search-top"><h2>Search this site</h2><p></p><form action="/search" id="discourse-search"><input type="text" name="q" value=""><button class="btn btn-primary">Search</button></form><p></p></div>'
    x.item(0).innerHTML += search
</script>

```

您可能需要对 CSS 进行一些调整，尝试：

```plaintext
.page-not-found-search {
    display: none;
}

.page-not-found-search-top button {
    margin-left: 10px;
}

.page-not-found-search-top input {
    width: 600px;
}

```

希望这有帮助！

---

_[View the full topic](https://meta.discourse.org/t/can-i-put-the-search-form-at-the-top-of-our-404-page/210406)._