Reclama Sidebar

[FlorinFx]

Salutare ma poate ajuta cineva sa pun o reclama in sidebar ipb 3.4.7

Spoiler

  

Vreau sa fac ca in imaginile de mai sus.

[Sebastian C.]

Ia legătura cu @Shady, el este autorul acelei animații.

[+Ezel.LCS]

Spoiler

<div class='_sbcollapsable'>
<a href="http://www.tni.ro" target="_blank">
<div class="host"><div class="host-logo"></div></div></a>
<style>

.host {
position: relative;
background:url('http://images.akamai.steamusercontent.com/ugc/545255509464502421/10525794F3E65B31C65287246636CC4756EFCCF0/') no-repeat;
width: 250px;
height: 220px;
overflow:hidden;
cursor: pointer;
}

.host-logo{
position:absolute;
background-color: #bcbcbc;
pointer-events: none;
box-shadow: 0px 0px 9.36px 2.64px rgba(0, 0, 0, 0.64);
width: 200px;
height: 100px;
overflow: hidden;
border-radius: 0px;
background-image: url('https://www.tni.ro/css/images/logo.png');
background-repeat: no-repeat;
top: 43px;
left: calc(30% - 50.5px);
transform: perspective(100px);
transition: all 0.4s ease-in-out;
}

.host-logo:after{
content:"Acceseaza";
position: absolute;
width: 100%;
height: 100%;
line-height: 100px;
text-align: center;
font-weight: bold;
text-transform: uppercase;
opacity: 0;
color: #121212;
background-color: #bcbcbc;
transform: rotateY(180deg);
transition: all 0.3s ease-in-out;
}
.host:hover .host-logo{
transform: rotateY(180deg);
}
.host:hover .host-logo:after{
opacity: 1;
}
</style>
    </div>
</div>

Aici e codul.

Il bagi in sidebar.

Doar ca nu e aceeasi imagine ca la tine, e aia a lor de pe site.

[FlorinFx]

11 hours ago, Ezel.LCS said:

  Reveal hidden contents

<div class='_sbcollapsable'>
<a href="http://www.tni.ro" target="_blank">
<div class="host"><div class="host-logo"></div></div></a>
<style>

.host {
position: relative;
background:url('http://images.akamai.steamusercontent.com/ugc/545255509464502421/10525794F3E65B31C65287246636CC4756EFCCF0/') no-repeat;
width: 250px;
height: 220px;
overflow:hidden;
cursor: pointer;
}

.host-logo{
position:absolute;
background-color: #bcbcbc;
pointer-events: none;
box-shadow: 0px 0px 9.36px 2.64px rgba(0, 0, 0, 0.64);
width: 200px;
height: 100px;
overflow: hidden;
border-radius: 0px;
background-image: url('https://www.tni.ro/css/images/logo.png');
background-repeat: no-repeat;
top: 43px;
left: calc(30% - 50.5px);
transform: perspective(100px);
transition: all 0.4s ease-in-out;
}

.host-logo:after{
content:"Acceseaza";
position: absolute;
width: 100%;
height: 100%;
line-height: 100px;
text-align: center;
font-weight: bold;
text-transform: uppercase;
opacity: 0;
color: #121212;
background-color: #bcbcbc;
transform: rotateY(180deg);
transition: all 0.3s ease-in-out;
}
.host:hover .host-logo{
transform: rotateY(180deg);
}
.host:hover .host-logo:after{
opacity: 1;
}
</style>
    </div>
</div>

Aici e codul.

Il bagi in sidebar.

Doar ca nu e aceeasi imagine ca la tine, e aia a lor de pe site.

Sin unde ar trebui sa bag asta in BoardIndexTemplate sau unde ? Mai exact unde ?

[+Ezel.LCS]

In sidebar. 

[DeNyS.]

globalTemplate

[+Ezel.LCS]

Daca ai instalat hook-ul custom sidebar blocks , se baga acolo.