Footer Widget

Site şablonu içerisinde sabit olarak gelen, seo, sosyal medya gibi amaçlarla kullanılan alandır.

Yukarıdaki footerı elde etmek için ilk başta aşağıdaki kodu kaynağa ekleyerek ilgili alanı oluşturmak gerekir.

<div class="container-fluid footer pt15 pb15">
<div class="row">
<div class="container">
<div class="row">
<!--Buraya widgetlar gelecek-->
</div>
</div>
</div>
</div>

Footer alanının her bir bölümüne widget adı verilir.

Widgetları dilediğiniz sırada dizebilirsiniz. Footer için oluşturulan alanın içindeki yorum alananı kodu eklediğiniz sıraya göre soldan sağa olacak şekilde yerleşeceklerdir. Akıllı telefonlarda görüntülenmesi istemdiğiniz widgetların en üst div sınıfna hidden-xs yazarak gizleyebilrsiniz.

Widget 1: Kurumsal

Site logosu ve çalışma saatlerini içerir. Translate kısmındaki CalismaSaatleri nesnesininde gelmektedir.

<div class="col-sm-6 col-md-3 fblock">
<img src="/Content/Tema/@(Partial.Ayar("Tema"))/images/logo-invert.png" class="img-responsive" />
<div class="calismasaatleri mt15">
<div class="col-xs-2 text-center">
<i class="fa fa-clock-o"></i>
</div>
<div class="col-xs-10">
@Partial.Translate("CalismaSaatleri", dilk)
</div>
</div>
</div>

Widget 2: İletişim

Site iletişim bilgilerini içerir. Sitenin global değişkenlerinden olan Adres1, Telefon1 ve Mail1 translate alanlarından bu kısımdaki bilgiler değiştirilebilir.

<div class="col-sm-6 col-md-3 fblock">
<h3> @Partial.Translate("iletisim", dilk) </h3>
@if (!String.IsNullOrEmpty(Partial.Translate("Adres1", dilk).ToString()))
{
<div class="row bs-nopadding">
<div class="col-xs-2 text-center">
<i class="fa fa-map-marker"></i>
</div>
<div class="col-xs-10">
<p>
@Partial.Translate("Adres1", dilk)
</p>
</div>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("Telefon1", dilk).ToString()))
{
<div class="row bs-nopadding">
<div class="col-xs-2 text-center">
<i class="fa fa-phone"></i>
</div>
<div class="col-xs-10">
<p>
@Partial.Translate("Telefon1", dilk)
</p>
</div>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("Telefon2", dilk).ToString()))
{
<div class="row bs-nopadding">
<div class="col-xs-2 text-center">
<i class="fa fa-phone"></i>
</div>
<div class="col-xs-10">
<p>
@Partial.Translate("Telefon2", dilk)
</p>
</div>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("Fax1", dilk).ToString()))
{
<div class="row bs-nopadding">
<div class="col-xs-2 text-center">
<i class="fa fa-fax" aria-hidden="true"></i>
</div>
<div class="col-xs-10">
<p>
@Partial.Translate("Fax1", dilk)
</p>
</div>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("Mail1", dilk).ToString()))
{
<div class="row bs-nopadding">
<div class="col-xs-2 text-center">
<i class="fa fa-envelope"></i>
</div>
<div class="col-xs-10">
<p>
@Partial.Translate("Mail1", dilk)
</p>
</div>
</div>
}
</div>

Widget 3: Footer Navigasyon

Site ana navigasyonunun replikasını çalıştırır. Herhangi bir ekstra işlem gerektirmez.

<div class="col-sm-6 col-md-3 fblock hidden-xs hidden-sm">
<h3>@Partial.Translate("SiteMenusu", dilk)</h3>
<div class="col-xs-12">
<p><a href="/@dilk"><i class="fa fa-check"></i> @Partial.Translate("Anasayfa", dilk) </a></p>
@foreach (Sayfa sayfam in Partial.Sayfalar(dilk))
{
if (sayfam.SayfaSirasi < 90)
{
<p><a href="@Partial.SayfaLink(sayfam.SayfaID)"><i class="fa fa-check"></i> @sayfam.SayfaBaslik.HtmlEncode()</a></p>
}
}
@foreach (MakaleKategori kategorim in Partial.KategorilerAna(dilk))
{
<p><a href="@Partial.KategoriLink(kategorim.MakaleKategoriID)"><i class="fa fa-check"></i> @kategorim.MakaleKategoriAdi.HtmlEncode()</a></p>
}
@foreach (Sayfa sayfam in Partial.Sayfalar(dilk))
{
if (sayfam.SayfaSirasi > 90)
{
<p><a href="@Partial.SayfaLink(sayfam.SayfaID)"><i class="fa fa-check"></i> @sayfam.SayfaBaslik.HtmlEncode()</a></p>
}
}
</div>
</div>

Widget 4: Sosyal Medya

Bu alanda kullanıcının sosyal medya hesaplarının bağlantıları gelmektedir. Translate alanında mevcut olmayan sosyal medya hesapları getirilmez.

