Giriş yapmadınız.

Seyyah20

Orta Düzey

  • "Seyyah20" bir erkek
  • Konuyu başlatan "Seyyah20"

Mesajlar: 323

Kayıt tarihi: Jan 26th 2014

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

  • 1023
  • Özel mesaj gönder

1

Saturday, 18.10.2025, 02:08

Sayfalarınıza, Bloglarınıza Birleşik Akordiyon Bilgi Paneli

Merhaba Allaturka forum üyeleri ve ziyaretçiler,

İlk widget'ımız olan interaktif terminal kutusundan sonra, şimdi de sitemize yedi farklı konuyu tek bir kutuda toplayan, açılır-kapanır (Akordiyon) yapıda Birleşik Akordiyon Bilgi Paneli'ni ekledik! Bu widget, ana sayfanızda yer kaplamadan, ihtiyacınız olan tüm bilgilere hızlı erişim sağlar.

Bölüm I: Kullanım ve Yerleştirme

1. Yerleştirme Kılavuzu:

Ekli HTML kodunu (örneğin: birlesik_akordiyon.html) sitenizde bir yere kaydedin. Ardından, aşağıdaki iFrame kodunu kullanacağınız alana yapıştırın. Geniş yükseklik ayarı sayesinde kutu, tüm başlıkları rahatça gösterebilir.

<iframe src="[WIDGET HTML DOSYASININ ADRESİ]" width="350px" height="580px" frameborder="0" scrolling="no"></iframe>

2. Boyutlar Nasıl Değişir?

Kutunun genişliğini (width) ve yüksekliğini (height) iFrame kodundaki değerleri değiştirerek ayarlayabilirsiniz. Örneğin: width="400px" yaparsanız kutu daha geniş görünür. Akordiyon yapısı yüksekliği otomatik yönetir, ancak tüm başlıkların sığması için height değerini 580px veya üstünde tutmanız önerilir.

Bölüm II: Stil ve İçerik Değişiklikleri

1. Logo Nasıl Değişir?

Logo bölümü, kodun en başında yer alır. Kendi logonuzu veya farklı bir resminizi eklemek için aşağıdaki satırı bulun ve URL'yi kendi görselinizin adresiyle değiştirin:

<img src="[LOGO ADRESİNİZ]" alt="Allaturka Logo">

Logo tıklandığında forum ana sayfasına gitmesi içinse <a href="..."> etiketindeki linki değiştirebilirsiniz.

2. Renkler Nasıl Değişir?

Tüm renkler, kodun başındaki <style> etiketleri içindeki CSS değişkenleriyle kolayca değiştirilebilir.

  • Arka Plan Rengi: .accordion-container ve .accordion-content içindeki background-color: #2c3e50; (Kutunun ana koyu rengi)
  • Vurgu/Çerçeve Rengi: border: 1px solid #FF8C00; ve color: #FF8C00; (Başlık metinleri, çerçeve ve linkler bu turuncu renktedir.)
  • Başlık Arka Plan Rengi: .accordion-header içindeki background-color: #34495e; (Açılır-kapanır başlıkların rengi)
Bölüm III: İçerik ve Geliştirilebilirlik

1. Yazılar Nasıl Değişir?

Widget, 7 farklı başlık ve içerikten oluşur. İçerikleri değiştirmek için, HTML kodunda <div class="accordion-content" id="content1"> gibi etiketleri bulmanız ve içindeki metinleri (örneğin: content-text sınıfları içindeki metinleri) kendi yazılarınızla değiştirmeniz yeterlidir.

2. Widget Geliştirilebilir mi?

Evet. Bu yapı tamamen HTML, CSS ve JavaScript kullanılarak yazılmıştır. İleri düzey kod bilgisine sahip geliştiriciler, yapıyı dilediği gibi geliştirebilir:

  • Dinamik İçerik: 3. bölümdeki "Günün Sözü" veya 6. bölümdeki "İpucu" içeriği, JavaScript ile rastgele seçilen bir listeden çekilebilir.
  • Animasyonlar: Başlık açılırken veya kapanırken daha yumuşak, farklı animasyonlar eklenebilir.


Seyyah20 belirtilen dosyaları ekledi: