Online ticaretin sularına girdiğinizde ve online bir iş kurduğunuzda veya işinizi online ortamda büyütmek için dijital araçlar kullandığınızda, elinizin altında bulunan çeşitli araçlardan kendinizi kolayca bunalmış bulabilirsiniz. Bununla birlikte temel ilkelere bağlı kalırsanız, kontrol listenizde müşteri güvenini oluşturmayı ve sürdürmeyi bulacaksınız. Üstünü çizmek için yapabileceğiniz birden fazla şey var – örneğin, web sitelerinize referanslar eklemek yardımcı olabilir. Fakat işinizi insanlaştırmak ve ekibinizi WordPress web sitenizde görüntülemek de bunu yapmanın harika bir yoludur.
Bu yüzden WordPress Addons for Elementor eklentimize bir ekip widget’ı ekledik – müşterilerinize veya müşterilerinize sizin ve ekibinizin tıpkı onlar gibi gerçek insanlar olduğunuzu göstermenin kolay bir yolunu sunmak için. WordPress Eklentileri, bir ekip ekranı ayarlamak gibi sıra dışı bir şey yapmanız için size kolay bir seçenek sunarak zaten harika olan bir site düzenleyiciyi daha da iyi hale getiren Elementor widget’larının mükemmel bir koleksiyonudur.
Öte yandan, web sitenizde sayfalar oluşturmak için Gutenberg editörünü kullanmayı tercih ediyorsanız, WordPress Blocks for Gutenberg eklentimizi kullanmalısınız. 47 diğer ücretsiz blok ve 33 premium blok ile birlikte bir takım bloğuna sahiptir. Bu makale, her iki eklentiyi kullanarak WordPress web siteniz için nasıl bir ekip ekranı oluşturacağınızı gösterecektir.
Elementor için WordPress Eklentileri ile Ekibinizi Görüntüleme
WordPress Addons for Elementor eklentisini kullanarak ekibinizi WordPress’te nasıl görüntüleyeceğinizi göstermek için eklenti sayfasındaki örneklerden birini kullanacağız. Bunun için bir video eğitimi de hazırladık, böylece makaleleri okumak yerine video izlemeyi tercih ederseniz izleyebilirsiniz.
Fakat başlamak için eklentinin kurulu olduğundan emin olmanız gerekir. Elementor’u da yüklemiş olmalısınız, bu nedenle ilk adımınız web sitenizin kontrol paneline gitmeli, Eklentiler > Yeni Ekle’ye gitmeli ve iki eklentiyi bulmalı, yüklemeli ve etkinleştirmelisiniz.
Bunun dışında bir sonraki adım, alanı widget’ı eklemek için hazırlamaktır. Düzenlemek istediğiniz bir gönderi veya sayfa bulun ve dört sütunlu bir bölüm oluşturun. Widget’ın çalışma şeklinden dolayı, her ekip üyesi için bir kez olmak üzere onu dört kez kullanmamız gerekecek.
Doğru sonuçları elde etmek için bölüm ve sütun ayarlarının da biraz ayarlanması gerekir. Layout > Layout bölümündeki bölüm için içerik genişliğini Full With olarak değiştirdik. Daha sonra Advanced > WordPress Essential Addons Grid’de “Bu satırı ‘In Grid’de yap” seçeneği için evet’i seçtik ve grid satırı davranışını varsayılan olarak bıraktık.
Sütunlara gelince, onlara biraz dolgu ekledik. Advanced > Advanced’e gittik ve en soldaki sütunun sağına 18px padding ekledik. Bir sonrakinde sağda 12 piksel ve solda 6 piksel var. Bir sonraki sütunun sağında 6 piksel ve solunda 12 piksel var ve son sütunun sağında 18 piksel dolgu var.
Elbette bu ayarların her durumda aynı sonuçları vermeyebileceğini unutmamalısınız. Kullanmakta olduğunuz temaya göre farklı görünecektir ve tam olarak doğru görünmesi için bazı ek ayarlamalara ihtiyacınız olabilir. Biz böyle yaptık.
İçeriği Ekip Widget’ına Ekleme
Çalışma alanımız kurulduğunda, bir sonraki adım ilk widget’ı eklemek olacaktır. En soldaki sütuna ekledik ve kalan sütunları doldurmak için çoğaltmadan önce tam olarak ayarlayacağız. Bu bizim başlangıç noktamız.
Genel stil ayarları altında, pencere öğesinin düzenini seçme ve bilgi kartını görüntülemenin farklı yollarını seçme seçeneğine sahipsiniz. Hatta adı, rolü, resmi, resim oranlarını seçebilir ve beraberindeki simgelerle birlikte sosyal medyaya veya kişiye bağlantılar ekleyebilirsiniz.
Varsayılan bilgileri düzenin altında tuttuk ve hayali ekip üyemizin adını ve konumunu doldurduk. Hatta bir fotoğraf ekledik ve iyi uydukları için orijinal oranlarını koruduk. Sosyal medyaya gelince, bir tane daha ekledik ve Twitter, Pinterest ve Instagram için uygun simgeler belirledik.
Bununla birlikte ilk pencere öğesi için ihtiyacımız olan tüm içeriği ekledik. Bir sonraki adım, stil vermektir.
Ekip Widget’ını Şekillendirme
Widget tarafından sağlanan stil seçenekleri birkaç sekmede ayrılmıştır. Genel stili ve öğeler arasındaki aralığı seçmenize izin vererek size ek içerik stil seçenekleri sunar. En baştan başlayacağız ve önce Stil seçeneklerini ele alacağız.
Genel Stil seçenekleri, ekip üyesinin ad etiketini ve ayrıca hem ad hem de rol için renk ve tipografi seçeneklerini ayarlayabileceğiniz yerdir. Söz konusu tipografi seçenekleri, yazı tipi ailesi ve boyutundan satır yüksekliğine ve harf aralığına kadar her şeyi içerir; bu nedenle widget’ı özelleştirmenin birçok yolu vardır.
Burada yaptığımız ilk şey, ad etiketini varsayılan H4’ten H5’e değiştirmek oldu. İsim rengini veya tipografiyi değiştirmedik ama rol için ikisini de değiştirdik. Renk için #c4c4c4 kullandık. Tipografi için boyutu 16px ve ağırlığı 500 olarak değiştirdik.
Bir sonraki seçenek grubu, simgelerle ilgilidir – varsayılan renkleri, üzerine geldiklerinde sahip oldukları renk ve boyutları. Role uyması için varsayılan rengi #1e1e1e, vurgulu rengi #c4c4c4 ve boyutu 15 piksel olarak değiştirdik.
Genel Stil altındaki son seçenekler, yalnızca belirli pencere öğesi düzenleri için geçerli olan görüntü üzerine gelme seçenekleri ve metin rengi ve tipografidir. Bizimki onlardan biri olmadığı için, sadece görüntü üzerine gelme seçeneklerini Yakınlaştır olarak değiştirdik.
Bir sonraki durağımız Space Style seçenekleri.
Aralık stili, adından da anlaşılacağı gibi, widget’ınızdaki çeşitli öğeler arasındaki boşluğu ayarlamanıza olanak tanır. Ad ve rol için kenar boşluklarını, simgeler arasındaki boşluğu, bir bütün olarak içerik için üst kenar boşluğunu ve metin için alt kenar boşluğunu ayarlayabileceğiniz yerdir – biz seçmediğimiz için buna sahip değiliz. izin veren düzen.
Yukarıdan aşağıya doğru girdiğimiz değerler 10px, 5px, 25px ve 22px şeklindedir.
İçerik hizalamasını seçmenize izin veren İçerik Stili seçenekleri kalır. Orada hiçbir şeyi değiştirmedik ve ilk ekip widget’ımız yapıldı.
Bu widget ihtiyacımız olan tüm ayarlara sahip olduğundan, kalan dördünü oluşturmanın en iyi yolu orijinali üç kez çoğaltmak ve ardından widget’ların içeriğini değiştirmektir. Widget’a sağ tıklayıp “kopyala”yı seçmek ve ardından ortaya çıkan widget’ı boş bir sütuna sürüklemek kadar kolaydır. İçerik değişikliğinden sonra, elimizdeki şey bu.
Tabii ki, animasyonlu içerik kartları, widget’lar arasındaki kenarlıklar ve diğer pek çok heyecan verici öğe için tamamen farklı ayarlar seçebilirsiniz. Bu kısa öğreticiyi kullanmanın en iyi yolu ilham almaktır.
Ekibinizi Gutenberg için WordPress Blokları ile Görüntüleme
Şimdi WordPress Blocks for Gutenberg eklentisindeki Team bloğunu kullanarak aynı ekip görüntüsünü nasıl oluşturabileceğinizi görelim. Eklentiyi kurup etkinleştirdikten sonra, çalışma alanınızı ayarlamanız gerekir – görüntülemek istediğiniz her ekip üyesi için bir sütun oluşturun. Bloğu ilkine eklemeden önce dört tane yaptık.
Engelleme ayarlarını sağ taraftaki Ayarlar Kenar Çubuğunda bulacaksınız. İlk önce varsayılan olarak içerik ayarları açılır ve blok içeriğinin düzenini, ekip üyesinin adını, rolünü ve görüntüsünü ve sosyal medyaya bağlantılar ekleme seçeneğini seçmenize olanak tanır.
Bloğu içeriğimizle doldurduk, Twitter, Pinterest ve Instagram’ı sosyal medya olarak ekledik.
İlk takım bilgi bloğu için ihtiyaç duyacağımız tüm içerik bu kadar, böylece onu şekillendirmeye devam edebiliriz.
Takım Blokunu Şekillendirme
Stil sekmesi, genel içerik, ad, rol, metin ve sosyal bilgiler için farklı stil seçenekleri içerir. Fareyle üzerine gelindiğinde görüntünün davranışını ayarlayabileceğiniz, simgeler arasındaki boşluğu, içerik için üst kenar boşluğunu ve içerik hizalamasını ayarlayabileceğiniz bir dizi seçenek olan Stil > İçerik ile başlayalım.
Görüntünün üzerine gelme davranışımız olarak Yakınlaştır’ı seçtik. Hatta simgeler arasındaki boşluğumuz için 25px ve üst kenar boşluğu için 22px ayarlıyoruz.
Stil > Ad altında, ad için etiketi ayarlayabilir ve rengini ayarlayabilirsiniz. Tipografi altında, eksiksiz tipografi seçeneklerine erişebileceksiniz ve ayrıca adın alt kenar boşluğunu ayarlama seçeneğiniz de olacak. Etiketi H5 olarak değiştirdik ve alt kenar boşluğunu 5px olarak koyduk.
Stil > Rol için, Ad eksi etiketi için aynı seçenekleri elde edersiniz. Burada isim rengini #c4c4c4 olarak değiştirdik, Tipografi seçeneklerinde yazı tipi boyutunu 16 piksel, ağırlığı 500 ve satır yüksekliğini 23 piksel olarak ayarladık. Alt kenar boşluğunu 10px olarak ayarladık.
Düzenimizde hiç metin yok, bu yüzden Stil > Metin’i atlayabiliriz. Orada bulacağınız seçenekler, renk ve tipografi seçmenize izin verecektir.
Stil > Sosyal’e geçtiğinizde dolgu, kontur ve fareyle üzerine gelme için birkaç renk seçeneği göreceksiniz. Hatta simge boyutunu da ayarlayabileceksiniz. Dolgu rengimizi #1e1e1e ve hover rengimizi #c4c4c4 olarak ayarladık.
Gerisini ilk takım üyesi blok seti ile doldurmak kolaydır. İlkinin kopyalarını oluşturun ve her yeni ekip üyesi için içeriğini değiştirin; yakında tüm ekranı web sitenizde online olmaya hazır hale getireceksiniz.
Konunun Özeti
Basit bir ekip üyesi galerisinin web sitenizi ziyaret eden insanlar üzerinde sahip olabileceği gücü asla hafife almamalısınız – ister müşteri ister gelecekteki ekip eklemeleri olsunlar. Ekibinizi WordPress’te nasıl sergilediğinize odaklanmalısınız. Gösterdiğimiz gibi, Elementor’un Ekip widget’ı için QI Eklentileri sizi seçenekler arasında boğmayacak. Fakat daha fazlasını istemenize de neden olmayacak – basit ama çok kullanışlı kalmak için tam doğru noktaya geliyor.