Çerçeve, bir sitede (pencerede) başka bir web sayfasının görünür olduğu bir alandır. Web yöneticileri, arkadaşlarının veya ortaklarının sitelerinin ana sayfasını sergilemek için bu fırsatı kullanır. Aynı teknik, arama formunun yanında sonucun bulunduğu kutularda vb. görüntülemek için kullanılır.
Ancak çoğunlukla çerçeveler, önemli sayıda menü öğesi ve alt menünün gerekli olduğu büyük web portallarının oluşturulmasında kullanılır. Genellikle bu tür insanlar hakkında şöyle derler: "çerçevelerdeki web sitesi". Böyle bir kaynak oluşturmak için iyi bir HTML bilgisi gereklidir.
Web sitesi oluşturucuda çerçeveler oluşturma
Bazı web sitesi oluşturucular, bu tür kodların otomatik olarak oluşturulmasını sağlar. Genellikle çerçeve ekle düğmesi programın ana menüsünde bulunur. Önce imleci sayfada doğru yere yerleştirmeniz, ardından düğmeye tıklamanız gerekir, bir pencere açılacaktır (ekran görüntüsünde gösterildiği gibi). İçinde, çerçevede açılacak sayfanın adresini ayarlayabilir ve boyutları ayarlayabilirsiniz: genişlik ve yükseklik.
Ancak çoğunlukla çerçeveler, önemli sayıda menü öğesi ve alt menünün gerekli olduğu büyük web portallarının oluşturulmasında kullanılır. Genellikle bu tür insanlar hakkında şöyle derler: "çerçevelerdeki web sitesi". Böyle bir kaynak yaratmak için iyi bilgi gerekirHTML dili.
Bu "hizmet"in yardımıyla sayfada birkaç çerçeve oluşturmak mümkündür, ancak bu şekilde birbirine bağlı öğeler elde edemezsiniz.
CMS'deki Çerçeveler
Web sitesi oluşturmaya yönelik birçok programda ilgili modülü kurmak mümkündür. Örneğin, Joomla için çerçeve bir "Sarmalayıcı" modülüdür.
Joomla CMS kontrol panelinde bulunabilir ve oluşturulabilir: "Uzantılar" - "Modül Yöneticisi" - "Oluştur" (içinde artı işareti olan yuvarlak turuncu bir düğme). Açılan pencerede, listede "Sarmalayıcı" modülünü göreceksiniz.
Burada değilse, dahil değildir. Kullanmak için önce burada etkinleştirmeniz gerekir: "Uzantılar" sekmesi, ardından "Uzantı Yöneticisi", ardından "Yönetim" sekmesi. Ve açılan listeye bakıyoruz, "Filtre" alanında hızlı bir arama yapmak için şu kelimeyi girin: Wrapper. Bu modülün karşısında, içinde onay işareti olan yeşil bir simge olmalıdır. İçinde nokta olan kırmızı bir daire, bu eklentinin devre dışı bırakıldığı anlamına gelir.
Bu işlemden sonra "Modül Yöneticisine" dönebilir, bir çerçeve oluşturabilir ve parametrelerini ayarlayabilirsiniz.
Resimde görebileceğiniz gibi, modül şunları ayarlamanıza izin verir: çerçevenin üzerindeki başlık, modülün konumu, gösterileceği sitenin sayfalarını seçin. Ayrıca genişliği, yüksekliği de ayarlayın; bir çerçeve ekleyin ve aslındabir web sayfasına bağlantı. Bir çerçeve içinde bir sitenin ana sayfasını tam genişlikte görüntülemek istiyorsanız, varsayılan olarak ayarlanan %100 yeterli olmayacaktır. Hemen güvenle %400 koyabilirsiniz. Sayfanın üst menüsünü görüntülemek için genellikle 200 yükseklik yeterlidir. Kullanıcı (web sitesi ziyaretçisi) kaydırma çubuğunu kullanırsa, diğer tüm içerik görünür olacaktır.
İşte Joomla'da çerçevenin ne olduğuna dair bir örnek.
Çerçeve oluşturmak için Jumla modülü çok kullanışlı ve kullanımı kolaydır. Ancak, yapıcının yetenekleri gibi yetenekleri de sınırlıdır.
Tarih ve gerçekler
Çerçevelerden site oluşturma pratiğinde, bu etiket (uygulaması) uzun süre arka planda kaldı. Bir site oluşturucunun katılımı olmadan bir web sayfası için kod üreten yapıcı programlardaki modüller, ayarlarla değiştirilebildiler. Ancak, bazı durumlarda bu yeterli değildir. Örneğin, bir çerçeve tarayıcıda görüntülenen alanların bütünsel bir karmaşık yapısı olduğunda. Karmaşık yapılandırılmış sitelerin sahipleri bunu böyle görüyor. Çerçeve siteleri yalnızca özel etiketler yardımıyla oluşturulduğundan, oluşturulması yalnızca aşırı durumlarda kullanılır.
Karmaşık bir şekilde yapılandırılmış siteler
Onlar için, birbirine bağlı birkaç çerçeve oluşturmak, kaynak sayfalarındaki içeriği düzenlemek için en iyi çözümdür. Bunlar, kural olarak, her yıl daha da güçlenen büyük portallardır.
Aynı sonuca nasıl ulaşılır? Çerçeve yapısı nasıl oluşturulur?
Nasılsayfa koduna çerçeve ekle
HTML'deki çerçeveler etiketler kullanılarak eklenir:
- frame (ayrı bir pencere için);
- frameset (bütün bir yapı oluşturmak için kullanma);
- iframe ("kayan" çerçeve);
- noframes (çerçevenin kullanıcının tarayıcısında görüntülenmemesi durumunda).
Belirtilen ilk etiket her zaman bir ve çiftine uyar. Ve yerini alır ve. Ve uygun niteliklerin yardımıyla, her bir öğenin özelliklerini ayarlayabilirsiniz: ad (ad=), boyut (sütun=ve satırlar=), bir sınırın varlığı (kenarlık), kaydırma çubuğunun görünümü ve, tabii ki, görüntülenecek web sayfasının bağlantısı.
Tasarım varyasyonları
Sitenin tüm sayfası alanlara bölünebilir. Örneğin, bunun gibi:
Sol | Üst çerçeve |
Sağ |
Böyle bir yapı (iç içe olarak adlandırılır), etiketin içine çerçevenin konumu anlamına gelen cols niteliğini yatay olarak ve satırları - dikey olarak yazarak elde edilebilir. Ardından,=işareti konur ve boyutlar belirlenir. Örneğin, %60, %40 - yüzde (bir pencere tarayıcı alanının %60'ını, diğeri ise sırasıyla %40'ını alacaktır). Veya 100, 200 - piksel cinsinden en boy oranı. Çerçevelerden birinin boyutu hiç ayarlanamaz (varsayılan olarak ayarlanacaktır). Bunu yapmak için virgülden sonra veya önce. sembolünü belirtmeniz gerekir.
Yerleştirmeher yeni alan yeni bir çerçeve kümesiyle gösterilir.
Kod örneği:
Örneğimizde, ikinci ve üçüncü kareler için boyutların yalnızca bir kez belirtildiğine dikkat edin.
Birçok fikir, çerçeveleri tamamlamanıza olanak tanır. Tarayıcı penceresindeki konumlarının örnekleri sonsuz olarak verilebilir (kodu buna göre değiştirerek). Ancak, bu bilgi uzun süredir pratik uygulama bulamamıştır. Çerçeveler, günümüzde siteler oluşturulurken kullanılıyorsa, yalnızca ücretsiz CMS'de modüller şeklinde veya bir iframe biçimindedir.
Kayan çerçeve
Neden böyle bir isim aldığı garip, burada "yerleşik" kelimesi daha uygun. Bu çerçeve, bir dosyanın içeriğini görüntülemek için oluşturulur. Veritabanına herhangi bir belge veya dosya yüklersiniz, iframe etiketlerini kullanarak yolunu yazarsınız ve ziyaretçiler dosyanın metnini (video veya resim) görür. Ne yazık ki, tarayıcılar her zaman içerik oluşturmaz. Bunu yapmak için, web üreticileri açılış ve kapanış etiketleri arasına şu ifadeyi girer: "Tarayıcınız içerik göstermiyor."
Örneğin, Seopult.ru terfi ustaları için iyi bilinen bir hizmettir. Sadece ana sitesi değil, portal istemcileri için oluşturulan bir ayna I.seopult.pro. iframe kodu şu şekilde yazılır:
Talimatlar
.etiketi nerede
-
bir liste öğesini tanımlamak için oluşturuldu. Tüm tarayıcılar tarafından desteklenir.
Ayna sayfanın kendisinde, "Talimat" kelimesini bir düğme şeklinde görebilirsiniz. Tarayıcı penceresinin ortasındaki üzerine tıklamak sunuyu açar.
Hepsi büyükfilm ve dizi izleme siteleri, sosyal ağların yanı sıra iframe'ler (örneğin, "Imhonet") kullanılarak oluşturulur. "Yandex"in ana sayfası bile bu etiketi ve birden fazla çifti içeriyor.
iframe nasıl yazılır
Sitedeki herhangi bir yere kaydırma çubuğu olan bir pencere şeklinde bir belge yükleyebilirsiniz. Genellikle etiketler gövdenin içine yerleştirilir. Standartların ötesinde
ve, yukarıdaki örnekte gösterildiği gibi liste etiketi de kullanılabilir -
-
Özellikler iframe'e eklenir:
- width (genişlik) ve yükseklik (yükseklik=);
- kenar hizalama;
- belirtilebilen veya belirtilmeyen girintiler: varsayılan değer 6'dır - bu oldukça yeterlidir;
- izin şeffaflığı kullanarak, sayfanın arka planının görülebilmesi için çerçeve alanının şeffaflığını ayarlayabilirsiniz;
- artı tanıdık scr, ad, kaydırma, kenarlık.
Bir iframe ile gezinme
En ilginç çerçeveleme becerisi, Seopult aynasının yaratıcılarının yaptığı gibi, bir pencerede içeriği bir bağlantıyla açmanıza izin veren kod yazmaktır. aynı sayfa).
Bunun için bir iframe alınır, ayrıca içine name=ile isim yazılır. Örneğin, başlık. Ayrıca, etiketlerde ondan önce ve linkler bir HREF ile yazılır=onlardan sonra özniteliğin zorunlu olarak belirtilmesi gerekir. Kapatma etiketi a'yı kullanmadan önce, link-butonu olarak görev yapacak bir yazı belirtilir. Etiketler "a" açılış ve kapanışp. etiketine eklenir
Aşağıdaki pencerede hangi farklı içeriğin görüntüleneceğini tıklayarak, sonunda sitede bir satırda birkaç bağlantı düğmesi almak için koda bu tür birkaç satır yazabilirsiniz.
Kod şöyle görünecek:
Bir reklam yayınlayın
Reklamları Görüntüle
Web sitesinde nasıl görünecek:
Joomla sitesine iframe nasıl eklenir
Standart olarak, Joomla kontrol panelinde etkin (kullanıma hazır) bir "HTML kodu" modülü bulunur. Bununla, sitenin herhangi bir yerine herhangi bir kodu ekleyebilirsiniz. Ancak, iFrem etiketine sahip kodu inatla görmezden geliyor. Bu nedenle özel bir Jumi modülü kullanacağız.
Öncelikle, İnternetten indirmeniz ve Joomla yönetim panelinden yüklemeniz gerekir: "Uzantılar" - "Uzantı Yöneticisi" - "Dosya Seç". İndirilen arşivin yolunu belirtin ve "İndir"e tıklayın.
Başarılı kurulumdan sonra "Modül Yöneticisi"ne gidin ve yeni bir tane oluşturun. Jumi türünü seçin. Açılan pencerede "Özel Kod" alanına, makalenin bir önceki paragrafında gösterildiği gibi hazırlanan iFrem'i girin. Modüle bir başlık verin, yerleşim konumunu ve site sayfalarını belirtin. Kaydet'i tıklayın ve kontrol edin.
Tarayıcılar ve çerçeveler
Tüm popüler tarayıcılar çerçeve pencerelerinin içeriğini iyi görüntüler: Chrome, Safari, Firefox, Android, iOS. Internet Explorer ve Opera bu konuda özellikle yüksek bir orana sahiptir. Ve henüz bir garanti yoksitenizin ziyaretçisinin tüm pencerelerin içeriğini göreceği. Bu durumda noframe etiketini (açma ve kapama) kullanarak mesaj bırakmalısınız. İçine şunu girebilirsiniz: "Tarayıcınız güncel değil. Sitenin içeriğini görüntülemek için sürümü güncelleyin." Kullanıcının tarayıcısı çerçeveleri doğru bir şekilde oluşturursa bu mesajı görmezler.
Yani çerçeve, kendi URL'sine sahip bir sitenin alanı veya penceresidir. Birkaç web sayfasını veya bağımsız belgeyi tek bir tarayıcı alanında aynı anda görüntülemek için kullanılır ve ayrıca kendi URL'leri de vardır. Çerçevelerin karmaşık bir siteyi iyi düzenlemenize izin vermesine rağmen, iframe dışında uzun süredir kullanılmamaktadır. Bu etiketin kullanımı, sunumları, video oynatıcıyı, metin belgelerini belirli bir pencereye yüklemek için hala geçerlidir. Büyük ve iyi bilinen web kaynakları tarafından aktif olarak kullanılmaktadır.
-