İndirme özelliğini kullanarak Divi’de Doğrudan İndirme Düğmesi Nasıl Yapılır (Tek Tıklayın)

Doğrudan İndirme Bağlantısı, tarayıcı pencerenizde çizmek yerine tıklayarak dosyaları indirmeye başlayan bir bağlantıdır. Bir bağlantı veya doğrudan indirme düğmesi oluşturmak genellikle sunucu tarafında gelişmiş bir PHP ekleme gerektirir, .htaccess dosyasını ve/veya JavaScript’i değiştirir. Ne yaptığınızı bilmiyorsanız, bu bazı güvenlik risklerine neden olabilir. HTML5 kısa süre önce doğrudan indirmeler için basitleştirilmiş bir çözüm olarak indirme özelliklerini tanıttı. Öznitelikler İki ana şey elde etmeye çalışır: 1) Özellikler Tıklandığında indirilecek hedef bağlantıyı belirleyin ve 2) Öznitelik değeri indirilen dosya adı olarak işlev görür.
Bu özellik, durum daha sonra görmek için dosya depolama gerektirdiğinde kullanışlıdır. Ebaucuan teklifleri, satın alınan medya dosyaları veya yalnızca yüksek tanımlı bir resim için bir indirme yapmak isteyebilirsiniz. Bugün size dosyaların doğrudan kullanıcının bilgisayarına indirilmesine izin veren bağlantıya veya düğmeye indirme özniteliklerini nasıl ekleyeceğinizi göstereceğim.

İndirme düğmesi oluşturmak doğrudan manuel olarak Link yapısının indirilmesini indirme özelliğiyle ekler. Sadece “İndir” ekle etiketine, dosyanızda URL’ler içeren “HREF” özniteliklerinizle birlikte.
Bağlantı İndirme

İndirme özniteliği değerini (veya dosya adını) ekleyin Özellik, orijinal dosya adı dışında dosya adını belirlemenize olanak tanır. İndirme özelliği olarak yeni bir isim ekleyin: İndir bağlantısı
Yukarıdaki örnekte, kullanıcı bağlantıyı indirmek için tıkladığında, dosya orijinal dosya adı “Download-file.pdf” yerine “Yeni Ad” adıyla bilgisayarlarında saklanır. Bu, uzun ad veya karakter dizesine sahip bir dosyanız olduğunda kullanışlıdır. Yeni dosya adı değeri, basit ve kullanımı kolay bir dosya adı sağlayacaktır. Daha kafa karıştırıcı dosya adlarının yerine kullanılmak için … Ayrıca, birçok durumda, tarayıcı dosyaya otomatik olarak uzantı ekleyeceğinden, yeni dosya adına dosya uzantısı (örn. PDF) eklemeye gerek yok. İndirme özelliğinden dolayı bir geri dönüş hedefi özniteliği Hala tüm tarayıcılar tarafından desteklenmeyen, bağlantınıza hedef öznitelikler = “_ boş” eklemelisiniz. Bu, başka bir tarayıcıda bir bağlantı açacaktır. Bu, dosyalara bağlanırken her zaman iyi bir uygulamadır. Bu şekilde tarayıcı indirme özelliğini desteklemiyorsa, dosyaları sadece özellikleri indirmeden yeni bir pencerede açar. Ayrıca, tarayıcı indirme özelliklerini desteklerse, yeni bir pencere açmadan görüntüyü indirecektir. Yani bu iyi bir geri seçenek. indirme indir
Bağlantınızı bir divi düğmesine dönüştürün Bağlantınızı bir divi düğmesine nasıl hızlı bir şekilde değiştireceğiniz, “ET_PB_BUTTON” sınıfını bağlantınıza eklemektir. Sınıflar zaten Divi’de bulunan CSS uygulayacaktır. Düğme, vücut bağlantı renginin rengini devralacaktır, bu nedenle düğme stilini değiştirmek istiyorsanız, bağlantınıza bazı satırlar eklemeniz veya bağlantıya ek sınıflar eklemeniz ve CSS kullanarak düzenlemeniz gerekir.
Aşağıda, “ET_PB_BUTTON” sınıfı ile doğrudan indirme bağlantımızın bir örneği verilmiştir. download bağlantısı İşte burada değiştirecek bir dizi stil niteliğine örnek Turuncudan düğmenin rengi: <a href = "/files/download-file.pdf" indir = "newname" Target = "_ boş" class = "et_pb_button" style = "renk: #dd9933;
Doğrudan Divi düğmesi modülüyle bir indirme düğmesi oluşturma İndirme işlevselliğini doğrudan düğme modülüne eklemek için bir düğme oluşturun, önce dosyanıza her zamanki gibi bağlantı kuran bir düğme yapmalısınız.

Divi Builder’ın içinden düğme modülünü girin.

Düğme modülünün ayarlarında, aşağıdaki ayarları güncelleyin: URL düğmesini ekleyin (bu indirmek için dosyaya tam bir URL olmalıdır) URL Openst: Yeni sekmede (bu bir geri dönüş olarak önemlidir) Metin düğmesini ekleyin
Özel CSS altında, “ET-Download-Button” adlı bir CSS sınıfı ekleyin. Bu sınıf, jQuery ile düğmeleri hedeflemek ve indirme özellikleri eklemek için kullanılacaktır.

Kaydet ve Çıkış Yeni düğmenizi görün.

