Question 1

Menüler Kullanımı ve Teknik Yapılandırma

Accepted Answer

Menü Yönetimi ve Teknik Yapılandırma

T-Soft e-ticaret panelinizde menü yönetimi, kullanıcılarınızın sitenizde aradıkları kategori veya sayfalara en hızlı şekilde ulaşmasını sağlayan temel navigasyon aracıdır. Bu makalede, menülerin oluşturulması, site üzerindeki görünümleri ve şablon tarafındaki teknik kod yapısı ele alınacaktır.

Önemli Not: Menü listesinde yaptığınız değişikliklerin sitede görünmesi için ilgili menü grubunun Blok Yönetimi'nde doğru alana yerleştirildiğinden emin olmalısınız.

Menü Yönetimi ve Görsel Anlatım

Aşağıdaki adımları takip ederek menülerinizi yönetebilir ve sitenizin farklı alanlarına özelleştirilmiş link grupları ekleyebilirsiniz.

1. Menü Listesi ve Genel Yapı

Sitenizde tanımlı olan tüm ana menü grupları bu listede yer alır. Masaüstü, mobil, footer ve sosyal medya ikonları gibi alanları buradan seçerek düzenleyebilirsiniz.

2. Yeni Menü Grubu Oluşturma

Panelin sağ üst köşesinde bulunan +Ekle butonu ile yeni bir menü grubu (örneğin: Kampanya Menüsü) tanımlayarak listenize dahil edebilirsiniz.

3. Sistem Tanımlı ve Özel Menüler

Sistem tanımlı menüler (yeşil onaylı), temanızın varsayılan fonksiyonları için gereklidir. Kendi oluşturduğunuz özel menüler ise kırmızı ikon ile ayrıştırılır.

4. Menü İçeriği ve Link Tipleri

Menü içerisine girdiğinizde her bir öğe için "Link" tipini (Kategori, Marka, Sabit Link vb.) seçerek yönlendirme yapabilirsiniz.

5. Masaüstü ve Footer Görünümü

Düzenlediğiniz menüler, temanızın üst (Header) bölümünde kullanıcılarınızı karşılayan ana kategorileri oluşturur.

Footer menüleri üzerinden "Müşteri Hizmetleri" veya "Önemli Bilgiler" gibi kurumsal link gruplarınızı yönetebilirsiniz.

Sitenin en üst (Top) bandında yer alan hızlı erişim linkleri de ayrı bir menü grubu olarak kontrol edilebilir.

Sol menü veya dikey kategori blokları tıklandığında açılan listeleri yine Menü Yönetimi altından güncelleyebilirsiniz.

İleri Seviye: Blok ve Şablon Yönetimi

Oluşturduğunuz menülerin hangi kod bloğuyla çalışacağını veya tasarımını nasıl değiştireceğinizi aşağıdaki alanlardan yönetebilirsiniz.

6. Menü Bloğu ve Şablon Seçimi

Tasarım > Blok Yönetimi alanından ilgili menü bloğunun ayarlarına girerek şablon seçimini (twig) yapabilir veya "Düzenle" butonuyla kodlara erişebilirsiniz.

7. Şablon Kod Yapısı (Twig)

Şablon kodu düzenleme ekranında menü değişkenlerini (örneğin: MENU_HEADER) görebilir ve tasarımınızı HTML/Twig yapısı üzerinden özelleştirebilirsiniz.

Alanlar ve Parametreler

Alan Adı	Açıklama
Değişken Adı (KEY)	Menünün şablon dosyalarında (twig) çağrılmasını sağlayan benzersiz koddur.
Sistem Tanımlı	Menünün yazılım tarafından otomatik oluşturulup oluşturulmadığını belirtir.
Şablon Düzenle	İlgili menü bloğuna ait tasarım kodlarını içeren editörü açar.

Sık Sorulan Sorular

Menü değişken adını (KEY) değiştirebilir miyim?

Sistem tanımlı menülerin değişken adları sabittir ve değiştirilmemelidir. Özel eklediğiniz menülerde bu alanı özelleştirebilirsiniz.

Mobil menü neden farklı görünüyor?

Mobil menüler genellikle ayrı bir şablon yapısı kullanır. Blok ayarlarından "Mobil Menü Alt Şablonu" kısmını kontrol edebilirsiniz.

Question 2

Tema Yönetimi | Gelişmiş Banner Bloğu Ekleme ve Düzenleme Rehberi

Accepted Answer

E-ticaret sitelerinde bannerlar, resimler ve fotoğraflar; ürünleri tanıtmanın, ziyaretçilerin ilgisini çekmenin ve satışları artırmanın en etkili yollarından biridir. Ana sayfa veya kategori sayfalarında öne çıkan görseller, kampanyaları ve indirimleri vurgulayarak kullanıcıları alışverişe yönlendirir.

Gelişmiş Banner modülü; masaüstü ve mobil cihazlar için optimize edilmiş, zaman ayarlı ve kullanıcı gruplarına özel dinamik görsel alanlar oluşturmanızı sağlar. Tekli, çiftli veya 12'ye kadar yan yana görsel yerleştirme gibi esnek düzenleme seçenekleri sunan banner blokları sayesinde sitenizin farklı sayfalarında etkili görseller yönetebilirsiniz.

Yeni bir blok oluşturmak ya da mevcut bir Gelişmiş Banner bloğunu düzenlemek için Online Mağaza > Blok Yönetimi sayfasını kullanabilirsiniz. Var olan bir bloğu düzenlemek için düzenleme kalemine, yeni blok eklemek için "+Yeni" butonuna tıklayın. Açılan alanda "Gelişmiş Banner" yanındaki artı simgesine tıklayarak bloğu ekleyip düzenleme kalemine tıklayarak içeriğine ulaşabilirsiniz.

1. Genel Ayarlar Paneli

Banner oluşturma ekranının sol tarafında yer alan bu alan, oluşturacağınız banner bloğunun temel altyapısını ve görünürlük kurallarını belirler.

Blok Başlığı: Banner bloğuna yönetim panelinde kolayca bulabilmeniz için vereceğiniz isimdir (Örn: Gelişmiş Banner).
Tema: Bannerın sitenizde hangi tema stili ve CSS kuralları ile çalışacağını belirler. Varsayılan olarak Default seçilidir.
Şablon (Twig): Bannerın yazılımsal yerleşim şablonunu seçtiğiniz alandır. default.twig genel kullanım şablonudur. Yanındaki "Düzenle" butona tıklayarak kod yapısına müdahale edebilirsiniz.

Yetkilendirme Menüsü

Bug akordeon menü açıldığında, bannerın hangi ziyaretçi türlerine gösterileceğini seçebilirsiniz:

Ziyaretçi Görsün: Sitenize üye girişi yapmamış anonim kullanıcılara gösterim ayarıdır.
Üye Görsün: Sitenize kayıtlı ve giriş yapmış standart üyelere gösterim ayarıdır.
Bayi Görsün: B2B altyapısını kullanan, sitenize tanımlı bayi gruplarına gösterim ayarıdır.

Görünüm Menüsü

Banner bloğunun hangi cihazlarda listeleneceğini cihaz bazlı (açma/kapama butonları ile) kontrol etmenizi sağlar:

Masaüstü / Mobil / Tablet / Uygulama: Seçili cihazların ekranlarında banner bloğunun aktif ya da pasif olmasını belirleyebilirsiniz.

Dil Ayarları

Siteniz çok dilli ise banner bloğunun hangi dil seçeneklerinde aktif olacağını bu alandan filtreleyebilirsiniz.

2. Banner İçeriği ve Resim Listesi Yönetimi

Sağ üst alanda yer alan "Resim Listesi" bölümü, eklediğiniz mevcut görselleri listeler. Üst taraftaki dil açılır menüsünden (Örn: Türkçe) hangi dil için içerik girdiğinizi seçebilirsiniz.

Yeni bir görsel eklemek için turuncu renkli "+ Yeni" butonuna basmanız gerekir. Bu butona bastığınızda sağ taraftan "Yeni Görsel Ekleme Penceresi" açılır.

Yeni Görsel Ekleme Penceresi Alanları:

Başlık & Alt Başlık: Görselin üzerinde veya altında listelenecek ana metin alanlarıdır. Sitenizin tasarımına göre başlık ve açıklama olarak web arayüzüne yansır.
URL Tipi ve Arama: Banner tıklandığında kullanıcının yönlendirileceği adrestir. Açılır menüden Sayfa Linki, Kategori, Ürün veya Harici Link seçerek altındaki arama çubuğundan sitenizdeki ilgili sayfayı kolayca bağlayabilirsiniz.

Sütun Genişliği (COL-X) Ayarları

Görselin yan yana kaçlı bir yapıda duracağını ve ekranda kaplayacağı alanı (Bootstrap Grid sistemine uygun olarak) belirler:

Standart Görünüm: Mobil (Telefon) ve Masaüstü (Monitör) ikonlarının yanındaki kaydırıcı çubukları (slider) sağa sola çekerek 0 ile 12 arasında bir değer verebilirsiniz (12 tam ekran genişliğidir). "Varsayılan Ayarlara Dön" butonu ile temaya ait orijinal genişliğe sıfırlayabilirsiniz.
Gelişmiş Görünüm: Sağ alttaki "Gelişmiş" butonuna tıkladığınızda ekran boyutlarına göre hassas genişlik ayarı açılır:
- XS: Çok küçük ekranlar (Giriş seviyesi akıllı telefonlar)
- SM: Küçük ekranlar (Geniş ekranlı akıllı telefonlar)
- MD: Orta ekranlar (Tabletler)
- LG: Geniş ekranlar (Dizüstü bilgisayarlar)
- XL: Çok geniş ekranlar (Masaüstü bilgisayarlar / Monitörler)
- XXL: Ultra geniş ekranlar (Büyük masaüstü monitörleri)
Örnek: Yan Yana 2 Adet Görsel Gösterme Kurgusu

Sitenizde yan yana 2 adet banner listelemek istiyorsanız, 12'li grid sistemini 2'ye bölerek her bir görselin ekran boyut karşılıklarına 6 değerini yazmalısınız ( $12 / 2 = 6$ ). Yan yana farklı boyutlarda görsel de ekleyebilirsiniz. Görsellerin toplam sütun genişlikleri 12 olacak şekilde ayarlayabilirsiniz.

Bu kurgunun bilgisayarlarda yan yana, cep telefonlarında ise dikey ekrandan dolayı alt alta ve tam ekran görünmesini sağlamak için panel ayarları şu şekilde olmalıdır:
- Masaüstü ekranlar (MD, LG, XL, XXL) için: Her iki görsele de 6 değeri verilir, böylece ekranı $%50$ - $%50$ paylaşarak yan yana dururlar.
- Mobil ekranlar (ALL, SM) için: Her iki görsele de 12 değeri verilir, böylece mobilde küçülmek yerine alt alta tam genişlikte listelenirler.

Büyük Ekran (Görsel Ekle): Masaüstü bilgisayarlarda görüntülenecek yüksek çözünürlüklü yatay/dikey banner görselini bu alana sürükleyip bırakarak veya tıklayarak yükleyebilirsiniz.

Mobil/Tablet (İsteğe Bağlı) (Görsel Ekle): Mobil cihazlarda masaüstü bannerları küçüldüğünde okunaksız olabileceğinden, sadece telefon ve tablet ekranlarına özel olarak tasarlanmış dikey veya kare formattaki mobil banner görselini bu alana yüklemeniz önerilir.
Buton Metni: Banner üzerinde bir eylem butonu (Örn: Şimdi İncele, Alışverişe Başla) yer alacaksa, butonun içinde yazacak metindir.
Veri 1, Veri 2, Veri 3: Tasarım şablonunuza bağlı olarak banner üzerinde kullanılmak üzere ayrılmış özel veri (kod/etiket/fiyat vb.) giriş alanlarıdır.
İçerik (Gelişmiş Editör): Bannerın içerisine düz metin dışında HTML biçimlendirmeli yazılar, özel ikonlar veya tablolar eklemek isterseniz kullanabileceğiniz zengin metin editörüdür.
Not: Buton ve veri alanları gibi bazı bölümler kullanılan temaya göre sitede görünme durumları değişmektedir.

Yayınlama Zaman Aralığı

Bannerın sitede kalacağı süreyi otomatik olarak yönetmenizi sağlar:

Başlangıç Tarihi: Bannerın sitenizde yayına gireceği gün ve saat.
Bitiş Tarihi: Bannerın yayından otomatik olarak kaldırılacağı gün ve saat (Örn: Kampanya bitiş anı).

3. Bannerı Kaydetme ve Yayınlama

Tüm alanları eksiksiz bir şekilde doldurduktan sonra, sağ üst köşede bulunan turuncu renkli "Kaydet" butonuna basarak görselinizi Resim Listesi'ne ekleyebilir ve banner modülünü siteniz üzerinde aktif hale getirebilirsiniz.

4. Resim Listesi Hızlı İşlem Butonları

Resim Listesi panelinde eklediğiniz her bir banner satırının sağ tarafında yer alan butonlar, görsellerinizi hızlıca yönetmenizi sağlar. Soldan sağa bu butonların işlevleri şu şekildedir:

Göz İkonu (Durum - Aktif/Pasif): Görselin sitedeki görünürlüğünü kontrol eder. Üzeri çizili göz ikonu bannerın şu an pasif olduğunu gösterir. Tıklayarak görseli silmeden sitede yayına alabilir veya gizleyebilirsiniz.
Kopyala İkonu (Çoğalt): Mevcut banner içeriğini, linkini ve ayarlarını tek tıkla kopyalayarak alt satıra yeni bir kopyasını oluşturur. Benzer ayarlarda hızlıca yeni bannerlar üretmek için kullanılır.
Kalem İkonu (Düzenle): İlgili bannerın detay penceresini (Başlık, URL, Görsel, Sütun Genişliği vb.) sağ taraftan tekrar açarak içerikleri güncellemenizi sağlar.
Çöp Kutusu İkonu (Sil): Eklenen banner görselini ve ona bağlı tüm tanımlı ayarları sistemden kalıcı olarak kaldırır.

5. Ayarlar (Blok Başlık ve Açıklama Seçeneği)

Resim listesinin hemen altında yer alan bu alan, banner bloğunun tamamını kapsayan genel bir üst başlık yapısı kurgulamanızı sağlar:

Metin Girilirse: "Başlık" ve "Alt Başlık" alanlarına herhangi bir veri girişi yaptığınızda, bu metinler sitenizin ön yüzünde banner bloğunun hemen üzerinde kurumsal bir başlık alanı olarak görüntülenir.
Boş Bırakılırsa: Bu alanları boş bıraktığınız takdirde sistem üst alanda herhangi bir başlık alanı oluşturmaz ve banner görselleriniz doğrudan listelenir.

6. Banner Örnekleri

Question 3

ÜRÜNLERİ ANASAYFADA GÖSTERME

Accepted Answer

Anasayfanızda belirlediğiniz ürünleri ürün liste yapısında ziyaretçilere gösterebilirsiniz.

Vitrin ürünleri yapısını kullanarak seçtiğiniz ürünleri anasayfaya kolayca yerleştirebilir, istediğiniz zaman düzenleyebilirsiniz.

Farklı blok isimleri tanımlayarak ürünleri dikkat çekici şekilde sunabilirsiniz.

İşlem Adımları

- "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

- "Özelleştir" butonuna tıklayınız.

- "Gelişmiş" butonuna tıklayınız.

- Blok yönetiminde "Anasayfa" seçiniz ve anasayfa ürünlerini eklemek istediğiniz satır alanında "Yeni" butonuna tıklayınız.

- "Kullanılabilir Bloklar" listesinden "Vitrin Ürünleri" bloğunun artı simgesine ekleyiniz.

- Eklediğiniz "Vitrin Ürünleri" bloğunun düzenleme kalemine tıklayınız.

- Vitrin eklemek için "Blok Ayarları > Vitrin Listesi" alanından "Yeni" butonuna tıklayınız.

- "Vitrin" seçim alanına tıklayarak "Tüm Sayfalarda Kullanılabilir Vitrinler > Anasayfa Ürünleri" seçiniz.

- Vitrine anasayfa ürünleri eklendikten sonra, blok ve vitrin ayarlarını düzenleyiniz. Vitrin Ürünleri makalemizi incelemek için tıklayınız.

- Anasayfa ürünleri vitrininde gösterilecek ürünleri seçmek için "Ürünler > Ürünler" sayfasına tıklayınız.

- Ürün listesinde bulunan "A (Anasayfa)" sütununda bulunan kırmızı bayrağı aktif ettiğiniz ürünler vitrinde otomatik görüntülenecektir.

- Listede ürünleri seçerek alt kısımda görüntülenen toplu işlem özelliği ile anasayfa bayrağını toplu aktif pasif yapabilirsiniz.

- Anasayfa bayrağını aktif ettiğiniz ürünler, vitrinde görüntülenmeye başlayacaktır.

CSV İLE TOPLU İŞLEMLER

Ürünlerde anasayfa bayrağını CSV Ürün Sihirbazı uygulamasını kullanarak toplu olarak yönetebilirsiniz.

CSV Ürün Sihirbazı uygulamasını yükleme hakkındaki makalemizi incelemek için tıklayınız.

CSV dosyasını içeri aktarma esnasında hata alıyorsanız dosyayı ve içeriğini kontrol etmelisiniz. CSV Dosya Kontrolleri makalemizi incelemek için tıklayınız.

İşlem Adımları

- "Ürünler > Excel Ürün Sihirbazı > Excel Ürün İçe Aktar" sayfasına tıklayınız.

- İşlem yapılacak örnek dosyayı "Ürünler > Dışarı Aktar" sekmesinden veya "Bilmeniz Gerekenler" alanından indirebilirsiniz. İşlem yapılacak dosyada "Ana Sayfada Görüntüle" sütunu bulunmalıdır.

- Örnek dosyayı indirmek için "Örnek CSV İndir" butonuna tıklayınız. İndirilen dosyada "Ana Sayfada Görüntüle" sütunu gelmediğinden manuel eklenmelidir.

- Anasayfa ürün bayrağının tanımlanacağı ürün bilgilerini de dosya içerisinde almak istiyorsanız dışarı aktar alanından sütun seçimi yaparak aktarabilirsiniz. Dışarı aktarımda "Ana Sayfada Görüntüle" sütununu seçerek örnek dosyanızda yer almasını sağlayabilirsiniz.

