Guides Adding Social Media Icons to the Headar Section / Headar Bölümüne Sosyal Medya Simgeleri Ekleme

[Scorpiol]

• Extra.less

/** Adding Social Media Icons to the Headar Section @ETERNALTEAM **/
.social-network {
    font-size: 0;
    line-height: 0;
    letter-spacing: -4px;
    padding: 10px 0;
    text-align: center;

    li {
        display: inline-block;
        vertical-align: text-top;
        font-size: 15px;
        line-height: 28px;
        letter-spacing: 0;
        padding: 0 4px;
        text-transform: uppercase;
        font-weight: 600;
        a {
            display: block;
            width: 30px;
            height: 30px;
            color: #FFF;
            background:#58819F;
            border-radius: 4px;
            &:after {
                content: " ";
                display: block;
                clear: both;
                box-sizing: inherit;
            transition: transform 0.4s linear 0s,
            border-top-left-radius 0.1s linear 0s,
            border-top-right-radius 0.1s linear 0.1s,
            border-bottom-right-radius 0.1s linear 0.2s,
            border-bottom-left-radius 0.1s linear 0.3s;
            }
        }
        a.youtube:hover   {
      background-color: #bb0000;
      transform: rotate(360deg);
      border-radius: 50%;
            }
        a.facebook:hover {
            background-color: #3b5998;
            transform: rotate(360deg);
            border-radius: 50%;
        }
        a.twitter:hover   {
      background-color: #00aced;
      transform: rotate(360deg);
      border-radius: 50%;
        }
        a.instagram:hover   {
      background-color: #bc2a8d;
      transform: rotate(360deg);
      border-radius: 50%;
        }
    }
    &:after {
        content: " ";
        display: block;
        clear: both;
        box-sizing: inherit;
    }
}
}
/** Adding Social Media Icons to the Headar Section @ETERNALTEAM **/

Reklam Yönetimine gidin ve yeni reklam ekleyin. Tüm sayfalarda reklam konumunu HEADAR olarak seçin ve aşağıdaki kodu ekleyin ve bağlantıları kendinize göre düzenleyin.

<ul class="social-network">
    <li><a class="youtube" href="https://www.youtube.com/channel/#" target="_blank"><i class="fab fa-youtube"></i></a></li>
    <li><a class="facebook" href="https://www.facebook.com/#" target="_blank"><i class="fab fa-facebook-f"></i></a></li>
    <li><a class="twitter" href="https://twitter.com/#" target="_blank"><i class="fab fa-twitter"></i></a></li>
     <li><a class="instagram" href="https://www.instagram.com/#" target="_blank"><i class="fab fa-instagram"></i></a></li>
</ul>