<div class="col-sm-6 col-md-3 fblock hidden-xs hidden-sm">
<h3> @Partial.Translate("SosyalMedya", dilk) </h3>
@if (!String.IsNullOrEmpty(Partial.Translate("LinkFacebook", dilk).ToString()))
{
<div class="col-xs-3">
<a target="_blank" href="@Partial.Translate("LinkFacebook", dilk)"><i class="fa fa-facebook-square smicon"></i></a>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("LinkTwitter", dilk).ToString()))
{
<div class="col-xs-3">
<a target="_blank" href="@Partial.Translate("LinkTwitter", dilk)"><i class="fa fa-twitter-square smicon"></i></a>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("LinkGooglePlus", dilk).ToString()))
{
<div class="col-xs-3">
<a target="_blank" href="@Partial.Translate("LinkGooglePlus", dilk)"><i class="fa fa-google-plus-square smicon"></i></a>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("LinkInstagram", dilk).ToString()))
{
<div class="col-xs-3">
<a target="_blank" href="@Partial.Translate("LinkInstagram", dilk)"><i class="fa fa-instagram smicon"></i></a>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("LinkFoursquare", dilk).ToString()))
{
<div class="col-xs-3">
<a target="_blank" href="@Partial.Translate("LinkFoursquare", dilk)"><i class="fa fa-foursquare smicon"></i></a>
</div>
}
@if (!String.IsNullOrEmpty(Partial.Translate("LinkYoutube", dilk).ToString()))
{
<div class="col-xs-3">
<a target="_blank" href="@Partial.Translate("LinkYoutube", dilk)"><i class="fa fa-fa-youtube-square smicon"></i></a>
</div>
}
</div>

Widget 5: Facebook Sayfa API

Translate alanında LinkFacebook şeklinde girdiğiniz sayfanın kapak fotoğrafı ve beğenilerini getiren bir APIdir.

<div class="col-sm-6 col-md-3 fblock">
@if (!String.IsNullOrEmpty(Partial.Translate("LinkFacebook", dilk).ToString()))
{
<div class="fb-page" data-href="@(Partial.Translate("LinkFacebook", dilk))" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="@(Partial.Translate("LinkFacebook", dilk))"><a href="@(Partial.Translate("LinkFacebook", dilk))">@(Partial.Ayar("SiteAdi"))</a></blockquote></div></div>
}
</div>

Widget 6: Son 5 Makale

Sitede girilen son 5 makaleyi getirir. Makaleler IDye göre büyükten küçüğe sıralanır.

<div class="col-sm-6 col-md-3 fblock">
<h3>@Partial.Translate("GuncelYazi", dilk)</h3>
<div class="col-xs-12">
@foreach (Makale sonmak in Partial.tumMakaleler.OrderByDescending(m => m.MakaleID)) {
<p><a href="@Partial.MakaleLink(sonmak.MakaleID)"><i class="fa fa-check"></i> @sonmak.MakaleBaslik.HtmlEncode()</a></p>
}
</div>
</div>

Widget 7: Footer Tanıtım Yazısı

Site footer kısmına kısa bir tanırım yazısı getirmenizi sağlar. Bu alanı kullanabilmek için Translate kısmından FooterTanitim nesenesine değer girmeniz gerekmektedir.

<div class="col-sm-6 col-md-3 fblock">
<h3>@Partial.Translate("Kurumsal", dilk)</h3>
@Partial.Translate("FooterTanitim", dilk)
</div>

Widget 8: Logo ve Sosyal Medya Linkleri

Site footer kısmına Logo ve altına sosyal medya linklerini eklememizi sağlar. Bu alanı kullanabilmek için Translate kısmından Sosyal Medya Linkleri nesnesine değer girmeniz gerekmektedir.

<div class="col-sm-6 col-md-3 fblock">
    <img src="/Resim/Upload/logo-invert.png" class="img-responsive" />
    <div class="sosyalmeydan">
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkFacebook", dilk).ToString()))
        {
        <a target="_blank" class="facebook" href="@Partial.Translate("LinkFacebook", dilk)">
        <i class="fa fa-facebook"></i>
        </a>
        }
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkTwitter", dilk).ToString()))
        {
        <a target="_blank" class="twitter" href="@Partial.Translate("LinkTwitter", dilk)">
        <i class="fa fa-twitter"></i>
        </a>
        }
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkGooglePlus", dilk).ToString()))
        {
        <a target="_blank" class="googleplus" href="@Partial.Translate("LinkGooglePlus", dilk)">
        <i class="fa fa-google-plus"></i>
        </a>
        }
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkInstagram", dilk).ToString()))
        {
        <a target="_blank" class="instagram" href="@Partial.Translate("LinkInstagram", dilk)">
        <i class="fa fa-instagram"></i>
        </a>
        }
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkFoursquare", dilk).ToString()))
        {
        <a target="_blank" class="foursquare" href="@Partial.Translate("LinkFoursquare", dilk)">
        <i class="fa fa-foursquare"></i>
        </a>
        }
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkYoutube", dilk).ToString()))
        {
        <a target="_blank" class="youtube" href="@Partial.Translate("LinkYoutube", dilk)">
        <i class="fa fa-youtube"></i>
        </a>
        }
        @if (!String.IsNullOrEmpty(Partial.Translate("LinkWhatsapp", dilk).ToString()))
        {
        <a target="_blank" class="whatsapp" href="https://api.whatsapp.com/send?phone=@Partial.Translate("LinkWhatsapp", dilk)">
        <i class="fa fa-whatsapp" aria-hidden="true"></i>
        </a>
        }
    </div>
</div>

© 2024, ASP.NET MVC CMS (Content Management System / İçerik Yönetim Sistemi). Tüm Hakları Saklıdır.