🎲 Rastgele Yazı:
Home » » Şehriniz için güncel namaz vakitleri ve hava durumu kodu

Şehriniz için güncel namaz vakitleri ve hava durumu kodu

Written By Yazarlife on 8 Mart 2026 Pazar | Mart 08, 2026

 Blogger sitenizde kullanabileceğiniz bu mini widget ile güncel hava durumu ve sıradaki namaz vaktine kalan süreyi ziyaretçilerinize gösterebilirsiniz. Basit HTML kodu sayesinde Blogger’a kolayca eklenir ve otomatik çalışır. Şık tasarımı ile sitenizde hem faydalı hem de dikkat çekici bir bilgi alanı oluşturur.                                    Görsel aşağıda ki gibidir...


✅ hava durumu (ikon + derece)
✅ cami silüeti ikon
✅ sıradaki namaz vakti
✅ canlı geri sayım
✅ Blogger uyumlu
✅ görseldeki gibi gri kutu tasarım

Bunu Blogger → Yerleşim → HTML/JavaScript içine ekle.


<center><div class="mini-bar">

<div class="weather">
<span class="icon">⛅</span>
<span id="temp">--°C</span>
</div>

<div class="divider"></div>

<div class="prayer">
<span class="mosque">🕌</span>
<span id="vakit">Yükleniyor</span>
<span class="count" id="sayac">00:00:00</span>
</div>

</div>

<style>

.mini-bar{
display:flex;
align-items:center;
background:#efefef;
border:1px solid #cfcfcf;
font-family:Arial;
font-size:14px;
width:270px;
height:34px;
}

.weather{
display:flex;
align-items:center;
gap:5px;
padding:0 8px;
}

.divider{
width:1px;
height:22px;
background:#ccc;
}

.prayer{
display:flex;
align-items:center;
gap:6px;
padding:0 8px;
}

.count{
background:#2c5fa8;
color:white;
padding:2px 6px;
border-radius:3px;
font-weight:bold;
}

.icon{
font-size:18px;
}

</style>

<script>

let city="Antalya"; // şehrini yazabilirsin

async function getWeather(){

let r=await fetch("https://wttr.in/"+city+"?format=j1");
let j=await r.json();

document.getElementById("temp").innerHTML=
j.current_condition[0].temp_C+"°C";

}

async function getPrayer(){

let url="https://api.aladhan.com/v1/timingsByCity?city="+city+"&country=Turkey&method=13";

let r=await fetch(url);
let j=await r.json();

let times={
fajr:j.data.timings.Fajr,
dhuhr:j.data.timings.Dhuhr,
asr:j.data.timings.Asr,
maghrib:j.data.timings.Maghrib,
isha:j.data.timings.Isha
};

nextPrayer(times);

}

function nextPrayer(t){

let now=new Date();

let list=[
["İmsak",t.fajr],
["Öğle",t.dhuhr],
["İkindi",t.asr],
["Akşam",t.maghrib],
["Yatsı",t.isha]
];

for(let i=0;i<list.length;i++){

let time=list[i][1].split(":");

let target=new Date();

target.setHours(time[0],time[1],0);

if(now<target){

document.getElementById("vakit").innerHTML=list[i][0];

countdown(target);

break;

}

}

}

function countdown(target){

setInterval(function(){

let now=new Date();

let diff=target-now;

let h=Math.floor(diff/(1000*60*60));
let m=Math.floor((diff%(1000*60*60))/(1000*60));
let s=Math.floor((diff%(1000*60))/1000);

document.getElementById("sayac").innerHTML=
String(h).padStart(2,"0")+":"+
String(m).padStart(2,"0")+":"+
String(s).padStart(2,"0");

},1000);

}

getWeather();
getPrayer();

</script></center>
* Sayfa Yazarı: Murat Marti 
* Diğer Kaynaklar: GEMİNİ - Google Yapay Zeka. CHATGPT - Copilot
* Fotoğraflar: Pixabay ve Pexels Ücretsiz Fotoraflardan Alınmıştır...

NOT: Sitede çalışmayan kodları, o yazının altında ki yorum kutusundan bize yazınız.



0 Comments:

Yorum Gönder

🔀 Rastgele Yazılar
    --°C
    🕌 Yükleniyor 00:00:00
    🔥 Son Yazılar