Question Solution XenForo XenForo Adding a Hosting Provider Information Message to the Footer

[nerf]

Hello,

How can I add the Hosting Provider information message that appears in the footer of your site to mine as well?

 

[CL4Y]

Hi,

In the PAGE_CONTAINER template, find the line that contains:

<div class="p-footer-inner">

Then, add the following code right below it:

<div class="jetto-info">
    <div class="container inner">
        <div class="left">
            <div>
                <span><i class="ri-error-warning-line"></i></span>
                <span>
                    <strong>Jetto.net</strong> is a hosting provider registered with the Information and Communication Technologies Authority (BTK) in accordance with Law No. 5651.<br><br>
                    As per our legal status, we are not obligated to monitor or control the content hosted on our platform.<br>
                    If you believe any content violates applicable laws or regulations, please report it using our <strong><a href="https://www.jetto.net/misc/contact" rel="dofollow" title="Contact">Contact Form</a></strong>.
                </span>
            </div>
        </div>
        <div class="right">
            <a href="https://www.hayalhost.com/?utm_source=jetto.net" target="_blank" title="HayalHost">
                <img class="lazy" src="https://www.hayalhost.com/templates/hayalhost/assets/images/brand/logo-renk.png" alt="HayalHost" width="300" height="36" style="">
            </a>
            <span>
                <b>Jetto.net</b> is powered by the infrastructure of
                <b><a href="https://www.hayalhost.com/?utm_source=jetto.net" title="HayalHost" target="_blank">HayalHost</a></b>.
            </span>
        </div>
    </div>
</div>

Then, add the following code to your extra.less template:

.jetto-info {
    /*color: @xf-textColor;*/
    padding: 15px 15px;
    font-size: 14px;
    line-height: 1.6;

    .inner {
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 40px;
    }

    .left {
        flex: 2;
        
        > div {
            display: flex;
            align-items: flex-start;
            gap: 15px;
        }

        .ri-error-warning-line {
            font-size: 24px;
            margin-top: 3px;
            color: @xf-textColor;
        }
    }

    .right {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        text-align: right;
        /*gap: 10px;*/
        
        img {
            max-width: 200px;
            height: auto;
            opacity: 0.8;
        }
    }

    a {
        /*color: @xf-textColor;*/
        text-decoration: none;
        
        &:hover {
            text-decoration: underline;
        }
    }
    
    strong, b {
        /*color: @xf-textColor;*/
        font-weight: 600;
    }
}

@media (max-width: 1550px) {
    .jetto-info .inner {
        flex-direction: column;
        align-items: center;
    }

    .jetto-info .right {
        order: 1;
        align-items: center;
        text-align: center;
        margin-top: 0;
    }

    .jetto-info .left {
        order: 2;
        width: 100%;
        text-align: center;
        
        border-top: 1px solid #4a4d61;
        /*margin-top: 30px;*/
        padding-top: 20px;
    }

    .jetto-info .left .ri-error-warning-line {
        display: none;
    }

    .jetto-info .left > div {
        justify-content: center;
    }
}