Şu anda, düğme dosyayı yalnızca yeni bir pencerede açacaktır. Düğme bağlantısına indirme öznitelikleri eklemek için birkaç jQuery eklememiz gerekir.

JQuery Ekle Download özelliği eklemek için düğme modülüne, düğme modülünün bağlantısına indirme özniteliğini girmek için birkaç jQuery ekleyebiliriz. Bu örnek için, CSS sınıfı “ET_Download-Button” (daha önce düğme modülüne eklediğimiz sınıf) ile düğme modülüne indirme özniteliğini ekleyeceğiz. JQuery eklemek için Divi → Tema seçeneğini açın. Entegrasyon sekmesi altında, “Kodu blogunuzun başına ekle” metin kutusuna aşağıdaki kodu girin: jQuery (belge) .Ready (function () {{

var downloadButton = jQuery (‘. ET-download-button’);
İndirButton.each (Function (dizin) {
JQuery (this) .at (‘indir’, ”);
});
});

Bu kod, “et_download_button” sınıfı ile düğme modülü tarafından yapılan herhangi bir bağlantıya indirme özniteliğini ekleyecektir. Ancak, bu kod, orijinal dosya adının yerini alan indirme özelliğine yeni bir dosya adı değeri eklemez. Her indirme dosyası için aynı yeni dosya adını vermek zorunda kalmadan bir sonraki düğme modülüne “et_download_button” sınıfını ekleyebilmeniz için bıraktım.
Düğme modülünüze yeni bir dosya adı değeri eklemek istiyorsanız, jQuery koduna ekleyebilirsiniz. Örneğin, düğme modülümün indirme dosyası adımı “resim dosyası” olarak değiştirmesini istiyorsam, bunun yerine bu jQuery snippet’ini kullanacağım:
JQuery (belge) .Ready (function () {
var downloadButton = jQuery (‘. ET-download-button’);
İndirButton.each (Function (dizin) {
JQuery (this) .at (‘İndir’, ‘Image-File’);
});
});

Şimdi düğme tıklandığında, indirilen dosya (gerçek adından bağımsız olarak) “görüntü dosyası” olarak adlandırılır. Ve daha önce de belirttiğim gibi, tarayıcı otomatik olarak dosya uzantıları algılayacak ve ekleyecektir. Artık düğmelerinizden düğmelerinizden birine doğrudan indirme işlevselliği ekleyebilirsiniz. Mevcut tarayıcı desteği Bu yazıyı yazarken indirme özellikleri Safari (iOS ve Oxs), Opera Mini veya Internet Explorer tarafından desteklenmez. İndirme özellikleri için bu en son tarayıcının desteğine bakın. Firefox yalnızca güvenlik nedenleriyle aynı orijin indirme bağlantısını destekler, bu da temel olarak indirme bağlantısını farklı bir alan adı veya farklı bir sunucuda yayınlanan bir bağlantı ile yönlendiremeyeceğiniz anlamına gelir. Geri dönüş İndirme özellikleri geniş tarayıcı desteği olmadığından, diğer tarayıcılara geriye dönük seçeneği uygulamanızı öneririm. İndirme özelliği ile ilgili en güzel şey, bağlantının onu desteklemeyen bir tarayıcıda çalışmaya devam etmesidir. Yine de her zamanki gibi dosyaya bağlanacaktır. Bu yüzden bağlantınızın yapısında “Target = _blank” (bağlantınızı yeni bir pencerede veya sekmede açan öznitelikler) kullanmanızı öneririm. Bu şekilde tarayıcı indirme özelliğini desteklemiyorsa, dosya başka bir sekmede açılır.
Tutarsız tarayıcı desteği nedeniyle indirme özelliğine karşı çıkarsanız, sıkıştırılmış bir dosya kullanarak, indirme dosyanızın genellikle ziyaretçileri görmek yerine dosyaları indirmeye zorlayan bir zip dosyasına sıkıştırmayı deneyebilirsiniz. İndir Popup tarayıcınıza bağlı olarak, doğrudan indirme bağlantınız “Bu dosya ile ne yapmak istiyorsunuz?” Bu, bağlantının çalışmadığı anlamına gelmez. Güvenlik nedeniyle bildirim gereklidir. İşte PDF dosyasından indirme bağlantısını tıklarken bir indirme açılır örneği: Son zihin İndirmeyi zorlamak için daha geleneksel ve karmaşık bir çözüm olduğunu fark ediyorum. Basit tutmaya karar verdim ve daha sofistike bir PHP veya JS çözümüne sahip bir güçlük olmadan bir çözüm sundum. İndirme özniteliğini etiketine “İndir” eklemek kadar kolay ekleyin. Ve isteğe bağlı değer, dosya adını istediğiniz her şeye ayarlayabilir. Ayrıca, biraz jQuery ile, Divi düğmesi modülüne işlev eklemek, modüle özel bir sınıf eklemek kadar kolaydır. Her ne kadar indirme nitelikleri tüm tarayıcılar tarafından tam olarak desteklenmese de, yine de basit ve pratik bir çözümdür. Öznitelikler sadakatsiz bir tarayıcı tarafından göz ardı edildiğinden, bağlantı tarayıcı pencerenizde çalışmaya ve açılmaya devam edecektir. Umarım bu, doğrudan bir indirme bağlantısı isteyen bir sonraki müşteri için yararlı bir kaynak olacaktır. Yorumlarda sizden haber almayı umuyorum.

admin

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir