Online kurs bölümü

Bu makalede, kurslar hakkında bilgi içeren bir bloğu web sitenize nasıl ekleyeceğinizi anlatacağız.

Çevrimiçi öğrenme dünyasında, gezinme kolaylığı kullanıcıları çekmede ve elde tutmada önemli bir rol oynar. Özelleştirilebilir kurs kartları, web sitenizi daha etkileşimli ve bilgilendirici hale getirmenin harika bir yoludur.

Bu kartlar, ziyaretçilerin ilgilendikleri programları hızlıca bulmalarını ve tek bir düğmeyle kurs sayfalarına kolayca gitmelerini sağlar. Bu makalede, web sitenizin kullanılabilirliğini artırmak ve kullanıcıların eğitim hedeflerine daha hızlı ulaşmalarına yardımcı olmak için özelleştirilebilir kurs kartlarından oluşan bir bölümün nasıl kurulacağını inceleyeceğiz.

Çevrimiçi bilgi kartları kullanmak yerine, web sayfasına ders listeleri ekleyebilirsiniz: bölümde yalnızca gerekli kursu seçin ve tüm dersler görüntülenecektir.

"Kurs kartları" bölümünü nasıl eklenir

"Kurs kartları" bölümünü eklemek için, web sitenizin düzenleme modunda "+" işaretine tıklayın.

Ardından açılan menüde "Kurs kartları" bölümünü bulun ve bölümü web sitenize eklemek için üzerine tıklayın:

Bölüm web sitenize eklenecek ve içerik ayarları menüsü sizin için açılacaktır:

İçerik bölümü

Kurs kartları bölümünün içeriğini yapılandırmak, web sitesinde görüntülemek için projede zaten oluşturulmuş olan kurs(lar)ı seçmek ve kart öğelerini özelleştirmekten oluşur.

circle-info

Salebot platformunda kursların nasıl oluşturulacağı bölüm “Çevrimiçi kurslar”.

Kurs seçme

Web sitenizde sergilemek istediğiniz kursları seçin:

Bunu yapmak için, gerekli kursun adının bulunduğu kutuyu işaretleyin.

Seçilen kurslar, kurs ayarlarında belirlediğiniz kapakla birlikte hemen web sayfanızda görüntülenecektir.

Özelleştirme

Gerekli kursları seçtikten sonra, kart öğelerini özelleştirmeye devam edin:

  • Gölge

Bölümdeki kurs kartları için gölge yoğunluğunu ayarlayabilirsiniz:

a) gölgesiz:

b) hafif gölge:

c) güçlü gölge:

Kart öğeleri renk ayarları

Çeşitli öğelerin renklerini ayarlayarak kartın görünümünü özelleştirin. Etkileşimli üzerine gelme efektleri de ekleyebilirsiniz.

  • Metin Rengi: Kart üzerindeki ana metin rengini değiştirir (düğmeler hariç).

  • Kart Arka Planı: Kartın arka plan rengini ayarlar.

  • Kenarlık Rengi: Kartın dış çizgisinin veya çerçevesinin rengini tanımlar.

  • Düğme Metni: Düğme içindeki metnin rengini ayarlar (statik durum).

  • Düğme Arka Planı: Düğmenin arka plan rengini ayarlar.

Etkileşimli üzerine gelme efektleri (isteğe bağlı bölüm):

Kullanıcı imleci kartın üzerine geldiğinde bu öğelerin rengini dinamik olarak değiştirmek için üzerine gelme efektlerini etkinleştirin.

Artık "Kurs kartları" bölümünü kullanarak MaviBot sitenizde mevcut kursları nasıl görüntüleyeceğinizi biliyorsunuz.

circle-info

Arka plan ve görüntüleme ayarları için makaleye bakın “Genel bölüm ayarları”.

"Dersler" bloğu nasıl eklenir

Kurs içindeki ders listesini görüntülemek için bir blok eklemek üzere web sitesi düzenleme moduna geçin ve çalışma alanının üzerine gelin, ardından "+" işaretine tıklayın:

Sağ tarafta sitenin mevcut bölümlerinin bulunduğu bir menü açılır; burada "Dersler" bloğunu bulmanız gerekir:

"Kurs kartları"na tıklayın, ardından bloğun içeriğini yapılandırmak için bir menü açılacaktır:

Yalnızca Salebot’ta zaten oluşturulmuş olan gerekli kursu açılır menüden seçmeniz ve "Kaydet"e tıklamanız gerekir.

Ardından blok içeriğini özelleştirmek için ayarlara gidin:

Özelleştirme

"Ayarlar" düğmesine tıklayıp bölümün üzerine geldiğinizde, içeriği ve bloğun kendisini özelleştirmek için ayarlar açılır:

Hangi ayarlar mevcuttur?

  1. Ders listesi stili

Varsayılan olarak, ders listesinin stili yeni bir biçimde görüntülenir. Gerekirse, klasik biçimin daha özlü bir sürümünü ayarlayabilirsiniz:

Klasik stil
  1. Numaralandırma stili

Numaralandırma stili, derslerin yeni bir gösterim tarzı için mevcuttur. Numaralandırma, ders kartının içinde değişir:

  1. Ders ikonları

Kurs ayarlarında dersin içine bir önizleme eklediyseniz görüntülenirler.

İkonlar nasıl eklenir

1. Adım. Ders ayarlarına gidin:

Bunu yapmak için kurs ayarları moduna gidin ve Dersler sekmesini bulun:

Ardından, "Düzenle"ye tıklayın; bunun ardından ders sayfası düzenleme için açılacaktır.

2. Adım. Ders sayfası ayarlarını açın.

Ders sayfası ayarlarında "Genel" bölümüne gidin:

3. adım. Ders önizlemesini yükleyin

Temel bilgi ayarlarında resim ayarları listesini genişletin:

Ders önizlemesi için bir görsel yükleyin:

Ayarları kaydedin.

circle-check
  1. Arka plan deseni

Ders kartlarınıza hacim ve benzersizlik katar:

  1. Öğe yuvarlatma

Değer piksel cinsinden ayarlanır ve ders kartlarının köşelerini yuvarlar.

  1. Ders kartı stili

Ders kartlarını tek bir satıra veya tireli ya da tiresiz bir satıra düzenlemeye yardımcı olur.

  1. Arka plan ve metin rengi

Kartın arka plan rengini ve ders kartındaki yazı tipi rengini ayarlamak için geniş bir renk paleti mevcuttur:

Artık web sitenize ders listeleri eklemeyi ve bölümün içeriğini nasıl özelleştireceğinizi biliyorsunuz.

circle-info

Arka plan ve görüntüleme ayarları için makaleye bakın “Genel bölüm ayarları”.

Last updated