- Aldığınız dosyada "Ana Sayfada Görüntüle" sütununa, bayrağın görünüm durumunu aktif (true), pasif (false) yazarak düzenleyebilirsiniz.

- Hazırladığınız dosyayı "Ürünler > İçeri Aktar" sekmesinden aktarabilirsiniz. İçeri aktarım sayfasının kullanımı hakkında CSV ÜRÜN SİHİRBAZI - ÜRÜN İÇE AKTARMA makalemizi inceleyebilirsiniz.

NOT : İçeri aktarımda herhangi bir hata almamanıza rağmen ilişkili ürünler ürüne eklenmiyorsa site ayraç bilginiz farklı olabilir. "Ayarlar > Genel Ayarlar > Rest Web Servis Ayraç Karakteri" ayarından CSV ile ilişkili ürün aktarımında kullanılması gereken ayraç bilgisine ulaşabilirsiniz. Ayar alanında görüntülenen ayraç ne ise ilişkili ürünler sütununda kodlar arasına o eklenmelidir. Ayarda tanımlı ayraç yerine virgül veya noktalı virgül kullanmak istiyorsanız öncelikle ayarı güncellemelisiniz. ERP entegrasyonunuz bulunuyorsa ilgili departmandan bilgi almadan ayarda değişiklik sağlamayınız.

CSV Ürün Sihirbazı - Ürün İçe Aktarma makalemizi incelemek için tıklayınız.

Question 4

İLETİŞİM SAYFASINA ULAŞIM HARİTASI EKLEME

Accepted Answer

E-ticaret sitelerinde ulaşım haritası ekleme, kullanıcı deneyimini iyileştiren ve müşteri memnuniyetini artıran önemli bir unsurdur.

Ulaşım haritaları, müşterilerin fiziksel mağazalara, depo lokasyonlarına veya ürün teslim noktalarına kolayca ulaşmasını sağlar.

Bu haritalar, müşterilerin konumlarını belirleyip en uygun rota ve ulaşım yöntemini seçmelerine yardımcı olur.

Sonuç olarak, ulaşım haritasının eklenmesi, müşteri sadakatini artırırken e-ticaret sitesinin güvenilirliğini ve profesyonelliğini de pekiştirir.

İşlem Adımları

- Sitenize ulaşım haritası eklemek için "Tasarım > Tema Yönetimi > Özelleştir > Gelişmiş" adımlarını takip ederek blok yönetimi sayfasını açınız.

- Blok yönetimi sayfasında "İletişim" sayfasını seçiniz. İletişim sayfası içerisinde bulunan "Ulaşım Haritası" bloğunun düzenleme kalemine tıklayınız.

- Iframe veya API key kullanarak harita ekleyebilirsiniz. API key kullanıldığında koordinat bilgileri tanımlamalıdır. Iframe kullanıldığında sadece iframe kodunun eklenmesi yeterlidir.

- API Key İle Ulaşım Haritası Ekleme : Ulaşım haritasını API key ile tanımlayabilirsiniz. Key bilgisini Google üzerinden edinerek "Google Haritalar API Anahtarı" alanına ekleyiniz. API key ekledikten sonra "Google Koordinatı (X/Y/Z)" bilgilerini eklemelisiniz. Koordinat bilgilerinizi Google Maps üzerinden alabilirsiniz.

- Iframe İle Ulaşım Haritası Ekleme : Ulaşım haritasını iframe yapısı ile kolayca tanımlayabilirsiniz. Iframe kodunu Google Maps üzerinden alabilirsiniz. Alınan kodu "Google Haritalar API Anahtarı" alanına tanımlayabilirsiniz.

- "Google Haritalar API Anahtarı" ayarı boş bırakılırsa harita bloğu siteye yansımayacaktır.

- Iframe kodu almak için mağaza adresinizi haritalar sayfasında aratınız. Adresi bulduğunuzda "Paylaş" butonuna tıklayınız.

- Paylaş penceresinde "Harita Yerleştirme" sekmesine tıklayınız. Harita iframe kodu bilgisinin yanındaki "HTML'Yİ KOPYALA" seçeneğine tıklayınız.

- Iframe kodunu ayar alanına tanımladıktan sonra genişlik, yükseklik ve çerçeve düzenlemelerini yapabilirsiniz.

Question 5

BLOK YÖNETİMİ

Accepted Answer

E-ticaret sitelerinde blok yönetimi, web sitenizin tasarım ve işlevselliğini optimize ederek kullanıcı deneyimini ve işletme verimliliğini artırmak açısından büyük önem taşır.

T-Soft altyapısını kullanan sitelerde, tüm sayfalar bloklar halinde yapılandırılarak esnek ve dinamik bir yapı sunar.

Bu sayede, belirli bir bloğu birden fazla sayfada kullanabilir, sitenize yeni bloklar ekleyebilir ve gerekli durumlarda kodsal müdahaleler yaparak blokları özelleştirebilirsiniz.

Blok yönetimi, sitenizin görsel tutarlılığını sağlamakla kalmaz, aynı zamanda içerik yönetimini de kolaylaştırır.

Bu özellik, zaman ve emek tasarrufu sağlarken, sitenizin sürekli olarak güncel ve ilgi çekici kalmasına yardımcı olur.

İşlem Adımları

- "Tasarım > Tema Yönetimi > Özelleştir > Gelişmiş" sayfasına tıklayınız.

- Bulunduğunuz Sayfa : Blok yönetimi üzerinden düzenleme yapabileceğiniz sayfa listesine erişebilirsiniz. Düzenlemelere başlamadan önce işlem yapmak istediğiniz sayfayı seçiniz.

- Silinen Sayfalar : Sitede kullanmak için oluşturduğunuz kullanıcı tanımlı sayfaları silebilirsiniz. Silinen sayfaların listesine bu alandan ulaşabilirsiniz. Yeniden yükle simgesine tıklayarak silinen sayfaları panele tekrar ekleyebilirsiniz.

- Yeni Sayfa : Sitenizde çeşitli amaçlar için kullanabileceğiniz ek sayfalar oluşturabilirsiniz.

- Yeni Satır : Sayfa içerisinde yeni satır alanı açmak için kullanabilirsiniz. Blok konumlandırmaları için birden fazla satır oluşturabilirsiniz.

Blok Yönetimine Yeni Sayfa ve Yeni Satır Ekleme makalemizi incelemek için tıklayınız.

- İçe Aktar : Kullandığınız temaya ait kodsal düzenlemeleri ve tasarım kodlamasını zip dosyası olarak içeri aktarabilirsiniz. İçeri aktarımda mevcut sayfa içeriklerini silerek aktardığınız dosyaları kullanabilirsiniz veya varolan sayfaları geç yapısı ile sadece olmayan sayfalarda aktarım yapılmasını sağlayabilirsiniz.

- Meta Bilgilerini Düzenle : Blok yönetiminde yer alan sayfalara ait seo tanımlamaları, link ve çeviri bilgilerini düzenleyebilirsiniz.

- SCSS : Blok yönetiminde yapılan kodsal ve blok düzenlemeleri sonrasında tasarım görünümün tam oturması ve düzgün yansıması için SCSS butonuna tıklayarak tetikleyebilirsiniz. Aynı işlemi "Ön Bellek Temizle" sayfasından da yapabilirsiniz.

- Sitede Gör : Bulunduğunuz sayfanın site ön yüz ekranına yönlendirme sağlar. Alt sayfa yönetimi bulunan sayfalarda sitede gör yapısı kullanılmamaktadır.

- Sürükle : Blok yönetimi sayfasında bulunan satırları sürükle bırak mantığı ile yer değiştirebilirsiniz.

- Ayarlar : Eklenen satır alanlarına ait düzenlemeleri yönetebilirsiniz.

- Container : Eklenen satırda yer alan içeriklerin sitede kenar boşluklarının olup olmayacağını belirler. "Container" seçeneği ile satırın sağında ve solunda boşluk eklenir ve satır sayfaya ortalanır. "Fullwidth" seçeneği ile eklenen satır sola ve sağa yaslı şekilde boşluksuz olarak eklenir.

- Class : Satır özelinde kodsal özellikleri yönetebileceğiniz class tanımlamaları sağlayabilirsiniz. Herhangi bir class kullanımı olmayacak ise bu alanı boş bırakmalısınız.

- Başlık : Satırın sayfa içerisinde görüntülenecek başlık bilgisidir.

- Sütun Sayısı (Column) : Satırın kaç sütuna bölüneceğini seçebilirsiniz. 12'li grid yapısına uygun şekilde maksimum 12 adet sütuna ayrılabilmektedir.

- Önizleme : Seçtiğiniz sütun sayısına göre ilgili satırın önizlemesini görüntüleyebilirsiniz.

- Ekran Çözünürlüğü : Ekran boyutlarına göre satır içerisindeki sütun ölçüsünü seçebilirsiniz. "Sütun Sayısı" ayarında seçtiğiniz adede göre düzenleme yapılmalıdır. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre çalışmaktadır. Örnek olarak sütun sayısı 3 seçildiğinde, ekran çözünürlüğü alanında açılan seçeneklerin toplamı 12 olacak şekilde yerleştirmelisiniz. Seçimlerinizi "4-4-4", "2-8-2", "2-4-6" vb. toplamı 12 olacak şekilde ayrımlar yapabilirsiniz.

- Sil : İlgili satır alanını sayfa üzerinden siler. Satır silindiğinde içinde ekli bloklar da sayfadan silinecektir. İşlemin geri dönüşü olmadığından ilgili satır ve blokların tekrar eklenmesini gerekmektedir.

- Satır Düzeni : İlgili satır alanının container veya fullwidth seçimini görüntüleyebilirsiniz. Ok simgesi görünüyorsa fullwidth, kare görünüm var ise container seçilmiş anlamına gelmektedir.

- Blok Alanı : Satır içlerine eklenen blokları görüntüleyebilir, düzenleme ve silme işlemlerini sağlayabilir, sürükle bırak mantığı ile yer değiştirebilirsiniz.

- Yeni Satır : Her satır alanı için istediğiniz kadar blok eklemesi yapabilirsiniz. Blok eklemek için "Yeni" butonuna tıklayarak, blok listesinden seçim yapabilirsiniz.

Blok Sekmeleri Kullanımı makalemizi incelemek için tıklayınız.

Question 6

FRONT-END ÖZEL TEMA TAŞIMA SONRASI DÜZENLEMELERİ

Accepted Answer

Front-end ekibimize özel tema yaptırdıktan sonra aşağıdaki adımları takip ederek kontrol ve düzenleme sağlayabilirsiniz.

Özel tema işlemleri hakkındaki sorularınız ve düzenleme yapmak istediğiniz diğer konular için çağrı merkezimiz ve nildesk üzerinden destek ekibimize ulaşabilirsiniz.

İşlem Adımları

Yönetim Paneline Giriş

- Sitenizin yönetim paneline giriş sağlamak için "tsoftpanel.com" linkine gidiniz. Açılan panel giriş ekranında alan adınızı yazarak "Devam Et" butonuna tıklayınız. Sonraki sayfada site açılışında size verilen veya sizin açtığınız kullanıcı bilgileri ile panele giriş yapabilirsiniz.

Proje Notları

- Tema taşıma işleminizden sonra, temanızda yapılan özel kodlamalara ait notlar sitenize eklenmektedir. Eklenen notları görüntülemek için "Ayarlar > Kontrol Merkezi" sayfasına tıklayınız.

- Kontrol Merkezi'nde "Proje Notları" sekmesine tıklayınız. Bu listede özel tasarımınıza ait dikkat edilmesi gereken işlemler için eklenen notlar yer alacaktır. Büyüteç ikonuna tıklayarak her notun detayını inceleyebilirsiniz.

Tema Yönetimi

- Özel tasarımınızla birlikte sitenize özel olarak yeniden kodlanan anasayfa içeriklerinizi düzenleyebilirsiniz. Anasayfa da bulunan slider, banner, html içerikler, ürün vitrinleri vb. tasarımda yapılan alanların yönetimi ve düzenlenmesini yapmak için "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

- Özel tasarımınız sitenize yüklendiğinde, tema yönetimi bölümünde "Aktif Tema" seçimi "V5-SiteAdi" olarak görünecektir. Bu adlandırma, özel tasarım kullanıldığını belirtir. Aktif tema bölümünde "Özelleştir" butonuna tıklayınız.

- Hızlı tema düzenleme adımında, temanızın ön izlemesini görüntüleyebilir ve sayfa üzerindeki bloklarda ayar ve görsel düzenlemeleri hızlıca yapabilirsiniz. Stil alanından tema renklerini, yazı tiplerini ve buton renklerini kolayca düzenleyebilirsiniz. Daha detaylı düzenlemeler yapmak ve geniş ekran avantajından yararlanmak için sol üstte yer alan "Gelişmiş" butonuna tıklayın.

- Tasarım düzenlemelerinizde ilk önceliğiniz anasayfa olmalıdır. Ziyaretçilerin ilk gördüğü ekrandaki tüm alanları kontrol etmeli ve değişmesi gereken alanlarda düzenleme sağlamalısınız.

- Slider : Temanızda bulunan slider (kayan görsel) bloklarını kontrol edebilir, tema ve şablon seçimlerini yönetebilir, görselleri değiştirebilir ve ayarlarını düzenleyebilirsiniz. Daha fazla bilgi için Slider ile ilgili makalemizi inceleyebilirsiniz.

- Banner : Temanızda bulunan banner (sabit görsel) bloklarını kontrol edebilir, tema ve şablon seçimlerini yönetebilir, görselleri değiştirebilir ve ayarlarını düzenleyebilirsiniz. Daha fazla bilgi için Banner ile ilgili makalemizi inceleyebilirsiniz.

- Vitrin Ürünleri : Temanızda bulunan ürün vitrin bloklarını kontrol edebilir, tema ve şablon seçimlerini yönetebilir, koleksiyon seçimlerini değiştirebilir ve ayarlarını düzenleyebilirsiniz. Daha fazla bilgi için Vitrin Ürünleri ile ilgili makalemizi inceleyebilirsiniz.

- HTML Blok : Temanızda bulunan Html (içerik) bloklarını kontrol edebilir, tema ve şablon seçimlerini yönetebilir, içeriklerini değiştirebilir ve ayarlarını düzenleyebilirsiniz. Daha fazla bilgi için HTML Blok ile ilgili makalemizi inceleyebilirsiniz.

- Dil Değişkenleri : Bloklar içerisinde dinamik olarak değişken ile yönetilen metin, link, görsel vb. alanların düzenlemelerini blok detayında yer alan "Dil Değişkenleri" sekmesinden yapabilirsiniz. Daha fazla bilgi için Dil Değişkenleri ile ilgili makalemizi inceleyebilirsiniz.

- Editör : Bloklar içerisinde kod içeriğini görüntülemek ve düzenlemek için "Editör" sekmesini kullanabilirsiniz. Daha fazla bilgi için Blok Sekmeleri Kullanımı ile ilgili makalemizi inceleyebilirsiniz.

- Ürün liste sayfalarının kontrolünü sağlamalısınız. Tasarımın uygunluğunu, sıralama, filtreleme, yorum gibi alanları kontrol ederek gerekli testleri gerçekleştirebilirsiniz.

- Ürün detay sayfalarının kontrolünü sağlamalısınız. Tasarımın uygunluğunu, görsellerin görünümü, ürün özelinde blok gösterimleri gibi alanları kontrol ederek gerekli testleri gerçekleştirebilirsiniz.

Kategoriler

- E-Ticaret sitenizi kurmaya başladığınızda ilk yapmanız gereken işlemlerden birisi, kategori yapınızı oluşturmaktır. Kategori ekleme, düzenleme, silme vb. birçok işlemi yapabilmek için "Ürünler > Tanımlar > Kategoriler" seçeneğine tıklayınız.

- Kategoriler sayfasında yeni kategori kırılımlarını ekleyebilir ve düzenleyebilirsiniz. Daha fazla bilgi için Kategori Ekleme ile ilgili makalemizi inceleyebilirsiniz.

- Kategori Vitrinleri : Kategori sayfaları için metin ve görsel eklemesi yapılabilmektedir. Özel tema sürecinizde de bu alanlar için çalışmalar yaptırabilirsiniz. Kategoriler sayfasında kategori özelinde vitrin içerikleri ekleyerek sitede gösterebilirsiniz. Daha fazla bilgi için Kategori Vitrini ile ilgili makalemizi inceleyebilirsiniz.

Menüler

- Sitenizde sayfaların üstünde ve altında gösterilen menülerin eklenmesi, düzenlenmesi, silinmesi vb. işlemleri yapmak için "Tasarım > Menüler" sayfasına tıklayınız.

- Menülerin kullanımı temanıza göre farklılık gösterilmektedir. Masaüstü, Header ve Top menüleri çoğunlukla tasarımın üst kısmında yer alan menü gruplarıdır. Alt Kısım, Sosyal Medya İkonları ve Ödeme Yöntemleri menü grupları ise tasarımınızın en altında yer alan link seçimleridir. Daha fazla bilgi için Menüler ile ilgili makalemizi inceleyebilirsiniz.

Alt Kısım İletişim Bilgileri

- Sitenizin alt kısımda kullanıcılara adres, telefon numarası gibi iletişim bilgileri sunabilirsiniz. Bu alandaki iletişim bilgileri genel ayarlardan düzenlenmektedir. Daha fazla bilgi için İletişim Bilgileri (Genel Ayarlar) ile ilgili makalemizi inceleyebilirsiniz.

Dil Çevirileri

- Sitenizde birden fazla dil kullanımı var ise özel tema ile gelen alanlar için çeviri işlemlerini kontrol edebilirsiniz. Daha fazla bilgi için Dil Değişkenleri ve Yeni Bir Dil Eklendiğinde Yapılması Gerekenler ile ilgili makalemizi inceleyebilirsiniz.

Destek Kanalları

Yönetim paneli ve siteniz ile ilgili sorularınız, yapmak istediğiniz işlemler ve sorularınız için T-Soft destek ekibine ulaşabilirsiniz.

- Çağrı Merkezi (0212 612 44 55) : Destek ekibi uzmanlarına 7/24 telefon ile ulaşarak sorularınızı iletebilir, uzak masaüstü bağlantısı ile birlikte kontroller sağlayabilirsiniz.

- Nildesk / TDM : Sorularınızı veya aldığınız hataları yönetim panelinizde "Nildesk" platformumuz üzerinden yazılı olarak iletebilirsiniz. Destek Talebi Oluşturma makalemizi incelemek için tıklayınız.

