XenForo Floating banner area on the right and left

AynaZ

Supervisor
  • Thread starter
  • Admin
  • #1


There are friends who cannot be asked, even if they are simple, so I hope that it will be useful for you to include the mobile systems with more detailed css code.

Setup; Break and find the template named PAGE_CONTAINER in your theme <div class = "p-body">
Add on it immediately::::
HTML:
 <!--[XGT]- Sabit banner alanı-->
    <div class="xgtSolSabitBanner">
        <a href="url">
            <img src="https://img.webme.com/pic/i/isacotur/160x600banner_rozet.jpg" alt="Banner alanı" width="" height="">
        </a>
    </div>

    <div class="xgtSagSabitBanner">
        <a href="url">
            <img src="https://img.webme.com/pic/i/isacotur/160x600banner_rozet.jpg" alt="Banner alanı" width="" height="">
        </a>
    </div>
    <!--[XGT]- Sabit banner alanı-->
Open the template named extra.less in the same theme and add it to the top;
CSS:
xgtSolSabitBanner
{
    position: fixed;
    z-index: 999;
    left: 0;
    top: 150px;//-- Banner ust boslugu opsiyonel olarak kullanılabilir.
    margin-left: 20px; //-- Banner sag yan boslugu opsiyonel olarak kullanılabilir.        
}

.xgtSagSabitBanner
{
    position: fixed;
    z-index: 999;
    right: 0;
    top: 150px; //--Banner ust boslugu opsiyonel olarak kullanılabilir.
    margin-right: 20px; //-- Banner sag yan boslugu opsiyonel olarak kullanılabilir.
}

//-- 1500PX Altı ekranlarda banner max genişliği 100PX olsun!

@media (max-width: 1500px)
{
    .xgtSolSabitBanner
    {
        max-width: 100px;
        margin-left: 0px;
    }
    .xgtSagSabitBanner
    {
        max-width: 100px;
        margin-right: 0px;
    }
}

//-- 1300PX Altı ekranlarda banner gizle!
@media (max-width: 1300px)
{
    .xgtSolSabitBanner, .xgtSagSabitBanner
    {
        display: none;
    }
}
 
  • Tags
    floating banner area on the right and left آموزش ایجاد بنر در زنفورو آموزش بنر تبلیغاتی در زنفورو آموزش های زنفورو انجمن پشتیبانی زنفورو
  • Back
    Top Bottom