[TUT] - Cách Tạo Trang Báo Lỗi 404 Cho Xenforo Cực Đẹp Và Rất Hay

huydn117 · 4/9/13

SangNguyen2603 said: ↑

xf 1.1.5 làm gì có route_x_not_found mà search
Click to expand...

em có nói cái route_x_not_found đâu @SangNguyen2603
bác xem lại bài #18 nhé
http://vxf.vn/threads/tut-cach-tao-...-xenforo-cuc-dep-va-rat-hay.12572/#post-98309

ITCAnhDuy · 4/9/13

SangNguyen2603 said: ↑

xf 1.1.5 làm gì có route_x_not_found mà search
Click to expand...

Cỡ nào cũng làm được . Quan trọng bạn tìm dc cái pharse lúc trang báo lỗi hiện ra

SangNguyen2603 · 6/9/13

H.B.T_Binh said: ↑

Cho các bác cái dễ hơn , demo : http://vietek.tk/forums/dsadasdasd ( bất cứ trang gì không có là được rồi

)

Vào tìm Template error và hay toàn bộ bằng code này :

Mã:

<div class="container">
    <div class="row">
        <div class="content">
            <div class="wrap-decor">
                <span>4</span><img alt="no activity" src="styles/404.png"><span>4</span>
            </div>
                <h2>Không có gì ở đây cả!</h2>
                <p>
                Chúng tôi không thể tìm thấy trang mà bạn muốn đến. Bạn hãy thử:
                <br />
                <a href="/" class="call-to-action">Quay lại trang chủ</a> hoặc <a href="" class="call-to-action">Đi ra chỗ khác</a> nhé !
                </p>
        </div>
    </div>
</div>

tiếp tục với template error.css hay toàn bộ bằng code sau :

Mã:

.page-body .content{
    margin: auto;
    margin-top: 54px;
    min-height: 500px;
}


.container {
    padding-left: 20px;
    padding-right: 20px;
}

.row {
    width: 100%;
    max-width: 1140px;
    min-width: 755px;
    margin: 0 auto;
    overflow: hidden;
}

.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {
    margin-right: 3.8%;
    float: left;
    min-height: 1px;
}

.row .onecol {
    width: 4.85%;
}

.row .twocol {
    width: 13.45%;
}

.row .threecol {
    width: 22.05%;
}

.row .fourcol {
    width: 30.75%;
}

.row .fivecol {
    width: 39.45%;
}

.row .sixcol {
    width: 48%;
}

.row .sevencol {
    width: 56.75%;
}

.row .eightcol {
    width: 65.4%;
}

.row .ninecol {
    width: 74.05%;
}

.row .tencol {
    width: 82.7%;
}

.row .elevencol {
    width: 91.35%;
}

.row .twelvecol {
    width: 100%;
    float: left;
}

.last {
    margin-right: 0px;
}

img, object, embed {
    max-width: 100%;
}

img {
    height: auto;
}


.container .row{
    text-align: center;
}

.container .row .content{
    padding-top: 10%;
    color: #333;
}

.wrap-decor{
    margin: 5% 0 2% 0;
}
.wrap-decor img{
    position: relative;
    top: -12px;
    margin: 0 20px;

    animation-name: indicator;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;  
    animation-direction: normal;
    animation-delay: 0;
    animation-play-state: running;
    animation-fill-mode: forwards;

    -webkit-animation-name: indicator;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: 20;  
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
}
.wrap-decor span{
    font-size: 10em;
    line-height: 136px;
    color: #cecece;
    font-weight: bold;
}

.content h2{
    font-size: 3em;
    line-height: 2em;
}

.content p{
    line-height: 1.75em;
}
.content .call-to-action{
    display: inline-block;
    padding: 5px 15px;
    margin: 10px;
    color: #fff;
    background: #f15a24;
    border-radius: 40px;
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    font-size: 0.875em;
    font-weight: bold;
}

.content .call-to-action:hover{
    background-color: #8fbf00;
}

@keyframes indicator {

    0% {
    top: -6px;
}

25% {
    top: 0px;
}

50% {
    top: 12px;
}

75%{
    top: 0px;
}

100% {
    top: -6px;
}

}

@-webkit-keyframes indicator {

    0% {
    top: -6px;
}

25% {
    top: 0px;
}

50% {
    top: 12px;
}

75%{
    top: 0px;
}

100% {
    top: -6px;
}

}

/* Smaller screens */

@media only screen and (max-width: 1023px) {
    body {
        font-size: 0.8em;
        line-height: 1.5em;
    }

}


/* Mobile */

@media handheld, only screen and (max-width: 767px) {

    body {
        font-size: 16px;
        //-webkit-text-size-adjust: none;
        overflow: hidden;
    }

    .row, body, .container {
        width: 100%;
        min-width: 0;
        margin-left: 0px;
        margin-right: 0px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol {
        width: auto;
        float: none;
        margin-left: 0px;
        margin-right: 0px;
        padding-left: 20px;
        padding-right: 20px;
        overflow: hidden;
    }


    /*Content Responsive*/
    .content{
        margin-top: 0px;
    }
    .wrap-decor{
        margin: 0 0 10px 0;
    }
    .wrap-decor img{

    }
    .wrap-decor span{

    }

    .content h2{

    }

    .content p{

    }
    .content .call-to-action{

    }

    .content .call-to-action:hover{

    }

}


@media handheld, only screen and (max-width: 481px) {
    body{
        font-size: 14px;
    }

    .row{
        padding: 0 20px;
        width: auto;
    }

    .container .row .content{
        padding-top: 8%;  
    }
    .wrap-decor{

    }
    .wrap-decor img{
        width: 90px;
        margin: 0 10px;
    }
    .wrap-decor span{
        font-size: 6em;
        line-height: 90px;
    }

    .content h2{
        font-size: 1.5em;
        line-height: 2.5em;
    }
}

Tải file 404.zip được file 404.png up lên thư mục styles/
Hiện thị tốt trên điện thoại

Các bạn tự chỉnh sửa lại cho phù hợp với style của bạn

Click to expand...

Mới phát hiện ra lỗi đối với cách làm này, đó là đối với bất kỳ lỗi gì thì cái popup hiện lên thông báo đều là cái trang 404 này.
Cách này không sử dụng được rồi bác ạ.

H.B.T_Binh · 7/9/13

SangNguyen2603 said: ↑

Mới phát hiện ra lỗi đối với cách làm này, đó là đối với bất kỳ lỗi gì thì cái popup hiện lên thông báo đều là cái trang 404 này.
Cách này không sử dụng được rồi bác ạ.
Click to expand...

Bác tự vọc tiếp đi

bannvph00701 · 17/11/16

bạn nào chưa làm được thì pm mình giúp nhé

h_onme · 27/4/17

thật tuyệt, cảm ơn chủ top vì bí kíp này

lethao1907 · 28/4/17

thanks bác nhé, nhưng e vẫn chưa làm đc huhuuuu

[TUT] - Cách Tạo Trang Báo Lỗi 404 Cho Xenforo Cực Đẹp Và Rất Hay

huydn117 New Member

ITCAnhDuy Member

SangNguyen2603 Member

H.B.T_Binh Member

bannvph00701 New Member

h_onme New Member

lethao1907 New Member

Chia sẻ trang này

Text Links

Textlink

Thông báo mới nhất