- Makale Destek Platformu : Yönetim paneli ve ürünlerimizin kullanımı ile ilgili birçok konuya makale platformumuz help.tsoft.com.tr linkinden ulaşabilirsiniz.

- Video Destek Platformu : Makalesini okuduğunuz tüm konuların sesli anlatımları için video.tsoft.com.tr linkini ziyaret edebilirsiniz.

Question 7

E-Ticaret Sitesinde Logo ve Site İkonu (Favicon) Nasıl Değiştirilir?

Accepted Answer

E-ticaret sitenizin marka kimliğini yansıtan en önemli unsurlar olan logo ve favicon (site ikonu) ayarlarını T-Soft yönetim panelinden kolayca gerçekleştirebilirsiniz. Bu ayarlar, sitenizin hem tarayıcı sekmelerinde hem de ana sayfa üzerinde profesyonel bir görünüm kazanmasını sağlar.

Ne İçin Kullanılır?

Site Logosu: Web sitenizin üst kısmında (header) yer alan, markanızı temsil eden ana görseldir.
Favicon: Tarayıcı sekmelerinde, site adının hemen solunda görünen küçük ikondur. Marka bilinirliğini artırır ve kullanıcının sekmeler arasında sitenizi kolayca bulmasını sağlar.

İşlem Adımları

Sitenizin logosunu ve faviconunu güncellemek için aşağıdaki adımları takip ediniz:

Ayarlar > Genel Ayarlar yolunu izleyin.
Açılan sayfada Site Tasarım Ayarları kartına tıklayın.
Karşınıza gelen ekranda "Site Logosu" ve "Favicon" bölümlerini göreceksiniz.
Mevcut bir görseli değiştirmek için Güncelle butonuna basabilir veya Dosya Yöneticisi üzerinden daha önce yüklediğiniz bir dosyayı seçebilirsiniz.
Yeni bir görsel eklemek için "Dosya Seç" alanına görseli sürükleyebilir veya tıklayarak bilgisayarınızdan seçebilirsiniz.

Alanlar ve Ayarlar

Sitenizin görsel kimliğini yapılandırırken kullanabileceğiniz detaylı ayarlar aşağıda açıklanmıştır:

Alan Adı	Açıklama
Site Logosu	Sitenizin ana logosunun yüklendiği alandır. Transparan (PNG) formatında yüklenmesi tavsiye edilir.
Favicon (Web Sitesi İkonu)	Tarayıcı sekmesinde görünen ikondur. Genellikle 16x16 veya 32x32 piksel boyutlarında, .ico veya .png formatında kullanılır.
Alt Etiketi (SEO)	Görselin üzerine gelindiğinde görünen veya görsel yüklenemediğinde çıkan metindir. Arama motorları için kritik öneme sahiptir.
Genişlik ve Yükseklik	Logonun sitede hangi boyutlarda (px) görüntüleneceğini belirler. Orantılı değerler girilmesi görselin bozulmasını önler.

Önemli Not: Logo yükledikten sonra görsel üzerine gelindiğinde "Gelişmiş Ayarlar" (çark simgesi) içerisinden Alt Etiketi alanını mutlaka doldurunuz. Bu işlem, arama motorlarının sitenizin içeriğini daha iyi anlamasına ve SEO skorunuzun artmasına yardımcı olur.

Gelişmiş Ayarlar

Logo görselinin sağ üst köşesinde bulunan Çark (Ayarlar) simgesine tıkladığınızda şu düzenlemeleri yapabilirsiniz:

Alt: Görsel için SEO uyumlu alternatif metin girin (Örn: "T-Soft E-Ticaret Logo").
Genişlik (Width): Logonun piksel cinsinden genişliğini belirleyin.
Yükseklik (Height): Logonun piksel cinsinden yüksekliğini belirleyin.
Kaydet: Yaptığınız değişikliklerin aktif olması için bu butona basmayı unutmayın.

Sık Sorulan Sorular

Logoyu değiştirdim ama sitede hala eskisi görünüyor, ne yapmalıyım?

Bu durum genellikle tarayıcı veya sistem önbelleğinden kaynaklanır. Ayarlar > Genel Ayarlar > Ön Bellek sekmesinden sitenizin ön belleğini temizleyebilir veya tarayıcınızda CTRL+F5 yaparak sayfayı yenileyebilirsiniz.

Logo için en uygun dosya formatı nedir?

Arka planın şeffaf olması ve profesyonel görünmesi için .png veya .svg formatları tercih edilmelidir.

Logo Alt etiketi SEO için neden önemlidir?

Google gibi arama motorları görselleri "okuyamaz", ancak Alt etiketlerini indeksler. Doğru bir alt etiket kullanımı, sitenizin görsel aramalarında çıkmasını sağlar.

Question 8

Ürün Karşılaştırma

Accepted Answer

Ürün Karşılaştırma

Ürün Karşılaştırma özelliği, ziyaretçilerinizin web sitenizdeki benzer ürünleri teknik özellikler, fiyat ve diğer kriterler bakımından yan yana görmelerini sağlayan fonksiyondur.

Ne İçin Kullanılır

Müşterilerin satın alma kararını kolaylaştırmak için kullanılır. Özellikle çok sayıda teknik özelliğe sahip ürün gruplarında (elektronik, beyaz eşya vb.), kullanıcının sekmeler arasında geçiş yapmasına gerek kalmadan en doğru seçimi yapmasına yardımcı olur.

Önemli Not: Karşılaştırma özelliğinin tam verimli çalışabilmesi için ürünlerinizin "Teknik Detay" veya "Ek Özellikler" kısımlarının doldurulmuş olması, müşterinin anlamlı bir kıyaslama yapabilmesi için gereklidir.

İşlem Adımları

Ürün karşılaştırma butonunun kategori ve ürün listeleme sayfalarında aktif edilmesi için aşağıdaki yeni nesil panel adımlarını takip ediniz:

Yönetim panelinizde sol menüde bulunan Ayarlar sekmesine tıklayın.
Açılan alt menüden Genel Ayarlar bölümüne giriş yapın.
Genel Ayarlar sayfasında yer alan Kategori Ayarları kartına tıklayın.
Ürün Listeleme Sayfalarında Göster başlığı altındaki seçenekleri inceleyin.
Karşılaştırma Butonu seçeneğini yanındaki kutucuğu işaretleyerek aktif edin.
Sayfayı kaydederek işlemi tamamlayın.

Alanlar ve Ayarlar

Ayar Adı	Açıklama
Karşılaştırma Butonu	Ürün listeleme sayfalarında (kategori, marka, arama sonuçları vb.) ürün kartları üzerinde karşılaştırma ikonunun/butonunun görünmesini sağlar.
Hızlı Gör	Ziyaretçilerin ürün detayına gitmeden liste sayfasında ürün özetini görmesini sağlar (Karşılaştırma ile kombine kullanılabilir).

Beklenen Sonuç

Ayarlar aktif edildikten sonra, kategori sayfalarındaki ürün kutucuklarında bir karşılaştırma ikonu belirir. Ziyaretçi birden fazla ürünü seçtiğinde, bu ürünler bir listeye eklenir ve "Karşılaştır" butonuna tıklandığında seçilen ürünlerin tüm teknik verileri tek bir tabloda yan yana listelenir.

Sık Sorulan Sorular

Karşılaştırma sayfasında hangi bilgiler listelenir?

Varsayılan olarak ürün adı, görseli, fiyatı ve ürünün "Teknik Detaylar" sekmesinde tanımlı olan tüm özellikleri listelenir.

Buton seçili olduğu halde sitede görünmüyor, neden?

Eğer ayarı aktif etmenize rağmen görünmüyorsa, Ayarlar > Ön Bellek sayfasından site ön belleğini temizlemeniz veya tasarım şablonunuzun bu özelliği desteklediğinden emin olmanız gerekir.

Aynı anda kaç ürün karşılaştırılabilir?

T-Soft altyapısında genellikle ekran genişliğine bağlı olarak 4 ürüne kadar yan yana karşılaştırma yapılması kullanıcı deneyimi açısından en idealidir.

Question 9

KATEGORİ SAYFALARINDA TEK SATIRDA GÖRÜNECEK ÜRÜN SAYISI

Accepted Answer

Günümüz e-ticaret yapısında kullanıcılar sitenize bilgisayar, tablet, mobil olmak üzere farklı cihazlardan giriş yapmaktadırlar.

Kullanıcı deneyimleri ve ürün sergileme özellikleri göz önüne alındığında her cihaz grubu için farklı ürün yoğunluğu yapılması gerekmektedir.

T-Soft altyapısı ile her cihaz grubu için ürün liste sayfalarında, tek satırda görüntülenebilecek ürün adedini belirleyebilirsiniz.

Masaüstü cihazlar için kategorilerde yan yana 4 adet, mobil cihazlar için yan yana 2 ürün gösterimi yapabilirsiniz.

İşlem Adımları

- "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

- "Özelleştir" butonuna tıklayınız.

- "Gelişmiş" butonuna tıklayınız.

- Blok yönetiminde "Ürün Liste" sayfasını seçiniz ve "Ürün Listesi" bloğunun düzenleme kalemine tıklayınız.

- Blok içerisinde "Blok Ayarları > Ürün Adeti" alanından cihaz bazında yanyana görüntülenecek ürün sayısını belirleyebilirsiniz.

- "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet ürün görüntüleneceğini belirler.

Question 10

V5 SAHAF TEMASI KURULUMU

Accepted Answer

E-ticaret sitenizde V5 sistem altyapısı ile aynı anda birden fazla tema yükleyebilir ve aktif ederek kullanabilirsiniz.

T-Soft V5 sistemi aracılığıyla, çeşitli demo seçenekleri ile dakikalar içinde şık ve profesyonel bir web sitesi oluşturmak oldukça kolay hale gelmiştir.

Kitapçılar için Sahaf teması en uygun seçeneklerden biridir. Sahaf teması, ana sayfasında slider ve banner gibi alanlar sunarak kitapçıların reklam ve tanıtımlarını yapmasına olanak sağlar.

Sahaf temasının ürün detay sayfası, her kitabın sahip olduğu özellikleri gösteren özelleştirilmiş bir yapıya sahiptir. Bu tema, kitap sektöründeki yoğun kategori ve filtre yapısına uygun olarak tasarlanmıştır ve son kullanıcıların aradıkları kitapları kolayca bulmalarına yardımcı olacak şekilde geliştirilmiştir.

Mobil uyumlu ve seo destekli temamızı sizlerde kendi firmanıza uygun özelleştirerek, kolayca uygulayabilirsiniz.

Sahaf teması canlı önizleme demosunu incelemek için https://tsoftthemes.com/sahaf linkinden erişim sağlayabilirsiniz.

TEMA YÜKLEME

V5 altyapılı sitenizde Sahaf temasını kurmak için aşağıdaki adımları uygulabilirsiniz.

E-ticaret sitenizin paneline www.tsoftpanel.com adresinden giriş yapınız.

Yönetim panelinde tema yükle, aktifleştirme, düzenleme vb işlemler için "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

Tema yüklemek için "Tema Yönetimi" sayfasında yer alan "Tema Marketine Git" butonuna tıklayınız.

Tema marketi içerisinde sitenize yükleyerek kullanabileceğiniz ücretli ve ücretsiz temalar yer almaktadır.

Sahaf temasını yüklemek için üstüne tıklayınız. Tema detay sayfasında "Yükle" butonuna tıklayarak Sahaf temasının yüklü temalar listenize gelmesini sağlayabilirsiniz.

Tema yükleme işlemi tamamlandığında başarılı bilgisi için popup gelecektir. "Tema Düzenleyiciye Git" butonu ile tema yönetimi sayfasına geçebilirsiniz.

Temanız yüklendiğinde güncel tema versiyonu ile birlikte yüklenecektir ve tema sayfasında "Güncelsiniz" seçeneği görünecektir.

Temanızın güncel olmaması durumunda bu alanda "Güncelle" butonu yer alacaktır.

Güncelle butonunu kullanarak temada yapılan güncellemeleri uygulayabilirsiniz. Tema güncelleme işlemi sistem güncelleme işlemi ile aynı değildir. Tema güncelleme yalnızca tema dosyasında yapılan güncellemeleri ilgili temaya yükler. Tema Güncelleme makalemizi incelemek için tıklayınız.

Tema yüklerken aşağıdaki ekran resmindeki hatayı almanız durumunda "Bölümler > Destek" sayfasından departmanı "T-Soft Apps" seçerek talep oluşturabilirsiniz. İlgili ekip düzenleme sağladıktan sonra temanızı sorunsuz olarak yükleyebilirsiniz.

sahaf57.png (155 KB)

TEMA AKTİFLEŞTİRME

Yüklediğiniz Sahaf teması Tema Yönetimi sayfasında listelenecektir. Tema üzerine geldiğinizde işlem yapabileceğiniz butonlar yer almaktadır.

1. Önizleme : Sahaf temasının standart görünümünü örnek site üzerinden aktif etmeden önizleme ile görmenizi sağlar.

2. Aktifleştir : Sahaf temasını sitenizde aktif ederek kullanmanızı sağlar. Tıkladığınızda aktifleştirme için iki seçenek sunulmaktadır.

1. Seçenek : "Temayı Aktifleştir" seçeneği ile temayı aktifleştirdiğinizde daha önce eklediğiniz slider, banner ve diğer içerikleriniz var ise içerikler silinmeden tema ve şablonlarda değişiklik sağlar. Tema değiştirildiğinde tüm özel şablonlarınızın da default seçilmesine neden olur. Sitenizdeki içerikler aynı kalır, sitenin görünümü ve çalışma şekli etkilenebilir. Örnek olarak anasayfanıza önceki temaya ait banner, slider görsellerinizi eklediniz. Tema marketinde beğendiğiniz farklı temalara geçiş yapmak istediğinizde, "Temayı Aktifleştir" seçeneğini kullanarak bir önceki temanıza ait slider, banner gibi içerikler aktifleştirdiğiniz temanıza aktarılmış olur.

2. Seçenek : "Temayı Aktifleştir ve İçerikleri Aktar" seçeneği ile temayı aktifleştirdiğinizde, daha önce eklemiş olduğunuz slider, banner gibi düzenlemeler mevcut ise, tema değişiminde yaptığınız tüm işlemler silinir. Yeni tema yükleme işleminde, yüklenen tema konseptine ait slider, banner gibi içerikler sitenize yüklenir.

NOT : Tema değişikliği işlemi yapıldığında kategori, ürün, içerik yönetimi gibi alanlar silinmez. Kullandığınız temaya özel, farklı gösterimler olabilir.

Tema aktifleştirme işlemini tamamladığınızda Tema Yönetimi sayfasında "Aktif Tema" alanında Sahaf teması gelecektir. Düzenlemeleri yapmak için "Özelleştir" butonuna tıklayınız.

TEMA ÖZELLEŞTİRME - BLOK YÖNETİMİ

Sahaf temanızı aktifleştirdikten sonra anasayfa ve diğer saylarda yer alan sitenize özel içeriklerin olduğu bloklarda düzenleme sağlamalısınız.

Header Bar : Sahaf temasında en üstte yer alan kargo, indirim, kampanya gibi duyurularınızı gösterebileceğiniz html blok alanıdır.

Html Blok makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Html Blok - Header Bar" bloğunun veya önizleme görünümünde bar alanında bulunan düzenleme kalemine tıklayınız.

Header Bar düzenleme penceresinde "İçerik Listesi" içerisinde standart olarak eklenen içerik yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel olarak güncelleyebilir veya sil butonu ile ekli içeriği silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

İçerik düzenleme penceresinde ekli içeriği, içerik başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Üst Kısım : Sitenizde ziyaretçileri ürün, kategori, marka, tanıtım sayfaları gibi yönlendirmeleri üst kısımdan yapabilirsiniz. Ziyaretçilerin aradıkları ürüne, sayfaya ulaşmalarının kolay olması satış oranınızı da etkileyecektir.

Sahaf temasında header menü, sosyal medya ve ana menü alanları üst kısımda yer almaktadır.

sahaf46.png (827 KB)

Sahaf temasının üst kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Top Menü : Sahaf temasında sol üst köşede link menü linklendirmesi yapabilirsiniz. İletişim, blog, markalar gibi ana kategori arasında göstermek istemediğiniz linkleri bu alanda kullanabilirsiniz.

Menüler sayfasında yer alan "Top Menü" üst kısım top menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız. Top menü içerisine girildiğinde top alanında ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız. Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini girebilirsiniz.

Sosyal Medya İkonları : Sahaf temasında sosyal medya hesaplarınızı üst kısımda gösterebilirsiniz. Sitenize sosyal medya hesaplarınızı tanımlayarak genel etkileşiminizi artırabilirsiniz.

Menüler sayfasında yer alan "Sosyal Medya İkonları" üst kısıma sosyal medya hesaplarınızın linklerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız. Sosyal medya ikonları içerisine girildiğinde üst kısımda ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız. Düzenleme penceresinde sosyal medya ismi, linki, sıralama, sosyal medya görseli gibi bilgilerini girebilirsiniz.

Masaüstü Menü : Sahaf temasında üst kısımda kategorilere, ürünlere ve diğer sayfalarınıza kolay ve hızlı erişim için menü linklendirmesi yapabilirsiniz. Ana kategorilerinizi ekleyerek açılır menü içerisinde alt kategori kırılımlarını gösterebilirsiniz.

Menüler sayfasında yer alan "Masaüstü Menü" üst kısım ana menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız. Masaüstü menü içerisine girildiğinde ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız. Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini girebilirsiniz.

Sahaf temasında menülerde görsel ekleyebilirsiniz. Eklediğiniz görseller açılır menü içerisinde gösterilecektir.

NOT : Masaüstü menüde kategori görselleri iki alandan gelebilmektedir. Eğer menüye eklenen kategorinin "Kategoriler" sayfasında ekli görseli varsa o gelir. Kategoriler sayfasında görsel yok ise "Menüler" sayfasından eklenen görsel siteye yansır.

sahaf55.png (98 KB)

sahaf56.png (391 KB)

Slider : Anasayfanızda dikkat çekecek görseller yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Slider" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Sahaf temasında slider altında kullanılan küçük görselleri de (thumbnail) resim düzenleme penceresinde "Gelişmiş Ayarlar > Resim 2" alanından yüklemelisiniz.

