Tasarım: renkler, arka plan ve yazı tipi

Oluşturucunun “Tema” sekmesinde tüm sayfanın görünümünü ayarlarsın: renkler, arka plan, düğme şekli ve yazı tipi. Özel CSS dışındaki tüm değişiklikler yaklaşık 2 saniye sonra otomatik olarak taslağa kaydedilir ve bir sonraki yayınlamada yayına girer.

Sekme yukarıdan aşağıya şöyle düzenlenmiştir: “Şablon”, “Hazır ayarlar”, “Renkler”, “Arka plan”, “İçeriğin arkasındaki yüzey”, “Düğme stili”, “Yazı tipi” ve “Özel CSS”. Şablonların kendi makalesi var.

#Hazır ayarlar

Hazır ayarlar hazır renk kombinasyonlarıdır. Tek tıklama arka plan rengini, metin rengini, düğme rengini ve düğme stilini birlikte ayarlar ve kendi düğme metin rengini sıfırlar. 16 hazır ayar var: Classic, Midnight, Harbor, Ocean, Forest, Sunset, Rose, Slate, Mono, Frost, Lavender, Amber, Charcoal, Mint, Crimson ve Sand. Etkin hazır ayar, dört değerden hiçbirini değiştirmediğin sürece işaretli kalır.

#Renkler

Her biri bir renk seçici ve hex değeriyle dört temel renk (saydamlık yok):

“Arka plan”

Sayfanın arka plan rengi; arka plan türü “Renk” olduğunda da kullanılır.

“Metin rengi”

Ad, biyografi ve metinler için renk.

“Düğme rengi”

Bağlantı düğmelerinin rengi ve bloklardaki düğmeler için varsayılan renk.

“Düğme metni”

Düğmelerdeki metin. Kendi seçimin olmadan düğme renginde iyi okunan bir renk otomatik olarak seçilir.

Gösterilen değer, şablondan gelse bile her zaman o anda geçerli olandır. Birçok bloğun “Görünüm seçenekleri” altında kendi renk alanları vardır. “Varsayılan (temadan)” gösterdikleri sürece bu renkleri izlerler.

#Arka plan

“Renk”, “Görsel”, “Gradyan” ve “Video” düğmeleri sayfa arka planının türünü belirler. Geçiş yaptığında oluşturucu, oluşturucuda kaldığın sürece diğer türlerin değerlerini hatırlar.

Renk

Sayfa “Renkler” bölümündeki “Arka plan” rengini kullanır.

Görsel

“Masaüstü görseli”

Büyük ekranlar için arka plan, 1920 × 1080 px.

“Mobil görsel”

İsteğe bağlı, dikey 1080 × 1920 px. Boşken “masaüstüyle aynı” gösterir ve masaüstü görseli kullanılır.

“Seç” dosyalarını, “Yönet ↗” dosyalar sayfasını açar, “Kaldır” görseli çıkarır. Bir görsel tam olarak hedef boyutta değilse kırpma aracı açılır ve kırpılan görsel yeni bir dosya olarak kaydedilir. Daha fazlası Sayfa oluşturucuda görseller bölümünde.

Gradyan

“Başlangıç rengi” ve “Bitiş rengi”

Gradyanın iki rengi.

“Açı”

5’lik adımlarla 0 ila 355 derece arası yön.

“Hazır ayarlar”

Hazır gradyanlar: Indigo, Sunset, Ocean, Forest, Berry ve Midnight.

Video

“Masaüstü videosu”

Bir video dosyasına (.mp4 veya .webm) doğrudan bağlantı ya da video dosyalarından “Video seç”.

“Mobil video”

İsteğe bağlı, örneğin mobil veri için daha küçük bir dosya. Boşken masaüstü videosu kullanılır.

Video sessiz ve döngü hâlinde, kontroller olmadan oynatılır. Sistem ayarlarında hareketi azaltmayı açmış ziyaretçiler için gizlenir. MP4 veya WebM biçiminde 8 MB’a kadar dosyalar önerilir.

Katman opaklığı

Görsel, gradyan ve video için %0 ila 80 arası bir kaydırıcı, metnin daha kolay okunması için arka planın üzerine koyulaştıran bir katman koyar.

Görsel, gradyan veya videodan oluşan bir sayfa arka planı şablonun arka plan görsellerinin yerini alır. Şablonun görsel alanları o zaman bununla ilgili bir not gösterir. “Renk” ile şablon görselleri yeniden görünür.

#İçeriğin arkasındaki yüzey

Bir arka plan görseli, gradyanı veya videosu üzerindeki metni okunur kılar:

“Kapalı”

Yüzey yok; içerik doğrudan arka planın üzerinde durur.

“Tüm içerik”

Tüm içeriğin arkasında tek bir kart.

“Blok başına”

Profilin ve her bloğun arkasında ayrı bir kart.

“Opak” veya “Yarı saydam”

Yüzey açılır açılmaz görünür. Yarı saydam, arka planın görünmesini sağlar.

Bu ayarın Business Card şablonunda etkisi yoktur.

#Düğme stili

Düğme stili varsayılandır. Onu Bağlantılar bloğunda ve bağlantı başına geçersiz kılabilirsin (iki yerde de “Köşe yarıçapı”).

#Yazı tipi

DM Sans, Figtree, Sora, Plus Jakarta Sans, Raleway, Inter, Poppins, Montserrat, Nunito, Outfit, Space Grotesk ve “Sistem varsayılanı” (cihazın kendi yazı tipi) arasından seçebilirsin. “Aa — Pijamalı hasta yağız şoföre çabucak güvendi.” satırı bir önizleme gösterir.

LinkHarbor tüm yazı tiplerini kendisi sunar. Ziyaretçilerinin tarayıcıları bunlar için Google Fonts’tan veya diğer üçüncü taraf sunuculardan hiçbir şey yüklemez.

#Hangi ayar kazanır

Renkler ve şekiller dışarıdan içeriye doğru inceltilir:

1. Şablon: temel stil ve varsayılan renkler
2. Tema sekmesi: tüm sayfa için renkler, arka plan, düğme stili ve yazı tipi
3. Bir bloğun görünüm seçenekleri: o blok için renkler ve şekiller
4. Tek bir bağlantının stili: diğer tüm değerlere göre önceliklidir
5. Özel CSS: kontrollerin kapsamadığı her şey için

Kendi CSS’inle ince ayarı nasıl yapacağın Özel CSS bölümünde anlatılıyor.