Çoğu kişi, bir iş yürütürken müşterilerinize ne zaman yanlarında olduğunuzu ve ne zaman olmadığınızı netleştirmeniz gerektiği konusunda hemfikirdir – ve bu nedenle WordPress’te çalışma saatlerinizi belirgin bir şekilde göstermeniz önemlidir.
Bu durum gerçek mekanda faaliyet gösteren mağazalar için daha yaygın olabilir veya onlardan beklenebilir. Fakat online hizmetler bile 7/24 mevcut olmayabilir. Açılış saatlerinizi web sitenizde yayınlamak, ziyaretçilerinizin – ve potansiyel müşterilerinizin – mağazalarınıza ziyaret planlamasını, randevu, bilet veya masa ayırtmasını veya destek ekibinizi aramasını kolaylaştırır. Hatta bir müşteri hizmetleri temsilcisinin aramalarına ne zaman cevap vermesini bekleyebileceklerini de bileceklerdir – özellikle müşterileriniz farklı bir saat dilimindeyse kullanışlıdır.
Web sitenizde öne çıkan açılış saatleri ile müşterilerinize ne kadar dakik ve profesyonel olduğunuzu gösterebilirsiniz. Zamanlarına değer verdiğinizi kanıtlayarak, hizmetlerinize daha fazla değer vermelerini sağlayacaksınız. Bu yüzden yerleşik çalışma saatleri kısa koduna sahip çok sayıda iş odaklı WordPress teması vardır.
Fakat temanızın yerleşik çalışma saatleri yoksa, bu makalede bunları sitenizde göstermenin birkaç yolunu göstereceğiz. İşte şunları ele alacağız:
-
Elementor Çalışma Saatleri Widget’ı için WordPress Eklentilerini Kullanarak Açık Saatleri Görüntüleme
-
Gutenberg Çalışma Saatleri Bloğu için WordPress Bloklarını Kullanarak Açık Saatleri Görüntüleme
-
Çalışma Saatleri Gösterge Eklentisini Kullanarak Açık Saatleri Görüntüleme
Elementor Çalışma Saatleri Widget’ı için WordPress Eklentilerini Kullanarak Açık Saatleri Görüntüleme
WordPress için Elementor web sitesi oluşturucuyu kullanıyorsanız, şanslısınız – web sitenize çalışma saatlerini eklemek gibi harika şeyler yapmanıza yardımcı olacak kendi WordPress Addons for Elementor eklentimiz var. Elbette eklenti ile yapabileceğiniz tek şey bu değil. Eklentinin tam, premium sürümü, resim sunumundan yapı çizelgeleri ve grafiklere kadar her şeyi kapsayan yüzün üzerinde farklı eklentiye sahiptir.
WordPress web sitenizdeki açık saatleri göstermek için ihtiyaç duyacağınız widget, Çalışma Saatleri widget’ıdır. Bu durum WordPress Addons for Elementor’ın ücretsiz sürümüne dahil olan widget’lardan biridir ve onu Elementor’un ücretsiz sürümüyle de kullanabilirsiniz. Öyleyse neden devam edip bu iki eklentiyi indirip kurmuyorsunuz ve size widget sayfasından örneklerden birini nasıl oluşturacağınızı göstereceğiz.
Widget İçeriğini Ayarlama
WordPress Eklentilerini ve Elementor’u yükledikten sonra, istediğiniz herhangi bir sayfaya veya gönderiye gidebilir, Elementor’da açabilir ve Çalışma Saatleri widget’ını arayabilirsiniz. Alanı iki sütun içerecek şekilde hazırladık, bu nedenle widget’ı soldakine sürükleyerek başladık. Aynısını yapmalısın.
Widget’ın çok sayıda örnek içeriğe sahip olduğunu ve seçenekler menüsünün Genel içerik seçeneğine açık olduğunu fark edeceksiniz.
Burada ayarlayabileceğiniz genel içerik seçenekleri, widget’ta gördüğünüz hemen hemen her şeyi içerir. Altyazı, başlık, metin, ayırıcı etkinleştirici ve menü öğesi seçeneklerinin tümü oradadır. Menü öğesi seçeneklerinde simgeler ayarlayabilecek ve günün adını ve saatleri ekleyebileceksiniz.
Altyazı, başlık ve metin dahil olmak üzere örnek için hazırladığımız içeriği ekledik. Öğelerden ikisini kaldırdık ve kalan üç öğenin içeriğini düzenledik.
Ayırıcıyı kullanmayı seçmediğimiz için kalan içerik seçenekleri bizi ilgilendirmiyordu, bu nedenle çalışma saatlerimizin görünümünü şekillendirmeye geçtik. Ayırıcıyı kullanmayı seçerseniz, türünü ve konumunu seçebilecek ve daha sonra herhangi birini kullanmayı seçerseniz simgeyi veya resmi ayarlayabileceksiniz.
Widget’ı Şekillendirme
Stil seçeneklerine geçtikten sonra doğrudan Genel Stil seçeneğine gidin – widget’ın arka plan rengini değiştirebileceğiniz yer burasıdır. Elbette orada yapabileceğiniz tek şey bu değil – arka planın türünü ayarlayabilir, ona bir görüntü ekleyebilir ve kenarlık türünü, genişliğini ve rengini seçebilirsiniz.
Öğe Stili seçeneklerine geçmeden önce Klasik arka plan türünü kullandık ve rengini #072c8d olarak ayarladık.
Öğe Stili seçenekleri, açık saat listenizdeki öğelerle ilgili her şeyin ince ayarını yaptığınız yerdir. Simge rengini ve boyutunu ayarlayabilir, gün ve saat için renk ve tipografi seçeneklerini değiştirebilir, ayrıca çizgi ve kenarlık türünü ayarlayabilirsiniz.
Öğe Stili seçeneklerinde birkaç ayarlama yaptık. Simge rengini #ffffff ve boyutunu 15 piksel olarak ayarladık. Gün ve saat harfleri için de aynı rengi belirledik. Hours Typography seçeneklerinde size 18px ve weight 500 olarak ayarladık. Çizgi tipimiz olarak “between” seçtik, border tipini dashed, genişliğini her yerinde 1 piksel ve rengini #ffffff80 olarak ayarladık. .
Son dokunuş olarak İçerik seçeneklerine geri döndük ve Pazar açık saatlerini gösteren üçüncü öğemizde küçük bir değişiklik yaptık. Rengini #ffffff80 olarak değiştirdik.
Metin Stili seçeneklerine geçiş – başlık ve alt başlık için renk, tipografi ve etiketlerin yanı sıra metin için renk, tipografi ve altı çizili seçenekleri seçebileceğiniz bölüm.
Başlık etiketini H3 ve rengini #ffffff olarak değiştirdik. Altyazı Tipografisi seçeneklerinde altyazı etiketi için H5, rengi için #ffffff ve boyutu için 17px seçtik. Metin rengi için yine #ffffff seçtik ve Metin Tipografisi seçeneklerinde ağırlığını 500 olarak belirledik.
Aşağıdaki iki bölüm, Ayırıcı Stili ve Ayırıcı Simge Stili, kullanıyorsanız ayırıcıyı ve simgesini stillendirebileceğiniz yerlerdir. Yapmadık, bu yüzden doğrudan Aralık Stili seçeneklerine atladık.
Aralık Stili seçenekleri, widget için boşluk, dolgu ve kenar boşlukları ayarlamanıza olanak tanır. Öğeler arasında ne kadar boşluk olacağını, öğe tutucuda ne kadar dolgu olacağını veya başlıklar ve alt yazılar için alt kenar boşluklarını seçebilirsiniz.
Öğeler arasındaki boşluk için 23 piksel seçtik. Tutucu dolgu değerlerinin bağlantısını kaldırdık ve en soldan başlayarak 63 piksel, 60 piksel, 63 piksel ve 60 piksel olarak ayarladık. Alt başlık kenar boşluğu için 29px ve üst metin kenar boşluğu için 32px ayarladık.
Bununla, açık saat gösterimimizin yarısını bitirdik. Diğer yarısı için, zaten yapmış olduğumuz parçacığı sağ tıklayıp çoğaltmak, oluşturmaya başlamanın harika bir yoludur.
İkinci pencere öğesiyle yaptığımız değişiklikler arasında üçüncü öğenin renginin #e35521, arka plan renginin #fbf6eb ve simge, gün, saat, başlık, altyazı ve metnin renklerinin ayarlanması yer alır. , #1e1e1e’ye. Çizgi tipi için rengi #1e1e1e23 olarak ayarladık.
Çalışma saatleri tablonuz tam olarak böyle görünmüyorsa endişelenmeyin. Kullanmakta olduğunuz temaya ve ayarlarına bağlı olarak sonuçlarınız biraz farklı olabilir. Ayarı denemekten ve web sitenize en uygun açık saat görüntüsünü oluşturmaktan çekinmeyin.
Gutenberg Çalışma Saatleri Bloğu için WordPress Bloklarını Kullanarak Açık Saatleri Görüntüleme
WordPress’in Gutenberg editörü, web siteniz için her türlü sayfayı oluşturmak için kullanabileceğiniz güçlü bir blok tabanlı araçtır. Tercih ettiğiniz sayfa oluşturucu buysa ve işletmenizin açık olduğu saatleri web sitenizde bir yerde görüntülemek için kullanmak istiyorsanız, WordPress Blocks for Gutenberg tam ihtiyacınız olan eklentidir.
Tam olarak 81 blokla, WordPress Blocks’un tam sürümü, Gutenberg’in yerel blok seçimini genişletmek için başvuracağınız araç olmayı hedefliyor. Bloklar, WooCommerce blokları, tipografi ve vitrin blokları gibi kullanıma dayalı kategorilere ayrılmıştır.
Çalışma saatlerini görüntülemek için kullanabileceğiniz blok, Çalışma Saatleri Gutenberg bloğu, bir iş bloğu ve aynı zamanda birinci sınıf bir bloktur. Bu durum bu bloğa erişebilmek için eklentinin premium sürümüne ihtiyacınız olacağı anlamına gelir. Bu kısmı hallettikten ve eklentiyi yükledikten sonra bir sayfa açın veya gönderin. Elementor eklentimizi kullanarak oluşturduğumuz aynı örneği oluşturmak için bloğu nasıl kullanabileceğinizi size göstereceğiz.
Blok İçeriğini Ayarlama
Başlamadan önce, bloklar için ayarlanmış iki sütununuz olduğundan emin olun. Çalışma Saatleri bloğunu bunlardan birine eklediğinizde, size hemen çok sayıda örnek içerik gösterilir – başlık, alt başlık, demo içerik ve beş öğe.
Sağ tarafta, alt başlık, başlık ve metinden başlayarak bir dizi içerik seçeneği göreceksiniz. Blokla yaptığımız ilk şey, örnek kopyayı kendi kopyamızla değiştirmek oldu. Çalışma saatleri tablosunun altında bir miktar metin görüntülemenizi sağlayan Metin alanı için, beyaz olduğu için şimdilik tamamen görünmez olan tıklanabilir bir telefon numarası oluşturmak için bazı kodlar kullandık.
Daha da ileri giderek, sütun duyarlı düzenini 680 pikselin altında etkinleştirecek şekilde ayarladık. Bir sonraki büyük içerik seçenekleri grubu, öğe seçenekleridir. Günleri ve saatleri, ayrıca diğerlerinden öne çıkmalarını istiyorsanız belirli öğelerin renklerini ve bir simgeyi ayarladığınız yer burasıdır.
Varsayılan beş öğe yerine üç öğe oluşturduk. Uygun gün ve saat bilgilerinin yanı sıra hepsine bir simge ekledik. Üçüncü öğe için rengini #ffffff80 olarak belirledik. Bu durum onu şu anda sahip olduğumuz beyaz arka plana karşı beyaz ve görünmez yaptı.
Örneğimizdeki gibi bir çalışma saatleri tablosu oluşturmak için ihtiyaç duyacağınız tüm içerik ayarı budur. İşletmenizin açık saatlerini daha iyi yansıtacak şekilde öğe eklemek veya çıkarmakta ve kopyayı değiştirmekte elbette özgürsünüz ve açık saatlerinizin görünümünü şekillendirmeye geçmeye hazırlanın.
Bloğu Şekillendirmek
Çalışma Saatleri bloğunu şekillendirmeye başlamak için harika bir yer Stil > Genel’dir çünkü arka plan seçenekleri buradadır. Klasik bir arka plan – düz bir renk veya bir resim ve birçok ilginç ayara sahip bir degrade arka plan arasında seçim yapabileceksiniz.
Örneğimizde klasik arka planı kullandık ve rengini #072c8d olarak ayarladık.
Stil > Öğe seçenekleri’ne döndüğünüzde, öğenin her öğesinin (simge, gün, saat ve çizgi) kendi seçenekler bölümüne sahip olduğunu göreceksiniz. Burası, bu öğelerin boyutunu ve rengini ve uygun olduğunda diğer stil ve tipografi seçeneklerini ayarlayabileceğiniz yerdir.
Simge seçenekleri için rengi #ffffff ve boyutu 15px olarak değiştirdik. Ardından rengi #ffffff olarak değiştirdiğimiz gün seçeneklerine geçtik. Saatler için #ffffff onaltılık kodunu kullanarak rengi aynı beyaza ayarladık. Fakat tipografi seçeneklerini de kullanarak yazı tipi ailesini DM Sans, yazı tipi boyutunu 18 piksel, ağırlığı 500 ve satır yüksekliğini 26 piksel olarak değiştirdik.
Çizgi seçenekleri için bordürümüzü düz, rengini #ffffff80 olarak ayarladık.
Stil > Metin seçeneklerine geçerek bloğun başlığı, alt başlığı ve metni için seçenekleri ayarlayabilirsiniz. Elinizin altındaki seçenekler, metne stil vermek için ihtiyaç duyduğunuz seçeneklerdir – etiketler, tipografi ve renk seçenekleri.
Başlık ve alt başlık için yaptığımız tek değişiklik rengini #ffffff olarak değiştirmek oldu. Metin için de aynı rengi kullandık ama tipografi seçeneklerinde de ağırlığı 500 olarak ayarladık.
Stil seçeneklerinin son grubu Aralık seçenekleridir. Eklemek veya ince ayar yapmak istediğiniz boşluk, dolgu ve kenar boşluğu ne olursa olsun, bunu yapacağınız yer burasıdır. Daha spesifik olarak bunlar, öğeler ile öğe ve tutucu dolgusu ile alt başlık, başlık ve metin kenar boşlukları arasındaki boşluğu ayarlayabileceğiniz seçeneklerdir.
Çalışma saatleri bloğumuz için, öğeler arasındaki boşluğu 23px olarak ayarladık. Tutucu dolgusu için soldan sağa şu değerleri girdik: 63px, 60px, 63px, 60px. Başlık kenar boşluğunu alttan 27 piksele ve metin kenar boşluğunu üstten 32 piksele ayarladık.
İki bloğun ilki için bu kadar. İkinciyi oluşturmanın en kolay yolu, ilk bloğu çoğaltmak, onu sağdaki sütuna taşımak ve ardından renkleri değiştirmek olacaktır.
Biz de tam olarak bunu yaptık. Metinde telefon numarasını oluşturmak için kullandığımız kodda – yani İçerik seçeneklerinde – rengi #1e1e1e olarak ayarladık. Öğelerden simgeleri kaldırdık ve üçüncü öğenin rengini #e35521 olarak değiştirdik.
Stil seçeneklerine geçerek gün ve saat renklerini #1e1e1e olarak ve Stil > Çizgi altındaki kenarlık için #1f1f1f33 olarak değiştirdik. Arka plan rengini #fbf6eb olarak değiştirdik. Son olarak Stil > Metin altında tüm renkleri #1e1e1e olarak değiştirdik.
Çalışma Saatleri Gösterge Eklentisini Kullanarak Açık Saatleri Görüntüleme
Öneririz…