You are not logged in.

Modern Müzik & Şiir Widget v3.0 (Açık Kaynak)

Seyyah20

Intermediate

  • "Seyyah20" is male
  • "Seyyah20" started this thread

Posts: 310

Date of registration: Jan 26th 2014

Location: DENİZLİ/Gönlünüze ektiğiniz her güzellik, bir gün size bereketli bir hasat olarak dönecektir.

  • 1023
  • Send private message

1

Tuesday, March 3rd 2026, 6:15am

Modern Müzik & Şiir Widget v3.0 (Açık Kaynak)

Değerli Allaturka Forum Üyeleri ve Ziyaretçiler,

Sizler için tamamen açık kaynak, reklamsız ve modern bir arayüze sahip olan Müzik & Şiir Player widget'ını paylaşıyorum.
Forum sayfalarınıza, bloglarınıza veya kişisel web sitelerinize şıklık katacak bu player, 5 farklı kategori ve 50 parça kapasitesiyle tam bir arşiv niteliğindedir.

Özellikler
  • 5 Dinamik Kategori: Slow, Pop, Arabesk, Türkü ve Şiir sekmeleri.
  • Tam Kontrol: İleri, Geri ve Oynat/Duraklat butonları aktif çalışır.
  • Hakkında Sekmesi: "❓" simgesine tıklandığında yapımcı ve sürüm bilgisi görünür.
  • Otomatik Geçiş: Parça bittiğinde bir sonrakine kendiliğinden geçer.
  • Responsive: Mobil cihazlarla tam uyumludur.
Özelleştirme Rehberi (Nasıl Düzenlenir?)
1. Müzik ve Resim Nasıl Eklenir? Kodun en altındaki <script> bölümünde her parça için yer alan:
  • img: "..." kısmına şarkı resminin linkini,
  • url: "..." kısmına ise MP3 dosyanızın linkini yapıştırmanız yeterlidir.

Kaynak kod

 
1

{ t: "Hoşçakal", a: "Şebnem Ferah", d: "4:50", s: "6.5 MB", img: "images/sebnem_ferah.jpg", url: "https://archive.org/download/karisik_muzik/%C5%9Eebnem%20Ferah%20-%20Ho%C5%9F%C3%A7akal.mp3" },



2. Renkler Nasıl Değişir? CSS bölümündeki .player-card ve .footer-player sınıflarında bulunan linear-gradient değerlerini değiştirerek dilediğiniz renk temasını (Örn: Mavi, Kırmızı, Yeşil) uygulayabilirsiniz.
3. Boyut (Yükseklik) Nasıl Değişir? .player-card sınıfındaki height: 500px; değerini artırıp azaltarak player yüksekliğini sabitleyebilirsiniz. İçerik bu alanın içinde otomatik kayar.
4. MB ve Süre Bilgisi Nasıl Güncellenir? songData listesi içerisindeki d: "4:15" (Süre) ve s: "5.2 MB" (Boyut) alanlarını manuel olarak her parçaya göre düzenleyebilirsiniz.

Kullanım Hakkında Önemli Notlar:
· Müzik Ekleme: Konu içindeki her sekmeye (Slow, Pop, Arabesk vb.) örnek olması amacıyla birer müzik ve sanatçı resmi ekledim.
Siz kendi sunucunuza ya da link alabileceğiniz archive.org gibi yerlere dilediğiniz kadar şarkı yükleyip kod içerisindeki linkleri güncelleyerek listenizi genişletebilirsiniz.

· Resim Ekleme: Resimleri şablon olarak images klasörü yolunda bıraktım.
Siz kendi sunucunuza, bloğunuza ya da herhangi bir resim upload sitesine (Hızlıresim vb.) kendi görsellerinizi yükleyerek kod içindeki ilgili alanlara ekleyebilirsiniz.

CMS ve Web Sitelere Nasıl Eklenir?
  • vBulletin / XenForo: Panelinizden "Ad Manager" veya "Widget" bölümüne giderek HTML alanı oluşturun ve kodları yapıştırın.
  • WordPress: Yazı veya sayfa içine "Özel HTML" bloğu ekleyerek kodu içine koyun.
  • Düz HTML: Sayfanızın <body> etiketleri arasına herhangi bir yere eklemeniz yeterlidir.
  • Blogspot'ta widget olarak sağa yada sola ekleyebilirsiniz.
Not: Kodlar tamamen tarafımızdan düzenlenmiş olup ücretsiz ve açık kaynaklıdır. Reklam veya gizli link içermez.

Archive.org sitesine nasıl MP3 Yüklenir BURADAN İnceleyin

DEMO GÖRÜNTÜSÜ: BURADAN BUYRUN

KODLAR: Ektedir.

*Bilgi ve emek, paylaşıldıkça çoğalan tek hazinedir. Kendi arşivinizi oluştururken başkalarına da ışık tutmanız dileğiyle.*
Seyyah20 has attached the following file:

This post has been edited 1 times, last edit by "Seyyah20" (Mar 3rd 2026, 6:27am)

2 users apart from you are browsing this thread:

2 guests

Similar threads