Sahaf teması slider için örnek büyük görsel boyutları en az 1170x470 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

Sahaf teması slider için örnek küçük (thumbnail) görsel boyutları en az 100x60 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

Romanlar / Sınav Kitapları : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Romanlar veya Sınav Kitapları bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Romanlar/Sınav Kitapları" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, koleksiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

2'li Banner : Sahaf temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "2'li Banner" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

sahaf21.png (678 KB)

2'li banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

sahaf22.png (452 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Sahaf teması 2'li banner bloğu için ALL ve SM seçenekleri 12 olmalıdır. 12 yapıldığında mobil cihazlarda görseller alt alta gelecektir. Diğer ekran seçenekleri için yanyana iki görsel görüntülenebilmesi için 6 yazılmalıdır.

Sahaf teması 2'li banner için örnek görsel boyutları en az 570x250 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

sahaf23.png (288 KB)

3'lü Banner : Sahaf temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "3'lü Banner" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

sahaf24.png (704 KB)

3'lü banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

sahaf25.png (423 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Sahaf teması 3'lü banner bloğu için ALL ve SM seçenekleri 12 olmalıdır. 12 yapıldığında mobil cihazlarda görseller alt alta gelecektir. Diğer ekran seçenekleri için yanyana üç görsel görüntülenebilmesi için 4 yazılmalıdır.

Sahaf teması 3'lü banner için örnek görsel boyutları en az 370x290 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

sahaf26.png (209 KB)

Fırsat Ürünleri : Sahaf temasında anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Fırsat ürünleri bloğu seçtiğiniz ürünleri büyük ölçekli olarak göstererek müşterilerin dikkatini çekmesini sağlar.

Fırsat ürün/ürünlerini göstermek için koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Fırsat Ürünleri bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Fırsat Ürünleri" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

Yeni Gelenler - Çok Satanlar - İndirimdekiler : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Romanlar veya Sınav Kitapları bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Yeni Gelenler - Çok Satanlar - İndirimdekiler" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

sahaf30.png (497 KB)

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Sahaf temasında bu alandaki gibi yanyana vitrin bloğu göstermek için "Yeni" butonunu kullanarak ekleme yapmalısınız. Eklediğiniz her vitrin blokta yanyana eklenecektir.

sahaf31.png (331 KB)

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

sahaf32.png (121 KB)

Html Blok - Kargo Ücretsiz : Sahaf temasında anasayfa içerisinde yer alan kargo, indirim, kampanya gibi duyurularınızı gösterebileceğiniz html blok alanıdır.

Html Blok makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Html Blok - Kargo Ücretsiz" bloğunun veya önizleme görünümünde bar alanında bulunan düzenleme kalemine tıklayınız.

sahaf33.png (407 KB)

Kargo Ücretsiz düzenleme penceresinde "İçerik Listesi" içerisinde standart olarak eklenen içerik yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel olarak güncelleyebilir veya sil butonu ile ekli içeriği silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

sahaf34.png (206 KB)

İçerik düzenleme penceresinde ekli içeriği, içerik başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

sahaf35.png (112 KB)

Blog Son Eklenenler : Sahaf temasında anasayfada blog yazılarınızı görüntüleyebilir, blog detayına yönlendirmesini sağlayabilirsiniz.

Blog Son Eklenenler bloğu standart bir bloktur. Blog metinlerinizin eklenme tarihine göre anasayfada listelenmesini sağlar.

Blog Yönetimi makalemizi incelemek için tıklayınız.

sahaf36.png (246 KB)

Alt Kısım : Sahaf temasının alt kısmında yönlendirme yapmak istediğiniz sayfalar için kategorilendirme ve adres bilgilerinizi gösterebilirsiniz.

sahaf39.png (97 KB)

- Alt Menü : Sahaf temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Menüler sayfasında yer alan "Footer Menü" alt kısım menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

sahaf40.png (61 KB)

Footer menü içerisine girildiğinde alt kısımda linklerin bağlı olacağı kategoriler eklenmelidir.

Ekli kategorileri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Düzenleme yapmak için ilgili kategorinin üstüne tıklayınız.

sahaf41.png (55 KB)

Alt menü kategorilerinin içine girdiğinizde görüntülenecek menü linklerinin eklemesini yapabilirsiniz.

Ekli olan linkleri düzenleyebilir veya yeni ekleme yapabilirsiniz.

sahaf44.png (64 KB)

sahaf43.png (69 KB)

- Adres & İletişim : Sitenizin alt kısmında ziyaretçilerin size ulaşabilmeleri sağlamak için adres ve telefon bilgisi ekleyebilirsiniz.

Adres ve telefon bilgisi eklemek için "Ayarlar > Genel Ayarlar" sayfasında yer alan "Firma Adres" ve "Telefon No" ayarlarınızı düzenleyebilirsiniz.

sahaf45.png (50 KB)

İletişim Bilgileri : E-ticaret sitenizin iletişim sayfasında ziyaretçilerin size ulaşabilmelerini sağlayacak bilgiler ekleyebilirsiniz.

İletişim bilgilerinizi düzenlemek için "Tasarım > Tema Yönetimi > Özelleştirme > Gelişmiş > Blok Yönetimi > İletişim" sayfasına tıklayınız ve "İletişim Bilgileri" bloğunun düzenleme penceresini açınız.

sahaf58.png (81 KB)

Blok düzenleme sayfasında "Ayarlar" içeriğinden iletişim sayfasında görünmesini istediğiniz bilgileri ekleyebilirsiniz.

Boş bıraktığınız alanlar siteye yansımayacaktır.

sahaf59.png (110 KB)

sahaf60.png (374 KB)

TEMA DÜZENLEME

Tema düzenleme, bir web sitesinin görünümünü ve işlevselliğini değiştirmek için kullanılan bir işlemdir.

Bir web sitesinin temasını düzenlemek, renk şemalarını, yazı tipi stillerini, arka plan görüntülerini ve genel düzeni değiştirerek sitenin görünümünü ve hissini güncelleyebilir.

Ayrıca, tema düzenleme işlemi, bir web sitesinin işlevselliğini değiştirmek için kullanılan özel eklentiler ve kodlar eklemeyi de içerebilir. Bu sayede, bir web sitesinin kullanıcı deneyimi geliştirilebilir ve belirli bir amaca daha uygun hale getirilebilir.

V5 sistemi ile tema düzenleme işlemleri hızlı ve kolay şekilde yönetebilirsiniz.

Tema Düzenleme makalemizi incelemek için tıklayınız.

Yönetim panelinde "Tasarım > Tema Yönetimi" sayfasında yer alan "Tema Düzenleme" ikonuna tıklayınız.

sahaf67.png (832 KB)

1. Site Düzeni

Site düzeni, bir web sitesindeki içeriğin nasıl düzenlendiğini, yerleştirildiğini ve sunulduğunu tanımlayan bir kavramdır.

Temadaki sütun (grid) yapısı, boşluk yapıları, yükseklik değerleri gibi özelliklere site düzeni alanından müdahale edilebilmektedir.

Bu alanda yaptığınız değişiklikler temaya uygun değilse görünümde bozulmalar yaşanacaktır.

NOT : T-Soft standart temalarda 12'li grid sistemi kullanılmaktadır. Bu sistem, web sayfasını 12 eşit sütuna ayırarak, sayfadaki içeriği bu sütunlara yerleştirmeyi kolaylaştırır. Kodlama bilginiz bulunmuyor ise bu değerlere müdahale etmemenizi öneririz.

sahaf61.png (840 KB)

2. Font Seçimi

Font seçimi ve düzenleme, web tasarımının önemli bir parçasıdır. Doğru font seçimi, web sitesinin amacına ve hedef kitlesine uygun olarak belirlenmelidir.

Font büyüklükleri, renkleri ve stilleri de düzenlenerek içeriğin okunaklığı artırılabilir.

Font seçimi özelliğimiz ile sitede kullanmak istediğiniz fontu seçebilir, font büyüklüğünü belirleyebilir, sitenizde bulunan tüm yazı alanlarının renklerini istediğiniz gibi değiştirebilirsiniz.

sahaf62.png (847 KB)

3. Renk Düzeni

Renk düzeni, web tasarımında kullanılan renklerin seçimini ve kombinasyonunu tanımlayan bir kavramdır.

Doğru renk düzeni, web sitesinin görünümünü ve hissiyatını geliştirerek, kullanıcıların web sitesindeki deneyimini artırır.

Tema düzenleme sayfasında sitenizin arka plan renklerine ait genel renk düzenini belirleyebilirsiniz.

sahaf63.png (844 KB)

4. Buton Düzeni

Butonlar, kullanıcılara web sitesinde belirli işlevleri gerçekleştirme olanağı sağlarlar, örneğin bir bağlantıya tıklama, bir formu gönderme veya bir işlemi onaylama gibi.

Butonların şekli, boyutu, rengi ve yeri, web sitesinin tasarımında önemli bir rol oynar.

Butonlarda, kullanıcıların butonları fark etmelerini sağlayacak etkileyici ve dikkat çekici renkleri kullanabilirsiniz.

sahaf64.png (844 KB)

5. Çerçeve Düzeni

Web sitesinin sayfa düzeni, içeriklerin yerleştirildiği ve görüntülendiği alanları tanımlayan çerçevelerle oluşturulur.

Çerçeve düzeni, web sitesinin okunabilirliğini ve kullanılabilirliğini artırarak, kullanıcıların web sitesinde gezinme deneyimini iyileştirir.

Temanızda çerçeve kullanılan alanlarda, çerçeve rengini ve kenar ovalliğini düzenleyebilirsiniz.

sahaf65.png (849 KB)

NOT : Tema düzenleme sayfasında yaptığınız değişikliklerden sonra üstte çıkan "Kaydet" butonuna tıklamalısınız.

sahaf68.png (854 KB)

NOT : Tema özelleştirme ve düzenleme işlemlerinden sonra işlemin siteye yansıması, görünümün düzgün olması için "Scss Dönüştürme" ve "Ön Bellek Temizle" işlemi yapılmalıdır.

Scss dönüştürme için "Tasarım > Tema Yönetimi > Gelişmiş > Blok Yönetimi" sayfasında bulunan "SCSS" butonuna tıklamalısınız.

Daha sonra üst menüde yer alan "Ön Bellek Temizle" butonuna tıklayarak yaptığınız işlemi sitede kontrol edebilirsiniz.

Bazı işlemlerde ek olarak site önyüzünde "CTRL+F5" yapıldıktan sonra kontrol edilmelidir.

sahaf70.png (84 KB)

sahaf71.png (132 KB)

Question 11

V5 VESTİ TEMASI KURULUMU

Accepted Answer

E-ticaret sitenizde V5 sistem altyapısı ile aynı anda birden fazla tema yükleyebilir ve aktif ederek kullanabilirsiniz.

T-Soft V5 sistemi aracılığıyla, çeşitli demo seçenekleri ile dakikalar içinde şık ve profesyonel bir web sitesi oluşturmak oldukça kolay hale gelmiştir.

Vesti tema, giyim sektörüne odaklanan bir temadır ve tüm giyim detaylarını içerir. Bu tema, moda ürünlerini (giyim, ayakkabı ve aksesuarlar gibi) sergilemek için idealdir.

Tamamen özelleştirilebilir olan Vesti teması, renkleri, yazı tiplerini, üstbilgi ve altbilgiyi, düzeni ve diğer tasarım öğelerini, içerik ve görüntüleri ayarlayarak siteyi kişiselleştirmenizi sağlar.

Vesti teması, siteyi ciddi, enerjik, resmi, çocuksu, rahat veya eğlenceli gibi farklı tarzlarda tasarlamanıza olanak tanır. Bu tema sayesinde hayal ettiğiniz görünüme sahip bir web sitesi oluşturabilirsiniz. Profesyonel kodları sayesinde Vesti teması, hızlı erişim özelliğiyle de dikkat çeker.

Vesti teması, talep yoğunluğunun yüksek olduğu kategorilerde kullanılarak ürün görünürlüğünü artırır ve kullanıcılara mükemmel bir alışveriş deneyimi sunar.

Mobil uyumlu ve seo destekli temamızı sizlerde kendi firmanıza uygun özelleştirerek, kolayca uygulayabilirsiniz.

Vesti teması canlı önizleme demosunu incelemek için https://tsoftthemes.com/vesti linkinden erişim sağlayabilirsiniz.

V5 altyapılı sitenizde Vesti temasını kurmak için aşağıdaki adımları uygulabilirsiniz.

E-ticaret sitenizin paneline www.tsoftpanel.com adresinden giriş yapınız.

Yönetim panelinde tema yükle, aktifleştirme, düzenleme vb işlemler için "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

Tema yüklemek için "Tema Yönetimi" sayfasında yer alan "Tema Marketine Git" butonuna tıklayınız.

vesti1.png (152 KB)

Tema marketi içerisinde sitenize yükleyerek kullanabileceğiniz ücretli ve ücretsiz temalar yer almaktadır.

Vesti temasını yüklemek için üstüne tıklayınız.

vesti2.png (396 KB)

Tema detay sayfasında "Yükle" butonuna tıklayarak Vesti temasının yüklü temalar listenize gelmesini sağlayabilirsiniz.

vesti4.png (264 KB)

Temanız yüklendiğinde güncel tema versiyonu ile birlikte yüklenecektir ve tema sayfasında "Güncelsiniz" seçeneği görünecektir.

Temanızın güncel olmaması durumunda bu alanda "Güncelle" butonu yer alacaktır.

Güncelle butonunu kullanarak temada yapılan güncellemeleri uygulayabilirsiniz. Tema güncelleme işlemi sistem güncelleme işlemi ile aynı değildir. Tema güncelleme yalnızca tema dosyasında yapılan güncellemeleri ilgili temaya yükler.

Tema Güncelleme makalemizi incelemek için tıklayınız.

vesti5.png (196 KB)

Tema yüklerken aşağıdaki ekran resmindeki hatayı almanız durumunda "Bölümler > Destek" sayfasından departmanı "T-Soft Apps" seçerek talep oluşturabilirsiniz. İlgili ekip düzenleme sağladıktan sonra temanızı sorunsuz olarak yükleyebilirsiniz.

vesti6.png (183 KB)

Tema yükleme işlemi tamamlandığında başarılı bilgisi için popup gelecektir.

"Tema Düzenleyiciye Git" butonu ile tema yönetimi sayfasına geçebilirsiniz.

vesti7.png (201 KB)

Yüklediğiniz Vesti teması Tema Yönetimi sayfasında listelenecektir.

Tema üzerine geldiğinizde işlem yapabileceğiniz butonlar yer almaktadır.

vesti8.png (204 KB)

1. Önizleme : Vesti temasının standart görünümünü örnek site üzerinden aktif etmeden önizleme ile görmenizi sağlar.

vesti9.png (1.08 MB)

2. Aktifleştir : Vesti temasını sitenizde aktif ederek kullanmanızı sağlar. Tıkladığınızda aktifleştirme için iki seçenek sunulmaktadır.

1. Seçenek : "Temayı Aktifleştir" seçeneği ile temayı aktifleştirdiğinizde daha önce eklediğiniz slider, banner ve diğer içerikleriniz var ise içerikler silinmeden tema ve şablonlarda değişiklik sağlar. Tema değiştirildiğinde tüm özel şablonlarınızın da default seçilmesine neden olur. Sitenizdeki içerikler aynı kalır, sitenin görünümü ve çalışma şekli etkilenebilir. Örnek olarak anasayfanıza önceki temaya ait banner, slider görsellerinizi eklediniz. Tema marketinde beğendiğiniz farklı temalara geçiş yapmak istediğinizde, "Temayı Aktifleştir" seçeneğini kullanarak bir önceki temanıza ait slider, banner gibi içerikler aktifleştirdiğiniz temanıza aktarılmış olur.

vesti10.png (168 KB)

2. Seçenek : "Temayı Aktifleştir ve İçerikleri Aktar" seçeneği ile temayı aktifleştirdiğinizde, daha önce eklemiş olduğunuz slider, banner gibi düzenlemeler mevcut ise, tema değişiminde yaptığınız tüm işlemler silinir. Yeni tema yükleme işleminde, yüklenen tema konseptine ait slider, banner gibi içerikler sitenize yüklenir.

NOT : Tema değişikliği işlemi yapıldığında kategori, ürün, içerik yönetimi gibi alanlar silinmez. Kullandığınız temaya özel, farklı gösterimler olabilir.

vesti11.png (168 KB)

Tema aktifleştirme işlemini tamamladığınızda Tema Yönetimi sayfasında "Aktif Tema" alanında Vesti teması gelecektir.

Düzenlemeleri yapmak için "Özelleştir" butonuna tıklayınız.

vesti12.png (240 KB)

TEMA ÖZELLEŞTİRME - BLOK YÖNETİMİ

Vesti temanızı aktifleştirdikten sonra anasayfa ve diğer saylarda yer alan sitenize özel içeriklerin olduğu bloklarda düzenleme sağlamalısınız.

Üst Kısım : Sitenizde ziyaretçileri ürün, kategori, marka, tanıtım sayfaları gibi yönlendirmeleri üst kısımdan yapabilirsiniz. Ziyaretçilerin aradıkları ürüne, sayfaya ulaşmalarının kolay olması satış oranınızı da etkileyecektir.

Vesti temasında ana menü alanı üst kısımda yer almaktadır.

vesti13.png (1.16 MB)

Vesti temasının üst kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Masaüstü Menü : Vesti temasında üst kısımda kategorilere, ürünlere ve diğer sayfalarınıza kolay ve hızlı erişim için menü linklendirmesi yapabilirsiniz. Ana kategorilerinizi ekleyerek açılır menü içerisinde alt kategori kırılımlarını gösterebilirsiniz.

Menüler sayfasında yer alan "Masaüstü Menü" üst kısım ana menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

vesti14.png (61 KB)

Masaüstü menü içerisine girildiğinde ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

vesti15.png (77 KB)

Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini ekleyebilirsiniz.

Vesti temasında ana kategori menüsüne görsel ekleyebilirsiniz. Eklediğiniz görseller açılır menü içerisinde gösterilecektir.

vesti16.png (205 KB)

NOT : Masaüstü menüde kategori görselleri iki alandan gelebilmektedir. Eğer menüye eklenen kategorinin "Kategoriler" sayfasında ekli görseli varsa o gelir. Kategoriler sayfasında görsel yok ise "Menüler" sayfasından eklenen görsel siteye yansır.

NOT : Vesti Temasında alt kategoriler içinde menüye görsel eklenebilmektedir. Alt kategorilerin menü görseli "Kategoriler" sayfasından gelmektedir.

vesti17.png (134 KB)

vesti18.png (570 KB)

Slider : Anasayfanızda dikkat çekecek görseller yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Slider" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

vesti19.png (934 KB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

vesti20.png (790 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Vesti teması slider için örnek görsel boyutları en az 1920x700 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

vesti21.png (447 KB)

Öne Çıkan Kategoriler Slider : Slider bloğu kullanılarak görseller ile kategori linklendirmesi yapabilirsiniz.

Öne çıkarmak istediğiniz kategoriler, ürünler, sayfalar vb. içeriklere ait görseller ekleyebilir, yönlendirme linkleri tanımlayabilirsiniz.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Slider" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

vesti42.png (1.04 MB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

vesti23.png (874 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Vesti teması öne çıkan kategoriler slider için örnek görsel boyutları en az 245x365 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

Öne çıkan kategoriler slider bloğunda görsellerin yanyana görünmesi için "Slide Adedi" ve "Kenar Boşluğu" ayarlarının düzenlenmesi gerekmektedir.

- Slide Adedi : Slider bloklarında eklenen görsellerin yanyana görünme durumlarını "Slide Adedi" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

- Kenar Boşluğu : Yanyana görüntülenecek görsellerin arasındaki boşluk değerlerini belirleyebilirsiniz. Ekran boyutlarına göre farklı boşluk oranları girebilirsiniz.

Vesti teması öne çıkan kategoriler bloğu için slide adedi ve kenar boşluğu ayarlarını aşağıdaki ekran resmini referans alarak düzenleyebilrisiniz.

vesti24.png (831 KB)

Tekli Banner : Vesti temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Tekli Banner" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

vesti28.png (1.01 MB)

Tekli banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

vesti29.png (743 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Vesti teması tekli banner bloğu için tüm sütun genişliği değerleri 12 olmalıdır.

Vesti teması tekli banner için örnek görsel boyutları en az 1170x350 olmalıdır.

vesti30.png (416 KB)

Çok Satanlar : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Vitrin ürünleri bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Vitrin Ürünleri" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

vesti31.png (1.04 MB)

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

vesti32.png (776 KB)

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

vesti33.png (279 KB)

Banner & İçerik : Vesti temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Banner & İçerik" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

vesti46.png (735 KB)

Tekli banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

vesti35.png (1.02 MB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Vesti teması banner & içerik bloğu için tüm sütun genişliği değerleri 12 olmalıdır.

Vesti teması tekli banner için örnek görsel boyutları en az 572x450 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

vesti36.png (574 KB)

Banner & İçerik bloğuna eklenen görsel yanına yazı eklenebilmektedir.

Görsel düzenleme penceresinde "Gelişmiş Ayarlar" alanından metinleri düzenleyebilirsiniz.

vesti37.png (562 KB)

Yeni Gelenler & İndirimdeki Ürünler : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Yeni Gelenler ve İndirimdeki Ürünler bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Yeni Gelenler & İndirimdeki Ürünler" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

vesti38.png (1003 KB)

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Vesti temasında bu alandaki gibi yanyana vitrin bloğu göstermek için "Yeni" butonunu kullanarak ekleme yapmalısınız. Eklediğiniz her vitrin blokta yanyana eklenecektir.

vesti39.png (560 KB)

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

vesti40.png (224 KB)

2'li Banner : Vesti temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "2'li Banner" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

vesti47.png (1.05 MB)

2'li banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

vesti48.png (616 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Vesti teması 2'li banner bloğu için ALL ve SM seçenekleri 12 olmalıdır. 12 yapıldığında mobil cihazlarda görseller alt alta gelecektir. Diğer ekran seçenekleri için yanyana iki görsel görüntülenebilmesi için 6 yazılmalıdır.

Vesti teması 2'li banner için örnek görsel boyutları en az 570x570 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

vesti49.png (369 KB)

Blog Son Eklenenler : Vesti temasında anasayfada blog yazılarınızı görüntüleyebilir, blog detayına yönlendirmesini sağlayabilirsiniz.

Blog Son Eklenenler bloğu standart bir bloktur. Blog metinlerinizin eklenme tarihine göre anasayfada listelenmesini sağlar.

Blog Yönetimi makalemizi incelemek için tıklayınız.

vesti41.png (478 KB)

Alt Kısım : Vesti temasının alt kısmında yönlendirme yapmak istediğiniz sayfalar için kategorilendirme ve adres bilgilerinizi gösterebilirsiniz.

Vesti temasında sosyal medya ikonları ve alt menü yapılandırması alt kısımda yer almaktadır.

Vesti temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

vesti51.png (117 KB)

Sosyal Medya : Vesti temasında sosyal medya hesaplarınızı alt kısımda gösterebilirsiniz. Sitenize sosyal medya hesaplarınızı tanımlayarak genel etkileşiminizi artırabilirsiniz.

Menüler sayfasında yer alan "Sosyal Medya İkonları" üst kısıma sosyal medya hesaplarınızın linklerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

vesti52.png (61 KB)

Sosyal medya ikonları içerisine girildiğinde üst kısımda ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

vesti53.png (63 KB)

Düzenleme penceresinde sosyal medya ismi, linki, sıralama, sosyal medya görseli gibi bilgilerini girebilirsiniz.

vesti54.png (69 KB)

- Alt Menü : Vesti temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Menüler sayfasında yer alan "Footer Menü" alt kısım menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

vesti55.png (61 KB)

Footer menü içerisine girildiğinde alt kısımda linklerin bağlı olacağı kategoriler eklenmelidir.

Ekli kategorileri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Düzenleme yapmak için ilgili kategorinin üstüne tıklayınız.

vesti56.png (55 KB)

Alt menü kategorilerinin içine girdiğinizde görüntülenecek menü linklerinin eklemesini yapabilirsiniz.

Ekli olan linkleri düzenleyebilir veya yeni ekleme yapabilirsiniz.

vesti57.png (64 KB)

vesti58.png (69 KB)

- Adres & İletişim : Sitenizin alt kısmında ziyaretçilerin size ulaşabilmeleri sağlamak için adres ve telefon bilgisi ekleyebilirsiniz.

Adres ve telefon bilgisi eklemek için "Ayarlar > Genel Ayarlar" sayfasında yer alan "Firma Adres" ve "Telefon No" ayarlarınızı düzenleyebilirsiniz.

vesti59.png (53 KB)

İletişim Bilgileri : E-ticaret sitenizin iletişim sayfasında ziyaretçilerin size ulaşabilmelerini sağlayacak bilgiler ekleyebilirsiniz.

İletişim bilgilerinizi düzenlemek için "Tasarım > Tema Yönetimi > Özelleştirme > Gelişmiş > Blok Yönetimi > İletişim" sayfasına tıklayınız ve "İletişim Bilgileri" bloğunun düzenleme penceresini açınız.

vesti60.png (81 KB)

Blok düzenleme sayfasında "Ayarlar" içeriğinden iletişim sayfasında görünmesini istediğiniz bilgileri ekleyebilirsiniz.

Boş bıraktığınız alanlar siteye yansımayacaktır.

vesti61.png (91 KB)

vesti62.png (96 KB)

TEMA DÜZENLEME

Tema düzenleme, bir web sitesinin görünümünü ve işlevselliğini değiştirmek için kullanılan bir işlemdir.

Bir web sitesinin temasını düzenlemek, renk şemalarını, yazı tipi stillerini, arka plan görüntülerini ve genel düzeni değiştirerek sitenin görünümünü ve hissini güncelleyebilir.

Ayrıca, tema düzenleme işlemi, bir web sitesinin işlevselliğini değiştirmek için kullanılan özel eklentiler ve kodlar eklemeyi de içerebilir. Bu sayede, bir web sitesinin kullanıcı deneyimi geliştirilebilir ve belirli bir amaca daha uygun hale getirilebilir.

V5 sistemi ile tema düzenleme işlemleri hızlı ve kolay şekilde yönetebilirsiniz.

Tema Düzenleme makalemizi incelemek için tıklayınız.

Yönetim panelinde "Tasarım > Tema Yönetimi" sayfasında yer alan "Tema Düzenleme" ikonuna tıklayınız.

vesti63.png (946 KB)

1. Site Düzeni

Site düzeni, bir web sitesindeki içeriğin nasıl düzenlendiğini, yerleştirildiğini ve sunulduğunu tanımlayan bir kavramdır.

Temadaki sütun (grid) yapısı, boşluk yapıları, yükseklik değerleri gibi özelliklere site düzeni alanından müdahale edilebilmektedir.

Bu alanda yaptığınız değişiklikler temaya uygun değilse görünümde bozulmalar yaşanacaktır.

NOT : T-Soft standart temalarda 12'li grid sistemi kullanılmaktadır. Bu sistem, web sayfasını 12 eşit sütuna ayırarak, sayfadaki içeriği bu sütunlara yerleştirmeyi kolaylaştırır. Kodlama bilginiz bulunmuyor ise bu değerlere müdahale etmemenizi öneririz.

vesti64.png (940 KB)

2. Font Seçimi

Font seçimi ve düzenleme, web tasarımının önemli bir parçasıdır. Doğru font seçimi, web sitesinin amacına ve hedef kitlesine uygun olarak belirlenmelidir.

Font büyüklükleri, renkleri ve stilleri de düzenlenerek içeriğin okunaklığı artırılabilir.

Font seçimi özelliğimiz ile sitede kullanmak istediğiniz fontu seçebilir, font büyüklüğünü belirleyebilir, sitenizde bulunan tüm yazı alanlarının renklerini istediğiniz gibi değiştirebilirsiniz.

vesti65.png (952 KB)

3. Renk Düzeni

Renk düzeni, web tasarımında kullanılan renklerin seçimini ve kombinasyonunu tanımlayan bir kavramdır.

Doğru renk düzeni, web sitesinin görünümünü ve hissiyatını geliştirerek, kullanıcıların web sitesindeki deneyimini artırır.

Tema düzenleme sayfasında sitenizin arka plan renklerine ait genel renk düzenini belirleyebilirsiniz.

vesti66.png (948 KB)

4. Buton Düzeni

Butonlar, kullanıcılara web sitesinde belirli işlevleri gerçekleştirme olanağı sağlarlar, örneğin bir bağlantıya tıklama, bir formu gönderme veya bir işlemi onaylama gibi.

Butonların şekli, boyutu, rengi ve yeri, web sitesinin tasarımında önemli bir rol oynar.

Butonlarda, kullanıcıların butonları fark etmelerini sağlayacak etkileyici ve dikkat çekici renkleri kullanabilirsiniz.

vesti67.png (948 KB)

5. Çerçeve Düzeni

Web sitesinin sayfa düzeni, içeriklerin yerleştirildiği ve görüntülendiği alanları tanımlayan çerçevelerle oluşturulur.

Çerçeve düzeni, web sitesinin okunabilirliğini ve kullanılabilirliğini artırarak, kullanıcıların web sitesinde gezinme deneyimini iyileştirir.

Temanızda çerçeve kullanılan alanlarda, çerçeve rengini ve kenar ovalliğini düzenleyebilirsiniz.

vesti68.png (950 KB)

NOT : Tema düzenleme sayfasında yaptığınız değişikliklerden sonra üstte çıkan "Kaydet" butonuna tıklamalısınız.

vesti70.png (953 KB)

NOT : Tema özelleştirme ve düzenleme işlemlerinden sonra işlemin siteye yansıması, görünümün düzgün olması için "Scss Dönüştürme" ve "Ön Bellek Temizle" işlemi yapılmalıdır.

Scss dönüştürme için "Tasarım > Tema Yönetimi > Gelişmiş > Blok Yönetimi" sayfasında bulunan "SCSS" butonuna tıklamalısınız.

Daha sonra üst menüde yer alan "Ön Bellek Temizle" butonuna tıklayarak yaptığınız işlemi sitede kontrol edebilirsiniz.

Bazı işlemlerde ek olarak site önyüzünde "CTRL+F5" yapıldıktan sonra kontrol edilmelidir.

vesti71.png (82 KB)

vesti72.png (131 KB)

Question 12

V5 PETBOUTIQ TEMASI KURULUMU

Accepted Answer

E-ticaret sitenizde V5 sistem altyapısı ile aynı anda birden fazla tema yükleyebilir ve aktif ederek kullanabilirsiniz.

T-Soft V5 sistemi aracılığıyla, çeşitli demo seçenekleri ile dakikalar içinde şık ve profesyonel bir web sitesi oluşturmak oldukça kolay hale gelmiştir.

Petboutiq, ürün odaklı bir tema olarak tasarlanmıştır ve mobil uyumlu, SEO dostu özelliklere sahiptir.

Petboutiq teması ile sitenizi oluştururken yaptığınız değişiklikleri anında görebileceğiniz harika bir görsel editöre sahiptir.

Petboutiq teması, online satış için ihtiyaç duyulan ürün çeşitliliği ile birlikte, hayvan dostlarımıza yönelik tüm hassasiyetleri göz önünde bulundurur.

Mutlu ve sağlıklı dostlarımızın hep yanımızda olmasını sağlayan profesyonel görünümlü hızlı yüklenen web siteleri oluşturmanıza olanak tanır.

Mobil uyumlu ve seo destekli temamızı sizlerde kendi firmanıza uygun özelleştirerek, kolayca uygulayabilirsiniz.

Petboutiq teması canlı önizleme demosunu incelemek için https://tsoftthemes.com/petboutiq linkinden erişim sağlayabilirsiniz.

V5 altyapılı sitenizde Petboutiq temasını kurmak için aşağıdaki adımları uygulabilirsiniz.

E-ticaret sitenizin paneline www.tsoftpanel.com adresinden giriş yapınız.

Yönetim panelinde tema yükle, aktifleştirme, düzenleme vb işlemler için "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

Tema yüklemek için "Tema Yönetimi" sayfasında yer alan "Tema Marketine Git" butonuna tıklayınız.

petboutiq1.png (151 KB)

Tema marketi içerisinde sitenize yükleyerek kullanabileceğiniz ücretli ve ücretsiz temalar yer almaktadır.

Petboutiq temasını yüklemek için üstüne tıklayınız.

petboutiq2.png (421 KB)

Tema detay sayfasında "Yükle" butonuna tıklayarak Petboutiq temasının yüklü temalar listenize gelmesini sağlayabilirsiniz.

petboutiq3.png (242 KB)

Temanız yüklendiğinde güncel tema versiyonu ile birlikte yüklenecektir ve tema sayfasında "Güncelsiniz" seçeneği görünecektir.

Temanızın güncel olmaması durumunda bu alanda "Güncelle" butonu yer alacaktır.

Güncelle butonunu kullanarak temada yapılan güncellemeleri uygulayabilirsiniz. Tema güncelleme işlemi sistem güncelleme işlemi ile aynı değildir. Tema güncelleme yalnızca tema dosyasında yapılan güncellemeleri ilgili temaya yükler.

Tema Güncelleme makalemizi incelemek için tıklayınız.

petboutiq4.png (186 KB)

Tema yüklerken aşağıdaki ekran resmindeki hatayı almanız durumunda "Bölümler > Destek" sayfasından departmanı "T-Soft Apps" seçerek talep oluşturabilirsiniz. İlgili ekip düzenleme sağladıktan sonra temanızı sorunsuz olarak yükleyebilirsiniz.

petboutiq5.png (176 KB)

Tema yükleme işlemi tamamlandığında başarılı bilgisi için popup gelecektir.

"Tema Düzenleyiciye Git" butonu ile tema yönetimi sayfasına geçebilirsiniz.

petboutiq6.png (192 KB)

Yüklediğiniz Petboutiq teması Tema Yönetimi sayfasında listelenecektir.

Tema üzerine geldiğinizde işlem yapabileceğiniz butonlar yer almaktadır.

petboutiq7.png (189 KB)

1. Önizleme : Petboutiq temasının standart görünümünü örnek site üzerinden aktif etmeden önizleme ile görmenizi sağlar.

petboutiq8.png (997 KB)

2. Aktifleştir : Petboutiq temasını sitenizde aktif ederek kullanmanızı sağlar. Tıkladığınızda aktifleştirme için iki seçenek sunulmaktadır.

1. Seçenek : "Temayı Aktifleştir" seçeneği ile temayı aktifleştirdiğinizde daha önce eklediğiniz slider, banner ve diğer içerikleriniz var ise içerikler silinmeden tema ve şablonlarda değişiklik sağlar. Tema değiştirildiğinde tüm özel şablonlarınızın da default seçilmesine neden olur. Sitenizdeki içerikler aynı kalır, sitenin görünümü ve çalışma şekli etkilenebilir. Örnek olarak anasayfanıza önceki temaya ait banner, slider görsellerinizi eklediniz. Tema marketinde beğendiğiniz farklı temalara geçiş yapmak istediğinizde, "Temayı Aktifleştir" seçeneğini kullanarak bir önceki temanıza ait slider, banner gibi içerikler aktifleştirdiğiniz temanıza aktarılmış olur.

petboutiq9.png (159 KB)

2. Seçenek : "Temayı Aktifleştir ve İçerikleri Aktar" seçeneği ile temayı aktifleştirdiğinizde, daha önce eklemiş olduğunuz slider, banner gibi düzenlemeler mevcut ise, tema değişiminde yaptığınız tüm işlemler silinir. Yeni tema yükleme işleminde, yüklenen tema konseptine ait slider, banner gibi içerikler sitenize yüklenir.

NOT : Tema değişikliği işlemi yapıldığında kategori, ürün, içerik yönetimi gibi alanlar silinmez. Kullandığınız temaya özel, farklı gösterimler olabilir.

petboutiq10.png (159 KB)

Tema aktifleştirme işlemini tamamladığınızda Tema Yönetimi sayfasında "Aktif Tema" alanında Petboutiq teması gelecektir.

Düzenlemeleri yapmak için "Özelleştir" butonuna tıklayınız.

petboutiq11.png (200 KB)

TEMA ÖZELLEŞTİRME - BLOK YÖNETİMİ

Petboutiq temanızı aktifleştirdikten sonra anasayfa ve diğer saylarda yer alan sitenize özel içeriklerin olduğu bloklarda düzenleme sağlamalısınız.

Üst Kısım : Sitenizde ziyaretçileri ürün, kategori, marka, tanıtım sayfaları gibi yönlendirmeleri üst kısımdan yapabilirsiniz. Ziyaretçilerin aradıkları ürüne, sayfaya ulaşmalarının kolay olması satış oranınızı da etkileyecektir.

Petboutiq temasında top (üst) menü, ana menü ve header bar alanları üst kısımda yer almaktadır.

petboutiq14.png (819 KB)

- Header Bar : Petboutiq temasında bulunan header barı yönetmek için "Tasarım > Tema Yönetimi > Özelleştir > Gelişmiş > Blok Yönetimi" sayfasında "Üst Kısım" bloğunun düzenleme kalemine tıklayınız.

petboutiq15.png (81 KB)

Blok düzenleme penceresinde "Dil Değişkenleri" sekmesine tıklayınız.

Değişkenler sekmesinde "header_bar" değişkeni ile üst kısımda yer alan header metnini düzenleyebilirsiniz. Düzenleme sonrası kaydet ikonuna tıklayınız.

petboutiq16.png (319 KB)

- Top Menü : Petboutiq temasında sol üst köşede link menü linklendirmesi yapabilirsiniz. İletişim, blog, markalar gibi ana kategori arasında göstermek istemediğiniz linkleri bu alanda kullanabilirsiniz.

Petboutiq temasının üst kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Menüler sayfasında yer alan "Top Menü" üst kısım header menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

petboutiq17.png (60 KB)

Top menü içerisine girildiğinde header alanında ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

petboutiq18.png (57 KB)

Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini girebilirsiniz.

petboutiq19.png (65 KB)

- Masaüstü Menü : Petboutiq temasında üst kısımda kategorilere, ürünlere ve diğer sayfalarınıza kolay ve hızlı erişim için menü linklendirmesi yapabilirsiniz. Ana kategorilerinizi ekleyerek açılır menü içerisinde alt kategori kırılımlarını gösterebilirsiniz.

Menüler sayfasında yer alan "Masaüstü Menü" üst kısım ana menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

petboutiq20.png (61 KB)

Masaüstü menü içerisine girildiğinde ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

petboutiq21.png (62 KB)

Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini girebilirsiniz.

Petboutiq temasında menülerde görsel ekleyebilirsiniz. Eklediğiniz görseller açılır menü içerisinde gösterilecektir.

NOT : Masaüstü menüde kategori görselleri iki alandan gelebilmektedir. Eğer menüye eklenen kategorinin "Kategoriler" sayfasında ekli görseli varsa o gelir. Kategoriler sayfasında görsel yok ise "Menüler" sayfasından eklenen görsel siteye yansır.

petboutiq22.png (67 KB)

petboutiq23.png (807 KB)

Slider : Anasayfanızda dikkat çekecek görseller yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Slider" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq24.png (1009 KB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq26.png (897 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Petboutiq teması slider için örnek görsel boyutları en az 1170x520 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq27.png (552 KB)

6'lı Banner (İçerik Başlık) : Petboutiq temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "6'li Banner (İçerik Başlık)" bloğunun düzenleme kalemine tıklayınız.

petboutiq28.png (1.22 MB)

6'lı banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq29.png (869 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Petboutiq teması 6'lı banner bloğu için ALL ve SM seçenekleri 6 ve 4 olmalıdır. Diğer ekran seçenekleri için yanyana üç görsel görüntülenebilmesi için 4 yazılmalıdır.

Petboutiq teması 2'li banner için örnek görsel boyutları en az 270x190 px olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq30.png (206 KB)

Özel Fırsatlar : Özel fırsatlar bloğu anasayfanızda dikkat çekecek görseller yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Özel Fırsatlar" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq31.png (1.20 MB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq32.png (865 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Petboutiq teması slider için örnek büyük görsel boyutları en az 158x236 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq33.png (282 KB)

Öne Çıkan Kategoriler : Kategoriler bloğu anasayfanızda dikkat çekecek görseller yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Öne Çıkan Kategoriler" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq34.png (1.00 MB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq35.png (425 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Petboutiq teması slider için örnek büyük görsel boyutları en az 135x135 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq36.png (197 KB)

Çok Satanlar / Yeni Gelenler / Fırsat Ürünleri : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Çok Satanlar veya Yeni Gelenler bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Çok Satanlar / Yeni Gelenler / Fırsat Ürünleri" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq37.png (375 KB)

petboutiq38.png (463 KB)

petboutiq44.png (653 KB)

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq39.png (378 KB)

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

petboutiq40.png (164 KB)

3'lü Banner : Petboutiq temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "3'lü Banner" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq41.png (1.17 MB)

3'lü banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq42.png (909 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Petboutiq teması 3'lü banner bloğu için ALL ve SM seçenekleri 12 olmalıdır. 12 yapıldığında mobil cihazlarda görseller alt alta gelecektir. Diğer ekran seçenekleri için yanyana üç görsel görüntülenebilmesi için 4 yazılmalıdır.

Petboutiq teması 3'lü banner için örnek görsel boyutları en az 370x500 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq43.png (405 KB)

4'lü Banner : Petboutiq temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "4'lü Banner" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq45.png (684 KB)

4'lü banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

petboutiq50.png (524 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Petboutiq teması 4'lü banner bloğu için ALL ve SM seçenekleri 12 olmalıdır. 12 yapıldığında mobil cihazlarda görseller alt alta gelecektir. Diğer ekran seçenekleri için yanyana iki görsel görüntülenebilmesi için 6 yazılmalıdır.

Petboutiq teması 4'lü banner için örnek görsel boyutları en az 568x173 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq51.png (323 KB)

Blog Son Eklenenler : Petboutiq temasında anasayfada blog yazılarınızı görüntüleyebilir, blog detayına yönlendirmesini sağlayabilirsiniz.

Blog Son Eklenenler bloğu standart bir bloktur. Blog metinlerinizin eklenme tarihine göre anasayfada listelenmesini sağlar.

Blog Yönetimi makalemizi incelemek için tıklayınız.

petboutiq46.png (561 KB)

Öne Çıkan Markalar : Markalar bloğu anasayfanızda öne çıkarmak istediğiniz markaları yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Öne Çıkan Markalar" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

petboutiq47.png (251 KB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Slider bloklarında eklenen görsellerin yanyana görünme durumlarını "Slide Adedi" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Petboutiq teması öne çıkan markalar bloğu için ALL ve SM seçenekleri 3 ve 4 olmalıdır. Diğer ekran seçenekleri için yanyana kaç adet görsel görüntülenebilmesi istiyorsanız ona göre yazılmalıdır. Örnek olarak ekran resmindeki ayarları kullanabilirsiniz.

Petboutiq teması slider için örnek görsel boyutları en az 135x135 px olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

petboutiq52.png (211 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

petboutiq53.png (106 KB)

Neden Biz? / Hakkımızda : Petboutiq temasında hakkımızda metinleri ve web sitesi hakkında bilgi veren yazılı açıklamalar ekleyebilirsiniz.

Bu metinler, genellikle şirket veya kuruluşun tarihçesini, misyonunu, vizyonunu, değerlerini ve faaliyetlerini özetler. Bu metinler, kuruluşun kendini tanıtma, güven oluşturma ve farklılaşma amacıyla kullanılır.

Petboutiq temasında ilgili metinleri "Tasarım > Tema Yönetimi > Özelleştir > Gelişmiş > Blok Yönetimi" sayfasında "Alt Kısım" bloğunun düzenleme kalemine tıklayınız.

petboutiq48.png (162 KB)

petboutiq55.png (92 KB)

Blok düzenleme penceresinde "Dil Değişkenleri" sekmesine tıklayınız.

Değişkenler sekmesinde ilgili değişkenler ile alt kısımda yer alan metinleri düzenleyebilirsiniz. Düzenleme sonrası kaydet ikonuna tıklayınız.

petboutiq54.png (227 KB)

Alt Kısım : Petboutiq temasının alt kısmında yönlendirme yapmak istediğiniz sayfalar için kategorilendirme ve adres bilgilerinizi gösterebilirsiniz.

Petboutiq temasında sosyal medya ikonları ve alt menü yapılandırması alt kısımda yer almaktadır.

petboutiq49.png (412 KB)

Petboutiq temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

- Sosyal Medya : Petboutiq temasında sosyal medya hesaplarınızı alt kısımda gösterebilirsiniz. Sitenize sosyal medya hesaplarınızı tanımlayarak genel etkileşiminizi artırabilirsiniz.

Menüler sayfasında yer alan "Sosyal Medya İkonları" alt kısıma sosyal medya hesaplarınızın linklerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

petboutiq56.png (60 KB)

Sosyal medya ikonları içerisine girildiğinde alt kısımda ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

petboutiq57.png (63 KB)

Düzenleme penceresinde sosyal medya ismi, linki, sıralama, sosyal medya görseli gibi bilgilerini girebilirsiniz.

petboutiq58.png (69 KB)

- Alt Menü : Petboutiq temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Menüler sayfasında yer alan "Footer Menü" alt kısım menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

petboutiq59.png (61 KB)

Footer menü içerisine girildiğinde alt kısımda linklerin bağlı olacağı kategoriler eklenmelidir.

Ekli kategorileri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Düzenleme yapmak için ilgili kategorinin üstüne tıklayınız.

petboutiq63.png (55 KB)

Alt menü kategorilerinin içine girdiğinizde görüntülenecek menü linklerinin eklemesini yapabilirsiniz.

Ekli olan linkleri düzenleyebilir veya yeni ekleme yapabilirsiniz.

petboutiq61.png (64 KB)

petboutiq62.png (71 KB)

- Adres & İletişim : Sitenizin alt kısmında ziyaretçilerin size ulaşabilmeleri sağlamak için adres ve telefon bilgisi ekleyebilirsiniz.

Adres ve telefon bilgisi eklemek için "Ayarlar > Genel Ayarlar" sayfasında yer alan "Firma Adres", "Telefon No" ve "E-Posta" ayarlarınızı düzenleyebilirsiniz.

petboutiq64.png (53 KB)

İletişim Bilgileri : E-ticaret sitenizin iletişim sayfasında ziyaretçilerin size ulaşabilmelerini sağlayacak bilgiler ekleyebilirsiniz.

İletişim bilgilerinizi düzenlemek için "Tasarım > Tema Yönetimi > Özelleştirme > Gelişmiş > Blok Yönetimi > İletişim" sayfasına tıklayınız ve "İletişim Bilgileri" bloğunun düzenleme penceresini açınız.

petboutiq65.png (69 KB)

Blok düzenleme sayfasında "Ayarlar" içeriğinden iletişim sayfasında görünmesini istediğiniz bilgileri ekleyebilirsiniz.

Boş bıraktığınız alanlar siteye yansımayacaktır.

petboutiq66.png (90 KB)

petboutiq67.png (272 KB)

TEMA DÜZENLEME

Tema düzenleme, bir web sitesinin görünümünü ve işlevselliğini değiştirmek için kullanılan bir işlemdir.

Bir web sitesinin temasını düzenlemek, renk şemalarını, yazı tipi stillerini, arka plan görüntülerini ve genel düzeni değiştirerek sitenin görünümünü ve hissini güncelleyebilir.

Ayrıca, tema düzenleme işlemi, bir web sitesinin işlevselliğini değiştirmek için kullanılan özel eklentiler ve kodlar eklemeyi de içerebilir. Bu sayede, bir web sitesinin kullanıcı deneyimi geliştirilebilir ve belirli bir amaca daha uygun hale getirilebilir.

V5 sistemi ile tema düzenleme işlemleri hızlı ve kolay şekilde yönetebilirsiniz.

Tema Düzenleme makalemizi incelemek için tıklayınız.

Yönetim panelinde "Tasarım > Tema Yönetimi" sayfasında yer alan "Tema Düzenleme" ikonuna tıklayınız.

petboutiq68.png (1017 KB)

1. Site Düzeni

Site düzeni, bir web sitesindeki içeriğin nasıl düzenlendiğini, yerleştirildiğini ve sunulduğunu tanımlayan bir kavramdır.

Temadaki sütun (grid) yapısı, boşluk yapıları, yükseklik değerleri gibi özelliklere site düzeni alanından müdahale edilebilmektedir.

Bu alanda yaptığınız değişiklikler temaya uygun değilse görünümde bozulmalar yaşanacaktır.

NOT : T-Soft standart temalarda 12'li grid sistemi kullanılmaktadır. Bu sistem, web sayfasını 12 eşit sütuna ayırarak, sayfadaki içeriği bu sütunlara yerleştirmeyi kolaylaştırır. Kodlama bilginiz bulunmuyor ise bu değerlere müdahale etmemenizi öneririz.

petboutiq69.png (1015 KB)

2. Font Seçimi

Font seçimi ve düzenleme, web tasarımının önemli bir parçasıdır. Doğru font seçimi, web sitesinin amacına ve hedef kitlesine uygun olarak belirlenmelidir.

Font büyüklükleri, renkleri ve stilleri de düzenlenerek içeriğin okunaklığı artırılabilir.

Font seçimi özelliğimiz ile sitede kullanmak istediğiniz fontu seçebilir, font büyüklüğünü belirleyebilir, sitenizde bulunan tüm yazı alanlarının renklerini istediğiniz gibi değiştirebilirsiniz.

petboutiq70.png (1.00 MB)

3. Renk Düzeni

Renk düzeni, web tasarımında kullanılan renklerin seçimini ve kombinasyonunu tanımlayan bir kavramdır.

Doğru renk düzeni, web sitesinin görünümünü ve hissiyatını geliştirerek, kullanıcıların web sitesindeki deneyimini artırır.

Tema düzenleme sayfasında sitenizin arka plan renklerine ait genel renk düzenini belirleyebilirsiniz.

petboutiq71.png (1022 KB)

4. Buton Düzeni

Butonlar, kullanıcılara web sitesinde belirli işlevleri gerçekleştirme olanağı sağlarlar, örneğin bir bağlantıya tıklama, bir formu gönderme veya bir işlemi onaylama gibi.

Butonların şekli, boyutu, rengi ve yeri, web sitesinin tasarımında önemli bir rol oynar.

Butonlarda, kullanıcıların butonları fark etmelerini sağlayacak etkileyici ve dikkat çekici renkleri kullanabilirsiniz.

petboutiq72.png (1023 KB)

5. Çerçeve Düzeni

Web sitesinin sayfa düzeni, içeriklerin yerleştirildiği ve görüntülendiği alanları tanımlayan çerçevelerle oluşturulur.

Çerçeve düzeni, web sitesinin okunabilirliğini ve kullanılabilirliğini artırarak, kullanıcıların web sitesinde gezinme deneyimini iyileştirir.

Temanızda çerçeve kullanılan alanlarda, çerçeve rengini ve kenar ovalliğini düzenleyebilirsiniz.

petboutiq73.png (1.00 MB)

NOT : Tema düzenleme sayfasında yaptığınız değişikliklerden sonra üstte çıkan "Kaydet" butonuna tıklamalısınız.

petboutiq75.png (1.00 MB)

NOT : Tema özelleştirme ve düzenleme işlemlerinden sonra işlemin siteye yansıması, görünümün düzgün olması için "Scss Dönüştürme" ve "Ön Bellek Temizle" işlemi yapılmalıdır.

Scss dönüştürme için "Tasarım > Tema Yönetimi > Gelişmiş > Blok Yönetimi" sayfasında bulunan "SCSS" butonuna tıklamalısınız.

Daha sonra üst menüde yer alan "Ön Bellek Temizle" butonuna tıklayarak yaptığınız işlemi sitede kontrol edebilirsiniz.

Bazı işlemlerde ek olarak site önyüzünde "CTRL+F5" yapıldıktan sonra kontrol edilmelidir.

petboutiq76.png (77 KB)

petboutiq77.png (130 KB)

Question 13

V5 GIFTY TEMASI KURULUMU

Accepted Answer

E-ticaret sitenizde V5 sistem altyapısı ile aynı anda birden fazla tema yükleyebilir ve aktif ederek kullanabilirsiniz.

T-Soft V5 sistemi aracılığıyla, çeşitli demo seçenekleri ile dakikalar içinde şık ve profesyonel bir web sitesi oluşturmak oldukça kolay hale gelmiştir.

Gifty, profesyonel T-Soft sistemi ile tasarlanmış ürün odaklı bir tema olarak, sitenizin hayal ettiğiniz görünüme kavuşmasını sağlar.

Özel günler temel alınarak kullanıcılara sunulan detaylar en ince ayrıntılara kadar düşünülerek tasarlanmıştır.

Sevgiliye hediye, anneler günü, babalar günü, çocuğunu sevindirme ve yaratıcı hediyeler gibi özel gün kategorileri basit ve sade teslimat seçenekleriyle sunulabilir.

Geliştirilmiş alışveriş sepeti sayfası, kullanıcı dostu ödeme sayfası ve kolay yönlendirici sayfalarıyla kullanıcı deneyimi artırılmıştır.

Gifty teması, SEO optimizasyonu, çeşitli başlık düzenleri ve uyumlu tasarımı gibi birçok avantaja sahiptir.

Responsive özelliği sayesinde farklı ekran boyutlarında sorunsuz bir görüntüleme sunar.

Ekran genişliği için seçeceğiniz güzel bir fotoğraf, profesyonel bir karşılama etkisi yaratır.

Gifty teması canlı önizleme demosunu incelemek için https://tsoftthemes.com/gifty linkinden erişim sağlayabilirsiniz.

V5 altyapılı sitenizde Gifty temasını kurmak için aşağıdaki adımları uygulabilirsiniz.

E-ticaret sitenizin paneline www.tsoftpanel.com adresinden giriş yapınız.

Yönetim panelinde tema yükle, aktifleştirme, düzenleme vb işlemler için "Tasarım > Tema Yönetimi" sayfasına tıklayınız.

Tema yüklemek için "Tema Yönetimi" sayfasında yer alan "Tema Marketine Git" butonuna tıklayınız.

gifty1.png (156 KB)

Tema marketi içerisinde sitenize yükleyerek kullanabileceğiniz ücretli ve ücretsiz temalar yer almaktadır.

Gifty temasını yüklemek için üstüne tıklayınız.

gifty2.png (425 KB)

Tema detay sayfasında "Yükle" butonuna tıklayarak Gifty temasının yüklü temalar listenize gelmesini sağlayabilirsiniz.

gifty3.png (236 KB)

Temanız yüklendiğinde güncel tema versiyonu ile birlikte yüklenecektir ve tema sayfasında "Güncelsiniz" seçeneği görünecektir.

Temanızın güncel olmaması durumunda bu alanda "Güncelle" butonu yer alacaktır.

Güncelle butonunu kullanarak temada yapılan güncellemeleri uygulayabilirsiniz. Tema güncelleme işlemi sistem güncelleme işlemi ile aynı değildir. Tema güncelleme yalnızca tema dosyasında yapılan güncellemeleri ilgili temaya yükler.

Tema Güncelleme makalemizi incelemek için tıklayınız.

gifty4.png (187 KB)

Tema yüklerken aşağıdaki ekran resmindeki hatayı almanız durumunda "Bölümler > Destek" sayfasından departmanı "T-Soft Apps" seçerek talep oluşturabilirsiniz. İlgili ekip düzenleme sağladıktan sonra temanızı sorunsuz olarak yükleyebilirsiniz.

gifty5.png (162 KB)

Tema yükleme işlemi tamamlandığında başarılı bilgisi için popup gelecektir.

"Tema Düzenleyiciye Git" butonu ile tema yönetimi sayfasına geçebilirsiniz.

gifty6.png (172 KB)

Yüklediğiniz Gifty teması Tema Yönetimi sayfasında listelenecektir.

Tema üzerine geldiğinizde işlem yapabileceğiniz butonlar yer almaktadır.

gifty7.png (195 KB)

1. Önizleme : Gifty temasının standart görünümünü örnek site üzerinden aktif etmeden önizleme ile görmenizi sağlar.

gifty8.png (1.36 MB)

2. Aktifleştir : Gifty temasını sitenizde aktif ederek kullanmanızı sağlar. Tıkladığınızda aktifleştirme için iki seçenek sunulmaktadır.

1. Seçenek : "Temayı Aktifleştir" seçeneği ile temayı aktifleştirdiğinizde daha önce eklediğiniz slider, banner ve diğer içerikleriniz var ise içerikler silinmeden tema ve şablonlarda değişiklik sağlar. Tema değiştirildiğinde tüm özel şablonlarınızın da default seçilmesine neden olur. Sitenizdeki içerikler aynı kalır, sitenin görünümü ve çalışma şekli etkilenebilir. Örnek olarak anasayfanıza önceki temaya ait banner, slider görsellerinizi eklediniz. Tema marketinde beğendiğiniz farklı temalara geçiş yapmak istediğinizde, "Temayı Aktifleştir" seçeneğini kullanarak bir önceki temanıza ait slider, banner gibi içerikler aktifleştirdiğiniz temanıza aktarılmış olur.

gifty9.png (159 KB)

2. Seçenek : "Temayı Aktifleştir ve İçerikleri Aktar" seçeneği ile temayı aktifleştirdiğinizde, daha önce eklemiş olduğunuz slider, banner gibi düzenlemeler mevcut ise, tema değişiminde yaptığınız tüm işlemler silinir. Yeni tema yükleme işleminde, yüklenen tema konseptine ait slider, banner gibi içerikler sitenize yüklenir.

NOT : Tema değişikliği işlemi yapıldığında kategori, ürün, içerik yönetimi gibi alanlar silinmez. Kullandığınız temaya özel, farklı gösterimler olabilir.

gifty10.png (159 KB)

Tema aktifleştirme işlemini tamamladığınızda Tema Yönetimi sayfasında "Aktif Tema" alanında Gifty teması gelecektir.

Düzenlemeleri yapmak için "Özelleştir" butonuna tıklayınız.

gifty11.png (211 KB)

TEMA ÖZELLEŞTİRME - BLOK YÖNETİMİ

Gifty temanızı aktifleştirdikten sonra anasayfa ve diğer saylarda yer alan sitenize özel içeriklerin olduğu bloklarda düzenleme sağlamalısınız.

Üst Kısım : Sitenizde ziyaretçileri ürün, kategori, marka, tanıtım sayfaları gibi yönlendirmeleri üst kısımdan yapabilirsiniz. Ziyaretçilerin aradıkları ürüne, sayfaya ulaşmalarının kolay olması satış oranınızı da etkileyecektir.

Gifty temasında top menü ve ana menü alanı üst kısımda yer almaktadır.

gifty12.png (1.35 MB)

- Top Menü : Gifty temasında sol üst köşede link menü linklendirmesi yapabilirsiniz. İletişim, blog, markalar gibi ana kategori arasında göstermek istemediğiniz linkleri bu alanda kullanabilirsiniz.

Gifty temasının üst kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Menüler sayfasında yer alan "Top Menü" üst kısım header menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

gifty21.png (61 KB)

Top menü içerisine girildiğinde header alanında ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

gifty22.png (57 KB)

Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini girebilirsiniz.

gifty23.png (64 KB)

- Masaüstü Menü : Gifty temasında üst kısımda kategorilere, ürünlere ve diğer sayfalarınıza kolay ve hızlı erişim için menü linklendirmesi yapabilirsiniz. Ana kategorilerinizi ekleyerek açılır menü içerisinde alt kategori kırılımlarını gösterebilirsiniz.

Menüler sayfasında yer alan "Masaüstü Menü" üst kısım ana menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

gifty24.png (61 KB)

Masaüstü menü içerisine girildiğinde ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

gifty25.png (66 KB)

Düzenleme penceresinde menü ismi, linki, sıralama vb bilgilerini girebilirsiniz.

gifty26.png (68 KB)

Gifty temasında alt kategorilere görsel ekleyebilirsiniz. Eklediğiniz görseller açılır menü içerisinde gösterilecektir.

Alt kategori görseli eklemek için "Ürünler > Tanımlar > Kategoriler" sayfasında kategori düzenleme penceresine tıklayınız.

"Resim" alanından kategori görselini ekleyebilirsiniz.

gifty27.png (243 KB)

gifty28.png (1.11 MB)

- Telefon Numarası : Gifty temasında sağ üst köşede iletişim numaranızı ekleyebilirsiniz.

Eklemek için "Ayarlar > Genel Ayarlar > Telefon No" ayarından düzenleme yapabilirsiniz.

gifty29.png (45 KB)

Slider : Anasayfanızda dikkat çekecek görseller yayınlayabileceğiniz, müşterilerinizi yönlendirmede aktif olarak kullanabileceğiniz slider blok alanıdır.

Slider makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Slider" bloğunun veya önizleme görünümünde slider üzerinde bulunan düzenleme kalemine tıklayınız.

gifty13.png (1.24 MB)

Slider düzenleme penceresinde "Resimler" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

gifty30.png (1002 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Gifty teması slider için örnek görsel boyutları en az 1440x680 olmalıdır. Görselin genişlik ölçüsü sabit kalacak şekilde yükseklik değerini görünmesini istediğiniz şekilde değiştirebilirsiniz. Tasarımın düzgün görünmesi için eklenen tüm görseller aynı boyutlara sahip olmalıdır.

gifty31.png (512 KB)

Sizin İçin Seçtiklerimiz : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Sizin İçin Seçtiklerimiz bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Sizin İçin Seçtiklerimiz" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

gifty14.png (755 KB)

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

Gifty temasında bu alandaki gibi yanyana vitrin bloğu göstermek için "Yeni" butonunu kullanarak ekleme yapmalısınız. Eklediğiniz her vitrin blokta yanyana eklenecektir.

gifty32.png (665 KB)

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

gifty33.png (226 KB)

Banner & Resim & Fotoğraf : Gifty temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Banner & Resim & Fotoğraf" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

gifty15.png (881 KB)

Tekli banner düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

gifty34.png (678 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Gifty teması tekli banner bloğu için tüm sütun genişliği değerleri 12 olmalıdır.

gifty35.png (405 KB)

Öne Çıkan Kategoriler : Gifty temasında anasayfaya görsel eklemek için kullanılabilecek olan banner bloklarıdır.

Banner blok yapısı ile tekli, 2'li, 5'li gibi yanyana görüntülenebilecek görseller ekleyebilirsiniz.

Banner&Resim&Fotoğraf makalemizi incelemek için tıklayınız.

Değişiklik yapmak için Tema Özelleştirme sayfasında "Öne Çıkan Kategoriler" bloğunun veya önizleme görünümünde banner üzerinde bulunan düzenleme kalemine tıklayınız.

gifty16.png (1.29 MB)

Öne çıkan kategoriler bloğunun düzenleme penceresinde "Resim Listesi" içerisinde standart olarak eklenen görseller yer almaktadır.

Düzenleme kalemine tıklayarak dil bazında sitenize özel görselleri yükleyebilir veya sil butonu ile ekli görseli silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

gifty36.png (1021 KB)

Resim düzenleme penceresinde ekli görseli, görsel başlığını ve tıklandığında gitmesini istediğiniz link bilgilerini düzenleyebilirsiniz.

Banner bloklarında eklenen görsellerin yanyana görünme durumlarını "Sütun Genişliği (COL-X)" seçeneğinden düzenleyebilirsiniz. Sütun genişlik yapısı 12'li grid sistemine göre çalışmaktadır. "ALL" ve "SM" seçenekleri mobil cihazlar, "MD", "LG", "XL" ve "XXL" seçenekleri ise kullanılan cihaz ekran boyutlarına göre yanyana kaç adet görsel görüntüleneceğini belirler. Eğer eklenen görsel sayfada tekli olarak geniş şekilde görüntülenecek ise full olması için 12 olmalıdır. Örnek olarak yanyana 3 tane görsel görünmesini istiyorsanız 12'li grid sistemini 3'e bölmelisiniz ve ekran boyut karşlılıklarına 4 olarak yerleştirmelisiniz.

Gifty teması öne çıkan kategoriler bloğu için "ALL" ve "SM" sütun genişliği değerleri mobil cihazlarda yanyana iki tane görsel görünmesi için 6 olmalıdır. Diğer sütun değeri seçenekleri yanyana üç görsel görünmesi için 4 olmalıdır.

gifty37.png (421 KB)

Mutlu Müşteriler / Ürün Yorumları : Gifty teması ile anasayfada site ve ürün yorumlarınızı gösterebilirsiniz.

Yorum blokları standart olarak ekli gelmektedir.

Sitenize ve ürünlerine yorum geldiğinde bu bloklarda listelenmeye başlayacaktır.

Blokları kullanmak istemiyorsanız çöp kutusu simgesi ile silebilirsiniz.

gifty17.png (435 KB)

gifty19.png (301 KB)

Anasayfa Vitrin Ürünleri : Anasayfada belirlediğiniz ürünleri listelemek için kullanabileceğiniz Vitrin Ürünleri bloklarıdır.

Yeni ürünler, indirimli ürünler, öne çıkarmak istediğiniz ürünler gibi kombinasyonlar ile koleksiyon oluşturabilir ve vitrin ürünlerine ekleme yapabilirsiniz.

Ürün Koleksiyonları makalemizi incelemek için tıklayınız.

Vitrin Ürünleri makalemizi incelemek için tıklayınız.

Sizin İçin Seçtiklerimiz bloğunda değişiklik yapmak için Tema Özelleştirme sayfasında "Anasayfa Vitrin Ürünleri" bloğunun veya önizleme görünümünde vitrin üzerinde bulunan düzenleme kalemine tıklayınız.

gifty18.png (536 KB)

Vitrin düzenleme penceresinde "Vitrin Listesi" içerisinde standart olarak eklenen ürün koleksiyonu yer almaktadır.

Düzenleme kalemine tıklayarak oluşturduğunuz ürün koleksiyonunu seçebilir veya sil butonu ile ekli koleksiyonu silerek "Yeni" butonuna tıklayıp yeniden ekleme yapabilirsiniz.

gifty38.png (620 KB)

Vitrin düzenleme penceresinde kullanılacak koleksiyonu, kolesiyon başlığını, toplam gösterilecek ürün adedi bilgilerini düzenleyebilirsiniz.

gifty39.png (232 KB)

Vitrin seçiminde "Anasayfa Ürünleri" seçildiğinde "Ürünler" sayfasından bu blokta görüntülenmesini istediğiniz ürünlerde kırmızı bayrak aktif edilmelidir.

gifty40.png (178 KB)

Alt Kısım : Gifty temasının alt kısmında yönlendirme yapmak istediğiniz sayfalar için kategorilendirme ve adres bilgilerinizi gösterebilirsiniz.

Gifty temasında sosyal medya ikonları ve alt menü yapılandırması alt kısımda yer almaktadır.

gifty20.png (123 KB)

Gifty temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

- Sosyal Medya : Gifty temasında sosyal medya hesaplarınızı alt kısımda gösterebilirsiniz. Sitenize sosyal medya hesaplarınızı tanımlayarak genel etkileşiminizi artırabilirsiniz.

Menüler sayfasında yer alan "Sosyal Medya İkonları" alt kısıma sosyal medya hesaplarınızın linklerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

gifty41.png (61 KB)

Sosyal medya ikonları içerisine girildiğinde alt kısımda ekli linkleri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Tanımlama yapmak için ilgili linkin düzenleme kalemine tıklayınız.

gifty43.png (63 KB)

Düzenleme penceresinde sosyal medya ismi, linki, sıralama, sosyal medya görseli gibi bilgilerini girebilirsiniz.

gifty44.png (69 KB)

- Alt Menü : Gifty temasının alt kısım bloğuna menü linkleri tanımlamak için "Tasarım > Menüler" sayfasına tıklayınız.

Menüler sayfasında yer alan "Footer Menü" alt kısım menülerini eklemek için kullanılmaktadır.

Ekleme veya düzenleme yapmak için menü ismine tıklayınız.

gifty45.png (61 KB)

Footer menü içerisine girildiğinde alt kısımda linklerin bağlı olacağı kategoriler eklenmelidir.

Ekli kategorileri kullanabilir, düzenleyebilir veya yenisini oluşturabilirsiniz.

Düzenleme yapmak için ilgili kategorinin üstüne tıklayınız.

gifty47.png (54 KB)

Alt menü kategorilerinin içine girdiğinizde görüntülenecek menü linklerinin eklemesini yapabilirsiniz.

Ekli olan linkleri düzenleyebilir veya yeni ekleme yapabilirsiniz.

gifty48.png (64 KB)

gifty49.png (71 KB)

- Hakkımızda : Gifty temasında hakkımızda metinleri ve web sitesi hakkında bilgi veren yazılı açıklamalar ekleyebilirsiniz.

Bu metinler, genellikle şirket veya kuruluşun tarihçesini, misyonunu, vizyonunu, değerlerini ve faaliyetlerini özetler. Bu metinler, kuruluşun kendini tanıtma, güven oluşturma ve farklılaşma amacıyla kullanılır.

Gifty temasında ilgili metinleri "Tasarım > Tema Yönetimi > Özelleştir > Gelişmiş > Blok Yönetimi" sayfasında "Alt Kısım" bloğunun düzenleme kalemine tıklayınız.

gifty50.png (93 KB)

Blok düzenleme penceresinde "Dil Değişkenleri" sekmesine tıklayınız.

Değişkenler sekmesinde ilgili değişkenler ile alt kısımda yer alan metinleri düzenleyebilirsiniz. Düzenleme sonrası kaydet ikonuna tıklayınız.

gifty51.png (137 KB)

İletişim Bilgileri : E-ticaret sitenizin iletişim sayfasında ziyaretçilerin size ulaşabilmelerini sağlayacak bilgiler ekleyebilirsiniz.

İletişim bilgilerinizi düzenlemek için "Tasarım > Tema Yönetimi > Özelleştirme > Gelişmiş > Blok Yönetimi > İletişim" sayfasına tıklayınız ve "İletişim Bilgileri" bloğunun düzenleme penceresini açınız.

gifty52.png (70 KB)

Blok düzenleme sayfasında "Ayarlar" içeriğinden iletişim sayfasında görünmesini istediğiniz bilgileri ekleyebilirsiniz.

Boş bıraktığınız alanlar siteye yansımayacaktır.

gifty53.png (92 KB)

gifty54.png (670 KB)

TEMA DÜZENLEME

Tema düzenleme, bir web sitesinin görünümünü ve işlevselliğini değiştirmek için kullanılan bir işlemdir.

Bir web sitesinin temasını düzenlemek, renk şemalarını, yazı tipi stillerini, arka plan görüntülerini ve genel düzeni değiştirerek sitenin görünümünü ve hissini güncelleyebilir.

Ayrıca, tema düzenleme işlemi, bir web sitesinin işlevselliğini değiştirmek için kullanılan özel eklentiler ve kodlar eklemeyi de içerebilir. Bu sayede, bir web sitesinin kullanıcı deneyimi geliştirilebilir ve belirli bir amaca daha uygun hale getirilebilir.

V5 sistemi ile tema düzenleme işlemleri hızlı ve kolay şekilde yönetebilirsiniz.

Tema Düzenleme makalemizi incelemek için tıklayınız.

Yönetim panelinde "Tasarım > Tema Yönetimi" sayfasında yer alan "Tema Düzenleme" ikonuna tıklayınız.

gifty55.png (1.37 MB)

1. Site Düzeni

Site düzeni, bir web sitesindeki içeriğin nasıl düzenlendiğini, yerleştirildiğini ve sunulduğunu tanımlayan bir kavramdır.

Temadaki sütun (grid) yapısı, boşluk yapıları, yükseklik değerleri gibi özelliklere site düzeni alanından müdahale edilebilmektedir.

Bu alanda yaptığınız değişiklikler temaya uygun değilse görünümde bozulmalar yaşanacaktır.

NOT : T-Soft standart temalarda 12'li grid sistemi kullanılmaktadır. Bu sistem, web sayfasını 12 eşit sütuna ayırarak, sayfadaki içeriği bu sütunlara yerleştirmeyi kolaylaştırır. Kodlama bilginiz bulunmuyor ise bu değerlere müdahale etmemenizi öneririz.

gifty56.png (1.37 MB)

2. Font Seçimi

Font seçimi ve düzenleme, web tasarımının önemli bir parçasıdır. Doğru font seçimi, web sitesinin amacına ve hedef kitlesine uygun olarak belirlenmelidir.

Font büyüklükleri, renkleri ve stilleri de düzenlenerek içeriğin okunaklığı artırılabilir.

Font seçimi özelliğimiz ile sitede kullanmak istediğiniz fontu seçebilir, font büyüklüğünü belirleyebilir, sitenizde bulunan tüm yazı alanlarının renklerini istediğiniz gibi değiştirebilirsiniz.

gifty57.png (1.38 MB)

3. Renk Düzeni

Renk düzeni, web tasarımında kullanılan renklerin seçimini ve kombinasyonunu tanımlayan bir kavramdır.

Doğru renk düzeni, web sitesinin görünümünü ve hissiyatını geliştirerek, kullanıcıların web sitesindeki deneyimini artırır.

Tema düzenleme sayfasında sitenizin arka plan renklerine ait genel renk düzenini belirleyebilirsiniz.

gifty58.png (1.38 MB)

4. Buton Düzeni

Butonlar, kullanıcılara web sitesinde belirli işlevleri gerçekleştirme olanağı sağlarlar, örneğin bir bağlantıya tıklama, bir formu gönderme veya bir işlemi onaylama gibi.

Butonların şekli, boyutu, rengi ve yeri, web sitesinin tasarımında önemli bir rol oynar.

Butonlarda, kullanıcıların butonları fark etmelerini sağlayacak etkileyici ve dikkat çekici renkleri kullanabilirsiniz.

gifty59.png (1.38 MB)

5. Çerçeve Düzeni

Web sitesinin sayfa düzeni, içeriklerin yerleştirildiği ve görüntülendiği alanları tanımlayan çerçevelerle oluşturulur.

Çerçeve düzeni, web sitesinin okunabilirliğini ve kullanılabilirliğini artırarak, kullanıcıların web sitesinde gezinme deneyimini iyileştirir.

Temanızda çerçeve kullanılan alanlarda, çerçeve rengini ve kenar ovalliğini düzenleyebilirsiniz.

gifty60.png (1.38 MB)

NOT : Tema düzenleme sayfasında yaptığınız değişikliklerden sonra üstte çıkan "Kaydet" butonuna tıklamalısınız.

gifty62.png (1.38 MB)

NOT : Tema özelleştirme ve düzenleme işlemlerinden sonra işlemin siteye yansıması, görünümün düzgün olması için "Scss Dönüştürme" ve "Ön Bellek Temizle" işlemi yapılmalıdır.

Scss dönüştürme için "Tasarım > Tema Yönetimi > Gelişmiş > Blok Yönetimi" sayfasında bulunan "SCSS" butonuna tıklamalısınız.

Daha sonra üst menüde yer alan "Ön Bellek Temizle" butonuna tıklayarak yaptığınız işlemi sitede kontrol edebilirsiniz.

Bazı işlemlerde ek olarak site önyüzünde "CTRL+F5" yapıldıktan sonra kontrol edilmelidir.

gifty63.png (83 KB)

gifty64.png (157 KB)

Question 14

BASIC TEMASI KURULUMU

Accepted Answer

E-ticaret sitenizde, T-Soft V5 Tailwind altyapısı ile güncel kodlama mimarisi ve ileri teknolojilere sahip modern temaları kullanabilirsiniz. Üstelik çeşitli demo seçenekleri sayesinde dakikalar içinde şık ve profesyonel bir web sitesi oluşturmak oldukça kolaydır.

Basic Teması, basit ve ürün odaklı tasarımıyla modern ve fonksiyonel bir web sitesi için gerekli tüm özellikleri sunar. Çok amaçlı yapısı sayesinde farklı kategorilerde kullanılabilir ve kullanıcıya göz yormayan, profesyonel bir deneyim sağlar.

SEO dostu yapısıyla dikkat çeken Basic teması, hızlı yüklenen ve estetik açıdan çekici siteler oluşturmanıza olanak tanır. Renklerden yazı tiplerine, kenar çubuğundan çeviri ve altbilgi bölümlerine kadar birçok ayarı özelleştirebilir, blog, portföy ve mağaza sayfalarınıza modern dokunuşlar ekleyebilirsiniz.

Basic, işlevsel ve çekici demolarının düzenini kolaylıkla değiştirebilmenizi sağlar; öğelerin yerleşimini yeniden düzenleyebilir ve yaptığınız her değişikliği gerçek zamanlı olarak görüntüleyebilirsiniz.

Ayrıca, responsive (duyarlı) tasarımı sayesinde Basic teması, masaüstü bilgisayarlardan tablet ve cep telefonlarına kadar tüm cihazlarda sorunsuz görüntülenir. Böylece mobil kullanıcı deneyimini en üst düzeye çıkarabilir ve mobil trafik kaybının önüne geçebilirsiniz.

Basic teması canlı önizleme demosunu incelemek için https://tsoftthemes.com/basic linkinden erişim sağlayabilirsiniz.

V5 altyapılı sitenizde Basic temasını kurmak için aşağıdaki adımları uygulabilirsiniz.

BASIC TEMA KURULUMU ve AKTİFLEŞTİRME

İşlem Adımları

- "Online Mağaza > Tema Yönetimi" sayfasına tıklayın.

- Kullanmak istediğiniz temayı yüklemek için "Online Mağaza > Tema Yönetimi" menüsünde yer alan "Tema Marketine Git" butonuna tıklayın.

- Tema listesinden "Basic" temasına tıklayın.

- Basic tema detayında yer alan "Yükle" butonuna tıklayın.

- Tema başarıyla yüklendiğinde, "Tema Yönetimine Git" butonuna tıklayarak tema yönetimi sayfasına geçebilirsiniz. Tema kurulumu sırasında bir hata ile karşılaşırsanız, destek almak için T-Soft Apps ekibimize talep oluşturabilirsiniz.

- Yüklenen temalar "Tema Kütüphanesi" alanında listelenir. Tema yüklenme tarihi ve versiyon bilgilerini ilgili tema kartı üzerinde görüntüleyebilirsiniz.

- Yüklediğiniz temayı site ön yüzünde kullanabilmek için yayınlamanız gerekir. Temayı canlıya almak için "Yayınla" butonuna tıklayın.

- Tema değişimlerinde, önceki tema üzerinde yapılan düzenlemeler değişebileceği için bir uyarı gösterilir. İşlemi gerçekleştirmek istediğinizden eminseniz "Onayla" butonuna tıklayın.

- Tema yayına alınırken, sayfada işlem süreçlerini takip edebilirsiniz.

- Yayına alınan tema, sayfada "Aktif" tema olarak gösterilir. Tema güncelleme ve versiyon bilgilerini görüntüleyebilirsiniz.

- “Kodu Düzenle” butonunu kullanarak tema şablon kodlarına erişebilir ve gerekli düzenlemeleri yapabilirsiniz. Kod bilgisine gerek duymadan tema içeriğini düzenlemek için ise “Özelleştir” butonunu kullanabilirsiniz.

- Temanız yüklendiğinde, otomatik olarak en güncel tema versiyonu ile birlikte kurulacaktır. Bu durumda tema sayfasında “Güncelsiniz” bildirimi görüntülenir. Eğer temanız güncel değilse, aynı alanda “Güncelle” butonu yer alır. Bu butonu kullanarak temaya ait yayınlanan son güncellemeleri kolayca uygulayabilirsiniz.

- Önemli Not: Tema güncelleme işlemi, sistem güncelleme işlemi ile aynı değildir. Tema güncellemesi yalnızca ilgili tema dosyalarında yapılan iyileştirme ve düzenlemelerin yüklenmesini sağlar; sistem altyapısını etkilemez. Tema güncelleme adımları hakkında daha fazla bilgi için “Tema Güncelleme” makalemizi inceleyebilirsiniz.

DUYURU / KAMPANYA / ANNOUNCEMENT BLOĞU

İşlem Adımları

- Tema düzenleme işlemi için "Online Mağaza > Tema Yönetimi" sayfasına veya "Online Mağaza > Blok Yönetimi" sayfasına tıklayın.

- "Tema Yönetimi" sayfasından işlem yapmak için “Özelleştir” butonuna tıklayın.

- “Tema Özelleştir” seçeneğini kullanılırsa açılan sayfada “Gelişmiş” butonuna tıklayın.

- "Duyuru / Kampanya / Announcement" bloğunun düzenleme kalemine tıklayın.

- Blok detayında, “Resimler” sekmesinde varsayılan olarak ekli içerikler listelenir. Ekli içerikler üzerinde işlem yapabilir ve “Ekle” butonunu kullanarak yeni içerikler tanımlayabilirsiniz.

- Mevcut içeriği pasife alabilir, kopyalayabilir, düzenleyebilir veya silebilirsiniz. Düzenleme yapmak için düzenleme kalemine tıklayın.

- “Başlık” alanı üzerinden, duyuru bloğunda gösterilecek içeriği tanımlayabilirsiniz. Bu alan HTML kodlarını destekler; metin üzerinde kalın, altı çizili gibi basit biçimlendirmeleri uygulayabilirsiniz. “URL” bölümünden, kullanıcı içeriğe tıkladığında yönlendirileceği bağlantı adresini tanımlayabilirsiniz.

- Duyuru bloğunda yapılan düzenlemeleri, önbelleği temizledikten sonra sitenin en üst kısmında görüntüleyebilirsiniz.

HERO SLİDER BLOĞU

İşlem Adımları

- Tema düzenleme işlemi için "Online Mağaza > Tema Yönetimi" sayfasına veya "Online Mağaza > Blok Yönetimi" sayfasına tıklayın.

- "Tema Yönetimi" sayfasından işlem yapmak için “Özelleştir” butonuna tıklayın.

- “Tema Özelleştir” seçeneğini kullanılırsa açılan sayfada “Gelişmiş” butonuna tıklayın.

- "Hero Slider" bloğunun düzenleme kalemine tıklayın.

- Blok detayında, “Resimler” sekmesinde varsayılan olarak ekli içerikler listelenir. Ekli içerikler üzerinde işlem yapabilir ve “Ekle” butonunu kullanarak yeni içerikler tanımlayabilirsiniz.

- Mevcut içeriği pasife alabilir, kopyalayabilir, düzenleyebilir veya silebilirsiniz. Düzenleme yapmak için düzenleme kalemine tıklayın.

- “Başlık” ve “Alt Başlık” alanlarına girdiğiniz metinler, slider bloğunda görselin yanında görüntülenecektir. Metnin slider alanında görünmesi için ilgili blok şablonunun “hero-slider.twig” olarak seçilmiş olması gerekmektedir.

- “URL” bölümünden, kullanıcı slider görseline tıkladığında yönlendirileceği bağlantı adresini tanımlayabilirsiniz.

- Slider bloğunda kullanılacak görsel, “Büyük Ekran” alanından yüklenmelidir. Basic tema yapısında Hero Slider bloğu için standart görsel ölçüsü 620x620 piksel olarak belirlenmiştir.

- Mobil cihazlarda farklı bir görsel göstermek için “Mobil/Tablet” alanına görsel ekleyebilirsiniz. Bu durumda mobilde, masaüstü görseli yerine eklediğiniz mobil görsel görüntülenir. Görseli mobil boyutlara uygun şekilde hazırlayın.

- Slider görsellerinin altında küçük önizleme (thumbnail) görselleri göstermek için "Küçük Resim" alanını kullanabilirsiniz. Bu alana görsel ekledikten sonra özelliğin etkin olması için “Blok Ayarları > Küçük Resimleri Göster” seçeneğinin aktif edilmesi gerekmektedir.

- Görsel üzerinde kullanıcıları yönlendirmek için “Buton Metni” alanını kullanabilirsiniz. Bu alana metin eklendiğinde, görsel üzerinde bir buton otomatik olarak oluşturulur.

- Görsel üzerinde içerik metni göstermek için “Veri 1” alanını kullanabilirsiniz. Bu alan boş bırakıldığında görsel üzerinde herhangi bir metin görüntülenmez. Veri girildiğinde ise metin, görselde başlık bölümünün altında yer alır.

- "Blok Ayarları" sekmesinde slider alanına ait genel düzenlemeleri yönetebilirsiniz.

- Navigasyonu Göster : Slider üzerinde ileri–geri geçiş oklarının görünmesini sağlar.
- Küçük Resimleri Göster : Slider altına küçük önizleme (thumbnail) görsellerinin eklenmesini sağlar.
- Sayfalama Göster : Slider içinde kaçıncı görselde olunduğunu gösteren nokta veya numaralı göstergeleri aktif eder.
- Sayfalama Türü : Sayfalama göstergesinin biçimini (örneğin nokta, sayı, çubuk) seçmenizi sağlar.
- Döngü : Slider’ın son görsele geldiğinde yeniden başa dönerek sürekli oynatılmasını sağlar.
- Otomatik Oynatma (ms) : Slider’ın otomatik geçiş süresini milisaniye cinsinden belirler.
- Efekt : Görseller arası geçişte kullanılacak animasyon türünü (örneğin slide, fade vb.) seçmenizi sağlar.

ÖNE ÇIKAN ÜRÜNLER BLOĞU

İşlem Adımları

- Tema düzenleme işlemi için "Online Mağaza > Tema Yönetimi" sayfasına veya "Online Mağaza > Blok Yönetimi" sayfasına tıklayın.

- "Tema Yönetimi" sayfasından işlem yapmak için “Özelleştir” butonuna tıklayın.

- “Tema Özelleştir” seçeneğini kullanılırsa açılan sayfada “Gelişmiş” butonuna tıklayın.

- "Vitrin Ürünleri" bloğunun düzenleme kalemine tıklayın.

- Blok detayında, “Vitrin Listesi” sekmesinde varsayılan olarak ekli koleksiyon listelenir. Ekli vitrin üzerinde işlem yapabilir ve “Ekle” butonunu kullanarak yeni vitrin tanımlayabilirsiniz.

- Mevcut vitrini pasife alabilir, kopyalayabilir, düzenleyebilir veya silebilirsiniz. Düzenleme yapmak için düzenleme kalemine tıklayın.

- "Başlık" alanına girdiğiniz bilgiler, blok detayında yer alan koleksiyonları ayırt etmenize yardımcı olur. Bu bilgi site ön yüzünde görüntülenmez.

- Vitrin bloğu içinde görüntülenecek ürün koleksiyonunu "Vitrin" bölümünden seçebilirsiniz. Bu alanda sistemde hazır bulunan koleksiyonları kullanabilir veya kendi koleksiyonlarınızı oluşturabilirsiniz. Yeni bir koleksiyon oluşturmak için Ürün Koleksiyonları makalemizi inceleyebilirsiniz.

- Vitrinde gösterilecek toplam ürün sayısını "Limit" alanı üzerinden belirleyebilirsiniz.

- "Parametre" alanından vitrinde koleksiyon yerine belirli özelliklere sahip ürünleri gösterebilirsiniz. Örneğin "category=12&brand=3" yazıldığında, 12 ID’li kategoriye ve 3 ID’li markaya ait ürünler vitrinde görüntülenir.

- Vitrin bloğunun sol kısmında bir görsel göstermek için "Vitrin Sekmesi Resmi" alanından görsel ekleyebilirsiniz.

- "Blok Ayarları" sekmesinde vitrin bloğuna ait genel düzenlemeleri yönetebilirsiniz.

- Başlık : Blokta görüntülenecek ana başlığı belirlemenizi sağlar.
- Alt Başlık : Başlığın altında yer alacak ek açıklama veya alt metni yazabileceğiniz alandır.
- Navigasyonu Göster : Slider içinde ileri–geri oklarının görüntülenip görüntülenmeyeceğini belirler.
- Sayfalama Göster : Slider altındaki nokta (pagination) göstergesinin görünürlüğünü kontrol eder.
- Döngü : Slider'ın son slayttan sonra otomatik olarak başa dönmesini sağlar.
- Otomatik Oynatma (ms) : Slaytların belirtilen süre aralığında otomatik olarak değişmesini ayarlarsınız.
- Slide Adedi : Bir ekranda aynı anda kaç ürün/slayt görüneceğini belirler.
- Kenar Boşluğu : Slaytlar arasındaki yatay boşluk miktarını ayarlamanızı sağlar.
- Vitrin ürün gösterimi : Blokta ürünlerin hangi Twig şablonu kullanılarak gösterileceğini seçer.

GRID BANNER / STATIK BLOĞU

İşlem Adımları

- Tema düzenleme işlemi için "Online Mağaza > Tema Yönetimi" sayfasına veya "Online Mağaza > Blok Yönetimi" sayfasına tıklayın.

- "Tema Yönetimi" sayfasından işlem yapmak için “Özelleştir” butonuna tıklayın.

- “Tema Özelleştir” seçeneğini kullanılırsa açılan sayfada “Gelişmiş” butonuna tıklayın.

- "Grid Banner/Statik" bloğunun düzenleme kalemine tıklayın.

- Blok detayında, “Resim Listesi” sekmesinde varsayılan olarak ekli görseller listelenir. Ekli görseller üzerinde işlem yapabilir ve “Ekle” butonunu kullanarak yeni resimler tanımlayabilirsiniz.

- Mevcut görseli pasife alabilir, kopyalayabilir, düzenleyebilir veya silebilirsiniz. Düzenleme yapmak için düzenleme kalemine tıklayın.

- “Başlık” ve “Alt Başlık” alanlarına girdiğiniz metinler, banner bloğunda görselin üzerinde görüntülenecektir. Metnin görünmesi için ilgili blok şablonunun “grid-banner.twig” olarak seçilmiş olması gerekmektedir.

- “URL” bölümünden, kullanıcı banner görseline tıkladığında yönlendirileceği bağlantı adresini tanımlayabilirsiniz.

- Banner bloğunda kullanılacak görsel, “Büyük Ekran” alanından yüklenmelidir. Basic tema yapısında Grid Banner bloğu için standart büyük görsel ölçüsü 924x924, küçük resimlerin ölçüsü 545x258 piksel olarak belirlenmiştir.

- Görsel üzerinde kullanıcıları yönlendirmek için “Buton Metni” alanını kullanabilirsiniz. Bu alana metin eklendiğinde, görsel üzerinde bir buton otomatik olarak oluşturulur.

- Banner bloğunda grid-banner.twig şablonunu kullanarak görsel eklediğinizde sistemin varsayılan tema görünümü otomatik olarak uygulanır. Bu şablon aktifken sütun genişliği belirlemenize gerek yoktur; görseller varsayılan boyutlarda eklendiğinde sistem yerleşimi otomatik olarak optimize eder.

- “Blok Ayarları” sekmesinde tanımlanan "Başlık" ve "Alt Başlık" bilgileri, banner bloğunun üst kısmında genel başlık olarak görüntülenir. Bu alanlar boş bırakıldığında herhangi bir başlık gösterilmez.

FIRSAT ÜRÜNLERİ BLOĞU