Html 如何自定义tumblr 404找不到URL页面

Tumblr似乎没有提供div标记来定制“未找到url”页面的外观。

---

有没有其他方法可以定制404（找不到URL）页面？

遗憾的是，目前还没有官方的方法

但是，如果您使用javascript/jQuery，您可以嗅探以下文本：

找不到您请求的URL

jQuery代码示例：

$(document).ready(function() {
    $("p:contains(The URL you requested could not be found.)").html('YOUR TEXT HERE');
});

我更倾向于向parent/body元素添加一个类，这样您就可以对整个页面进行不同的样式设置

希望能有所帮助。

这对我有用

<script type="text/javascript">
/* Works for me */
    var text_posts = document.getElementsByClassName("regular");
    var text_404 = "The URL you requested could not be found.";
    var title_404 = "Not Found";
    if(text_posts.length == 1){
        var bodyNode = text_posts[0].lastChild;
        if(bodyNode.previousSibling.textContent == text_404) {
            // titleNode.innerHTML = "<a href='/'>Not Found</a>";
            var blog_loc = "http://" + document.domain + "/";
            var query = window.location.href.slice(blog_loc.length);
            var tokens = query.toLowerCase().split('/');
            var keyword = tokens.join(" ");
            var bodyContent = "Looks like you came from an old bookmark, or just looking for a page that doesn't exist. Were you looking for <span class='tg'><a href='/search/"+ escape(keyword) +"'>"+keyword+"</a></span>";
            bodyNode.previousSibling.innerHTML = bodyContent;
        }
    }
</script>

/*为我工作*/
var text_posts=document.getElementsByClassName（“常规”）；
var text_404=“找不到您请求的URL。”；
var title_404=“未找到”；
if（text_posts.length==1）{
var bodyNode=text_posts[0]。lastChild；
if（bodyNode.previousSibling.textContent==text_404）{
//titleNode.innerHTML=“”；
var blog_loc=“http://“+document.domain+”/”；
var query=window.location.href.slice（blog_loc.length）；
var tokens=query.toLowerCase（）.split（'/'）；
var关键字=tokens.join（“”）；
var bodyContent=“看起来您来自一个旧书签，或者只是在寻找一个不存在的页面。您是否在寻找”；
bodyNode.previousSibling.innerHTML=bodyContent；
}
}

Edit：此方法仅适用于没有页面的Tumblog。 询问、提交，以及在“自定义”部分创建的其他页面将被检测为“未找到”此代码

---

描述 Tumblr对静态页面使用正常的

{block:Posts}

循环，但不指定任何变量，如

{PostID}

。如果我们使用类似于

post{PostID}

的类，那么在404页的所有静态页面上，我们将看到一个

.post

元素，而在posts上，元素类似于

.post125678

例子 使用CSS：

.post {
    /*this is a 404 page, customize it*/
}

很酷的无javascript示例 编辑：可能的修复 为了修复这个方法，我们应该找到一个{tag}，它只显示在页面上，而不显示在404页面上

{ShortURL}

，如果没有bug，可以使用，因为理论上404页不应该有一个ShortURL

---

我也尝试了

{Permalink}

，但在这种情况下，它的行为类似于

{PostID}

。

我也在研究这个问题，并找到了答案。 如果你要转到404错误页面，那帖子是没有任何帖子的，

---

因此，您可以只检查{PostID}是否为空，以检查它是否为404页。

这个问题可能更适合于这个问题，因为消息的更改取决于访问者语言解决方案，但是您的答案是误导性的。Tumblr未提供与404/未找到相关的语言字符串：。用户仍然需要输入每种语言的消息。同样值得一提的是，解决方案是IE9+。我从来没有说过你不必提供本地化的404消息，我只是说无论Tumblr以何种语言显示消息，都会检测到404页面。通过查找英文文本“not found”来检测404页面只适用于一种语言（或者要求您知道并维护多种语言的错误消息列表），我阅读了每种语言的作品，然后看到了只使用英文的示例的无javascript示例，所以我的错误很严重。又是一个不错的解决方案，值得投票。我想我应该更清楚，我编辑了答案。

/ask

和

/submit

页面也没有

{PostID}

，所以这个解决方案有点短，因为我喜欢纯CSS。虽然很容易将一个类添加到ask post中，但可以使用

避免它。post:not（）：not（）+。请填写我：before

选择器

var is404 = document.getElementsByClass('post').length;

.post {
    /*this is a 404 page, customize it*/
}

{block:Posts}
  <div class="post{PostID}">
    {block:Photo}all your blocks here{/block:Photo}
  </div>
{/block:Posts}
<div class="fill-me"></div>

.post { /*Hide Tumblr's 404 message*/
    display: none;
}
.post + .fill-me:before { /*use your message and style*/
    content: 'This page was not found!';
    font-size: 2em;
}