Grav - Medya
Medya dosyaları, görüntüler, videolar ve diğer birçok dosya gibi farklı görüntüleme içeriği türleri içerir. Grav, bu dosyaları herhangi bir sayfa tarafından kullanılmak üzere otomatik olarak bulur ve işler. Sayfanın yerleşik işlevselliğini kullanarak meta verilere erişebilir ve medyayı dinamik olarak değiştirebilirsiniz.
Smart-cachingGerektiğinde önbellekte oluşturulan medyayı oluşturan Grav tarafından kullanılır. Bu şekilde, medya tekrar tekrar oluşturmak yerine önbelleğe alınmış sürümü kullanabilir.
Desteklenen Medya Dosyaları
Grav tarafından desteklenen medya dosyası türleri aşağıdadır -
Image - jpg, jpeg, png
Animated Image - gif
vectorized Image - svg
Video - mp4, mov, m4v, swf
Data/information - txt, doc, pdf, html, zip, gz
Görüntüleme Modları
Aşağıda, Grav'da birkaç görüntü modu bulunmaktadır -
Source - Görüntünün, videonun veya bir dosyanın görsel görüntüsüdür.
text - Medya dosyalarının metinsel sunumu.
thumbnail - Medya dosyası için küçük resim görüntüsü.
Küçük Resimleri Bulma
Küçük resimleri üç konumu kullanarak bulabilirsiniz -
In the same folder where your media files exists- [ortam-adı]. [Ortam-uzantısı] .thumb. [Başparmak-uzantısı]; burada, ortam-adı ve ortam-uzantısı gerçek ortam dosyasının adı ve uzantısıdır ve başparmak uzantısı, görüntü ortam türü tarafından desteklenen uzantıdır.
User Folder − kullanıcı / resimler / medya / başparmak- [medya uzantısı] .png; burada, medya uzantısı gerçek medya dosyasının uzantısıdır.
System folder- system / images / media / thumb- [ortam uzantısı] .png; burada, medya uzantısı gerçek medya dosyasının uzantısıdır.
Işık Kutuları ve Bağlantılar
Grav, ışık kutusu eklentisinin okuması için bazı öğeleri içeren bir bağlantı etiketi çıktısını verir. Eklentilerinize dahil olmayan bir lightbox kitaplığı kullanmak istiyorsanız, kendi eklentinizi oluşturmak için aşağıdaki özellikleri kullanabilirsiniz.
rel- Işık kutusu bağlantısını gösterir. Değer ışık kutusu.
href - Medya nesnesinin URL'sidir.
data-width - Kullanıcı tarafından seçilen ışık kutusunun genişliğini ayarlayın.
data-height - Kullanıcı tarafından seçilen ışık kutusunun yüksekliğini ayarlayın.
data-srcset - srcset dizesi, görüntü ortamı durumunda kullanılır.
Hareketler
Grav'daki Builder kalıbı, birden fazla eylemi gerçekleştirmek için medyayı işlemek için kullanılır. Tüm ortamlar için desteklenen bazı eylem türleri varken, bazıları yalnızca belirli ortamlar için kullanılabilir.
Genel
Ortam türleri için kullanılabilen 6 tür genel eylem vardır. Her eylem aşağıda açıklanmıştır.
| Sr.No. | Eylem ve Açıklama |
|---|---|
| 1 | url ()
url () geri veriyor raw url path medyaya. |
| 2 | html ([başlık] [, alt] [, sınıflar]
Çıktı, ortam için geçerli bir html Etiketine sahip olacaktır. |
| 3 | display(mode) Farklı ekran modları arasında geçiş yapmak için kullanılır. Ekran moduna geçtiğinizde, tüm eylemler sıfırlanacaktır. |
| 4 | bağlantı ()
Bağlantıdan önce uygulanan işlemler, bağlantının hedefine uygulanacaktır. |
| 5 | ışık kutusu ([genişlik, yükseklik])
Lightbox, bağlantı eylemine benzer, ancak bazı ekstra özelliklere sahip bir bağlantı oluşturması bakımından küçük bir farka sahiptir. |
| 6 | Küçük resim
Herhangi bir medya dosyası türü için sayfa ve varsayılan arasında seçim yapın ve bu manuel olarak yapılabilir. |
Görüntüler Üzerindeki Eylemler
Aşağıdaki tablo, görüntülere uygulanan birkaç eylemi listelemektedir.
| Sr.No. | Eylem ve Açıklama |
|---|---|
| 1 | yeniden boyutlandırma (genişlik, yükseklik, [arka plan])
Yeniden boyutlandırarak görüntünün genişliğini ve yüksekliğini değiştirir. |
| 2 | forceResize (genişlik, yükseklik)
Orijinal orana bakılmaksızın görüntüyü gerektiği kadar uzatır. |
| 3 | cropResize (genişlik, yükseklik)
Görüntüyü, genişliğine ve yüksekliğine göre daha küçük veya daha büyük boyutta yeniden boyutlandırır. |
| 4 | kırpma (x, y, genişlik, yükseklik)
Görüntüyü x ve y konumundan genişlik ve yükseklik olarak açıklandığı gibi kırpar. |
| 5 | cropZoom (genişlik, yükseklik)
İsteğe göre görüntüleri yakınlaştırmaya ve kırpmaya yardımcı olur. |
| 6 | kalite (değer)
Görüntü kalitesi değerini 0 ile 100 arasında ayarlar. |
| 7 | olumsuzlamak ()
Renkler olumsuzluk içinde tersine çevrilir. |
| 8 | parlaklık (değer)
Birlikte value nın-nin -255 -e +255, görüntüye parlaklık filtresi eklenir. |
| 9 | kontrast (değer)
Kontrast filtresini görüntüye uygulamak için -100 ile +100 arasındaki değer kullanılır. |
| 10 | gri tonlamalı ()
Görüntüyü işlemek için gri tonlama filtresi kullanılır. |
| 11 | kabartma ()
Kabartma filtresi, görüntüyü işlemek için de kullanılır. |
| 12 | pürüzsüz (değer)
Yumuşatma filtresi, değeri -10 ile +10 arasında ayarlanarak görüntülere uygulanır. |
| 13 | keskin()
Keskinleştirme filtresi görüntüye eklenir. |
| 14 | kenar ()
Görüntüye kenar bulma filtresi eklenir. |
| 15 | renklendirmek (kırmızı, yeşil, mavi)
Kırmızı, yeşil ve mavi renkleri ayarlayarak görüntüyü renklendirir. |
| 16 | sepya()
Sepya filtre, vintage bir görünüm vermek için eklenmiştir. |
Animasyon ve Vektörizasyon Resimleri ve Videoları
Resimler ve videolar üzerinde animasyonlu ve vektörleştirilmiş işlemler yapılır. Resimlerde ve videolarda gerçekleşen eylem aşağıdadır.
| Sr.No. | Eylem ve Açıklama |
|---|---|
| 1 | yeniden boyutlandır (genişlik, yükseklik)
Yeniden boyutlandırma işlemi ayarlanacak width, height, data-width ve data-height Öznitellikler. |
Kombinasyonlar
Grav, görüntülerle çalışmayı kolaylaştıran görüntü işleme işlevine sahiptir.
Yukarıdaki kod, aşağıda gösterildiği gibi bir çıktı oluşturacaktır -
Duyarlı görüntüler
Aşağıdaki tablo birkaç tür duyarlı görüntüyü listelemektedir.
| Sr.No. | Eylem ve Açıklama |
|---|---|
| 1 | Daha yüksek yoğunluklu ekranlar
Dosya adına bir sonek eklediğinizde sayfaya daha yüksek yoğunluklu bir resim ekleyebilirsiniz. |
| 2 | Medya sorguları olan boyutlar
Dosya adına bir sonek eklediğinizde sayfaya daha yüksek yoğunluklu bir resim ekleyebilirsiniz. |
Meta dosyaları
image1.jpg, archive.zipveya başka herhangi bir referans değişkenleri ayarlama yeteneğine sahiptir veya bir meta dosyası tarafından geçersiz kılınabilir. Bu dosyalar daha sonra biçimini alır<filename>.meta.yaml. Örneğin, bir görüntünüz varsaimage2.jpg, ardından meta dosyanız şu şekilde oluşturulabilir: image2.jpg.meta.yaml. İçerik yaml sözdiziminde olmalıdır. Bu yöntemi kullanarak istediğiniz herhangi bir dosyayı veya meta veriyi ekleyebilirsiniz.