Neler yeni

Xen HTML Widget Edit & Türkçeleştirme ( Görsel Anlatım )

Naim

Kayıtlı Üye
JailbreakTR
Katılım
20 Haz 2018
Mesaj
64
Cihaz
iPhone 6S Plus
Evet arkadaşlar sizlere Lockscreen tema ve widgetlerini nasıl editlenebileceğini anlatacağım.
HTML ve Css kod bilgisine hakim olan arkadaşlar muhakkak ki bizlere daha fazla bilgi vereceklerdir.
Ben kullandığım Xen HTML tweaki üzerinden bilgi vereceğim. (Daha önce cihazımızda Xen HTML kurulu olmalıdır.)

1.AŞAMA DİL DEĞİŞİMİ;

1) Cydia’dan reposundan LS EW 176 lockscreen temasını yükledik diyelim.
IMG_1859.PNG
Yükledikten sonra temanın ilk hali böyle olacaktır.
IMG_1860.jpg

2) Yüklenen tema ve widgetler cihazımızda var/mobile/library/lockhtml dizini içine kurulmaktadır.
Filza yada iFile aracılığı ile belirtilen konuma gidiyoruz. Ve temamızın kurulu olduğu klasöre giriyoruz. Biz LS EW 176 klasörüne gidiyoruz.
IMG_1861.jpg

3) Türkçeleştirme için öncelikle Script klasörü içine giriyoruz. Script klasöründe bulunan lang.js dosyasını editleyeceğiz.
if (Lang == "en") {
var days = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
var shortdays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var months=["January","February","March","April","May","June","July","August","September","October","November","December"];
var shortmonths = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var hourtext = ["Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve"];
var weatherdesc = ["Tornado", "Tropical Storm", "Hurricane", "Thunderstorm", "Thunderstorm", "Snow", "Sleet", "Sleet", "Freezing Drizzle", "Drizzle", "Freezing Rain", "Showers", "Showers", "Flurries", "Snow", "Snow", "Snow", "Hail", "Sleet", "Dust", "Fog", "Haze", "Smoky", "Blustery", "Windy", "Cold", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Clear", "Sunny", "Fair", "Fair", "Sleet", "Hot", "Thunderstorms", "Thunderstorms", "Thunderstorms", "Showers", "Heavy Snow", "Light Snow", "Heavy Snow", "Partly Cloudy", "Thunderstorm", "Snow", "Thunderstorm", "blank"];
}
Burada bulunan kodların başında hangi dili temsil ettikleri yazaz. "en" ingilizce üzerinden yol alalım. Burada ingilizce günler, saatler, hava durumu ve kısaltmalırını görüyoruz. dilersek direk "en" bölümünü editleyip temanın ayarlar seçeneklerinden ingilizce seçerek devam edebilir. Yada dosyada sayfanın en altına gelerek yeni bir paragrafa "tr" diye bir seçenek ekleriz. Böylelikle tema ayarlarından tr seçimini yaptığımızda türkçe aktif olur. Biz bu yolu izleyelim ve sayfanın en altına yeni bir paragraf açarak üstteki ingilizce kodu kopyalayıp } işaretinin hem altına yapıştıralım. Aşağıda ki gibi ingilice terimleri türkçeleştirelim. İngilizce bilmeyen arkadaşlar çeviri yardımı ile kolaylıkla türkçeleştirme yapabilir. Bazı temelarda ki fontlar türkçe karakterleri desteklemediği için türkçe karakter kullanımına dikkat etmek gerekiyor.
if (Lang == "tr") {
var days = ["Pazar","Pazartesi","Salı","Carsamba","Persembe","Cuma","Cumartesi"];
var shortdays = ["Pzr", "Pzt", "Salı", "Çar", "Per", "Cum", "Cts"];
var months=["Ocak","Subat","Mart","Nisan","Mayis","Haziran","Temmuz","Agustos","Eylül","Ekim","Kasım","Aralik"];
var shortmonths = ["Oc", "Sub", "Mar", "Nis", "May", "Haz", "Tem", "Agu", "Eyl", "Eki", "Kas", "Ara"];
var hourtext = ["Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki"];
var weatherdesc = ["Kasırga", "Tropikal Fırtına", "Kasırga", "Gök gürültülü", "Gök gürültülü", "Kar", "Sulu Kar", "Sulu Kar", "Hafif Yağmur", "Hafif Yağış", "Karla karışık", "Sağanak", "Sağanak", "Sağanak", "Kar", "Kar", "Kar", "Kar", "Sulu Kar", "Sisli", "Dumanlı", "Puslu", "Sisli", "Rüzgarlı", "Rüzgarlı", "Buzlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Açık", "Güneşli", "Açık", "Açık", "Sulu Kar", "Sıcak", "Gök gürültülü", "Gök gürültülü", "Gök gürültülü", "Sağanak", "Şiddetli Kar", "Hafif kar", "Şiddetli Kar", "Parçalı Bulutlu", "Gök gürültülü", "Kar", "Gök gürültülü", "blank"];
}

4) Türkçeleştirme sonrası Ayarlar/Xen Html/ Lockscreen/Background Widget e giriyoruz.
Add widget'e tıklayıp LS EW 176 seçiyoruz. Seçim sonrası siyah bir alanda temamız açılıyor. Alt kısımda ki ayarlar düğmesine tıklıyoruz.
IMG_1865.jpg
Açılan seçeneklerde saat dilimini isterseniz 12 yada 24 saat olarak seçiyoruz. Türkçeleştirme esnasında "tr" diye yeni dil açtığımız için "en" yazan yere tr yazıp kaydet diyoruz.
IMG_1863.jpg

Görüldüğü üzere artık temamız türkçe.
IMG_1864.jpg

Mesaj düzenlendi:


2.AŞAMA GÖRSEL EDİT ( KOD BİLGİSİ GEREKTİRİR)

Yüklemiş olduğumuz temanın görselliğini belirleyen kodlar Style.css içerisinde bulunmaktadır. Burada yapılan değişikliklerle temaya farklı görsellik kazandırılabilir.
Yazıların birbirine yakınlığı uzaklığı, boyutlandırma, gölge ekleme vs gibi herşey bu dosya altında yapılabilir. Ben editlemiş olduğum style.css dosyasında ki kodları ve orjinal style dosyasını buraya atıyorum değişiklikleri görebilirsiniz.

ORJİNAL:
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:327px; left:0px; width:375px; text-align:center; z-index:50;
font-size:18.75px; letter-spacing:2;
}

#Stroke{
position:absolute; top:243.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; color:#494A9E;
}

#weekday{
position:absolute; top:160px; left:0px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy;
}
#Cal{
position:absolute; top:253.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize;
-webkit-transform:rotateZ(-5deg);
color:#494A9E;
}

EDİT
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:315px; left:12px; width:375px; text-align:center; z-index:50;
font-size:40.75px; letter-spacing:2; text-shadow: 2px 2px 3px #000000;
}

#Stroke{
position:absolute; top:355.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; shadow: 2px 2px 3px #000000;
}

#weekday{
position:absolute; top:160px; left:10px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy; text-shadow: 2px 2px 5px #000000;
}
#Cal{
position:absolute; top:365.5px; left:10px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize; shadow:2px 2px 3px #000000;
-webkit-transform:rotateZ(-5deg);
}

Editlenmiş hali;
5D0A55A1-0FA7-44F0-90FE-48EB239410EA.jpeg

Örnek kod çalışması
}

#weekday{ (Gün bilgisi)
position:absolute; ( duracağı pozisyon)
top:160px; (ortalama)
left:10px; ( sola uzaklık)
width:375px; ( boyut yüksekliği )
text-align:center; ( yazının pozisyonu)
z-index:50; ( ??? )
font-size:150px; (font büyüklüğü)
font-family:heavy; (Font seçimi)
text-shadow: 2px 2px 5px #000000; (Gölge)
}

Hazır TEMA’lar için
Xen HTML Lockscreen Temaları (Türkçe)
 

Ekli dosyalar

Son düzenleme:

omeraksoy

Banned
Yasaklı
Katılım
29 Mar 2018
Mesaj
1,919
Cihaz
iPhone 6
Bilmeyen arkadaşlar için gerçekten yararlı bir paylaşım olmuş teşekkür ederiz.
 

Elmar123

Aktif Üye
JailbreakTR
Katılım
19 Eki 2017
Mesaj
379
Cihaz
iPhone 6
eline koluna salik kardesim allah razi olsun
 

gokmenecer

VelenzA
Administrator
Katılım
15 Ara 2017
Mesaj
3,332
Cihaz
iPhone X
Güzel konu olmuş. Eline sağlık..

Sabite aldım konuyu :okay:
 

Webthese

Yetkili
Moderatör
Katılım
17 Ağu 2018
Mesaj
359
Cihaz
iPhone 13 Pro Max
reposundan tweak yüklemek istediğim de Depends com.junesiphone.xeninfo bu hatayla karşılaşıyorum ne yapmam gerek?
 

ramazandemiral

Yetkili
Administrator
Katılım
12 Ocak 2018
Mesaj
2,268
Cihaz
iPhone 7 Plus
hocam widget türkçeleştirme konusunda dediklerinizi adım adım yaptım fakat widget ayarlarında tr yi kabul etmiyor. şu hatayı veriyor ' Failed to write widget settings : check file permissions for this widget '
XenHTML'in yazabilmesi için config.js dosyasının izinlerini değiştirmeniz gerekir.
 

intercom

Kayıtlı Üye
JailbreakTR
Katılım
15 Şub 2019
Mesaj
29
Cihaz
iPhone 6S
Evet arkadaşlar sizlere Lockscreen tema ve widgetlerini nasıl editlenebileceğini anlatacağım.
HTML ve Css kod bilgisine hakim olan arkadaşlar muhakkak ki bizlere daha fazla bilgi vereceklerdir.
Ben kullandığım Xen HTML tweaki üzerinden bilgi vereceğim. (Daha önce cihazımızda Xen HTML kurulu olmalıdır.)

1.AŞAMA DİL DEĞİŞİMİ;

1) Cydia’dan reposundan LS EW 176 lockscreen temasını yükledik diyelim.
Ekli dosyayı görüntüle 6592
Yükledikten sonra temanın ilk hali böyle olacaktır.
Ekli dosyayı görüntüle 6593

2) Yüklenen tema ve widgetler cihazımızda var/mobile/library/lockhtml dizini içine kurulmaktadır.
Filza yada iFile aracılığı ile belirtilen konuma gidiyoruz. Ve temamızın kurulu olduğu klasöre giriyoruz. Biz LS EW 176 klasörüne gidiyoruz.
Ekli dosyayı görüntüle 6596

3) Türkçeleştirme için öncelikle Script klasörü içine giriyoruz. Script klasöründe bulunan lang.js dosyasını editleyeceğiz.
if (Lang == "en") {
var days = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
var shortdays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var months=["January","February","March","April","May","June","July","August","September","October","November","December"];
var shortmonths = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var hourtext = ["Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve"];
var weatherdesc = ["Tornado", "Tropical Storm", "Hurricane", "Thunderstorm", "Thunderstorm", "Snow", "Sleet", "Sleet", "Freezing Drizzle", "Drizzle", "Freezing Rain", "Showers", "Showers", "Flurries", "Snow", "Snow", "Snow", "Hail", "Sleet", "Dust", "Fog", "Haze", "Smoky", "Blustery", "Windy", "Cold", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Clear", "Sunny", "Fair", "Fair", "Sleet", "Hot", "Thunderstorms", "Thunderstorms", "Thunderstorms", "Showers", "Heavy Snow", "Light Snow", "Heavy Snow", "Partly Cloudy", "Thunderstorm", "Snow", "Thunderstorm", "blank"];
}
Burada bulunan kodların başında hangi dili temsil ettikleri yazaz. "en" ingilizce üzerinden yol alalım. Burada ingilizce günler, saatler, hava durumu ve kısaltmalırını görüyoruz. dilersek direk "en" bölümünü editleyip temanın ayarlar seçeneklerinden ingilizce seçerek devam edebilir. Yada dosyada sayfanın en altına gelerek yeni bir paragrafa "tr" diye bir seçenek ekleriz. Böylelikle tema ayarlarından tr seçimini yaptığımızda türkçe aktif olur. Biz bu yolu izleyelim ve sayfanın en altına yeni bir paragraf açarak üstteki ingilizce kodu kopyalayıp } işaretinin hem altına yapıştıralım. Aşağıda ki gibi ingilice terimleri türkçeleştirelim. İngilizce bilmeyen arkadaşlar çeviri yardımı ile kolaylıkla türkçeleştirme yapabilir. Bazı temelarda ki fontlar türkçe karakterleri desteklemediği için türkçe karakter kullanımına dikkat etmek gerekiyor.
if (Lang == "tr") {
var days = ["Pazar","Pazartesi","Salı","Carsamba","Persembe","Cuma","Cumartesi"];
var shortdays = ["Pzr", "Pzt", "Salı", "Çar", "Per", "Cum", "Cts"];
var months=["Ocak","Subat","Mart","Nisan","Mayis","Haziran","Temmuz","Agustos","Eylül","Ekim","Kasım","Aralik"];
var shortmonths = ["Oc", "Sub", "Mar", "Nis", "May", "Haz", "Tem", "Agu", "Eyl", "Eki", "Kas", "Ara"];
var hourtext = ["Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki"];
var weatherdesc = ["Kasırga", "Tropikal Fırtına", "Kasırga", "Gök gürültülü", "Gök gürültülü", "Kar", "Sulu Kar", "Sulu Kar", "Hafif Yağmur", "Hafif Yağış", "Karla karışık", "Sağanak", "Sağanak", "Sağanak", "Kar", "Kar", "Kar", "Kar", "Sulu Kar", "Sisli", "Dumanlı", "Puslu", "Sisli", "Rüzgarlı", "Rüzgarlı", "Buzlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Açık", "Güneşli", "Açık", "Açık", "Sulu Kar", "Sıcak", "Gök gürültülü", "Gök gürültülü", "Gök gürültülü", "Sağanak", "Şiddetli Kar", "Hafif kar", "Şiddetli Kar", "Parçalı Bulutlu", "Gök gürültülü", "Kar", "Gök gürültülü", "blank"];
}

4) Türkçeleştirme sonrası Ayarlar/Xen Html/ Lockscreen/Background Widget e giriyoruz.
Add widget'e tıklayıp LS EW 176 seçiyoruz. Seçim sonrası siyah bir alanda temamız açılıyor. Alt kısımda ki ayarlar düğmesine tıklıyoruz.
Ekli dosyayı görüntüle 6597
Açılan seçeneklerde saat dilimini isterseniz 12 yada 24 saat olarak seçiyoruz. Türkçeleştirme esnasında "tr" diye yeni dil açtığımız için "en" yazan yere tr yazıp kaydet diyoruz.
Ekli dosyayı görüntüle 6598

Görüldüğü üzere artık temamız türkçe.
Ekli dosyayı görüntüle 6599

Mesaj düzenlendi:


2.AŞAMA GÖRSEL EDİT ( KOD BİLGİSİ GEREKTİRİR)

Yüklemiş olduğumuz temanın görselliğini belirleyen kodlar Style.css içerisinde bulunmaktadır. Burada yapılan değişikliklerle temaya farklı görsellik kazandırılabilir.
Yazıların birbirine yakınlığı uzaklığı, boyutlandırma, gölge ekleme vs gibi herşey bu dosya altında yapılabilir. Ben editlemiş olduğum style.css dosyasında ki kodları ve orjinal style dosyasını buraya atıyorum değişiklikleri görebilirsiniz.

ORJİNAL:
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:327px; left:0px; width:375px; text-align:center; z-index:50;
font-size:18.75px; letter-spacing:2;
}

#Stroke{
position:absolute; top:243.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; color:#494A9E;
}

#weekday{
position:absolute; top:160px; left:0px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy;
}
#Cal{
position:absolute; top:253.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize;
-webkit-transform:rotateZ(-5deg);
color:#494A9E;
}

EDİT
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:315px; left:12px; width:375px; text-align:center; z-index:50;
font-size:40.75px; letter-spacing:2; text-shadow: 2px 2px 3px #000000;
}

#Stroke{
position:absolute; top:355.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; shadow: 2px 2px 3px #000000;
}

#weekday{
position:absolute; top:160px; left:10px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy; text-shadow: 2px 2px 5px #000000;
}
#Cal{
position:absolute; top:365.5px; left:10px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize; shadow:2px 2px 3px #000000;
-webkit-transform:rotateZ(-5deg);
}

Editlenmiş hali;
Ekli dosyayı görüntüle 6601

Örnek kod çalışması
}

#weekday{ (Gün bilgisi)
position:absolute; ( duracağı pozisyon)
top:160px; (ortalama)
left:10px; ( sola uzaklık)
width:375px; ( boyut yüksekliği )
text-align:center; ( yazının pozisyonu)
z-index:50; ( ??? )
font-size:150px; (font büyüklüğü)
font-family:heavy; (Font seçimi)
text-shadow: 2px 2px 5px #000000; (Gölge)
}

Hazır TEMA’lar için
Xen HTML Lockscreen Temaları (Türkçe)
Evet arkadaşlar sizlere Lockscreen tema ve widgetlerini nasıl editlenebileceğini anlatacağım.
HTML ve Css kod bilgisine hakim olan arkadaşlar muhakkak ki bizlere daha fazla bilgi vereceklerdir.
Ben kullandığım Xen HTML tweaki üzerinden bilgi vereceğim. (Daha önce cihazımızda Xen HTML kurulu olmalıdır.)

1.AŞAMA DİL DEĞİŞİMİ;

1) Cydia’dan reposundan LS EW 176 lockscreen temasını yükledik diyelim.
Ekli dosyayı görüntüle 6592
Yükledikten sonra temanın ilk hali böyle olacaktır.
Ekli dosyayı görüntüle 6593

2) Yüklenen tema ve widgetler cihazımızda var/mobile/library/lockhtml dizini içine kurulmaktadır.
Filza yada iFile aracılığı ile belirtilen konuma gidiyoruz. Ve temamızın kurulu olduğu klasöre giriyoruz. Biz LS EW 176 klasörüne gidiyoruz.
Ekli dosyayı görüntüle 6596

3) Türkçeleştirme için öncelikle Script klasörü içine giriyoruz. Script klasöründe bulunan lang.js dosyasını editleyeceğiz.
if (Lang == "en") {
var days = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
var shortdays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var months=["January","February","March","April","May","June","July","August","September","October","November","December"];
var shortmonths = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var hourtext = ["Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve"];
var weatherdesc = ["Tornado", "Tropical Storm", "Hurricane", "Thunderstorm", "Thunderstorm", "Snow", "Sleet", "Sleet", "Freezing Drizzle", "Drizzle", "Freezing Rain", "Showers", "Showers", "Flurries", "Snow", "Snow", "Snow", "Hail", "Sleet", "Dust", "Fog", "Haze", "Smoky", "Blustery", "Windy", "Cold", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Clear", "Sunny", "Fair", "Fair", "Sleet", "Hot", "Thunderstorms", "Thunderstorms", "Thunderstorms", "Showers", "Heavy Snow", "Light Snow", "Heavy Snow", "Partly Cloudy", "Thunderstorm", "Snow", "Thunderstorm", "blank"];
}
Burada bulunan kodların başında hangi dili temsil ettikleri yazaz. "en" ingilizce üzerinden yol alalım. Burada ingilizce günler, saatler, hava durumu ve kısaltmalırını görüyoruz. dilersek direk "en" bölümünü editleyip temanın ayarlar seçeneklerinden ingilizce seçerek devam edebilir. Yada dosyada sayfanın en altına gelerek yeni bir paragrafa "tr" diye bir seçenek ekleriz. Böylelikle tema ayarlarından tr seçimini yaptığımızda türkçe aktif olur. Biz bu yolu izleyelim ve sayfanın en altına yeni bir paragraf açarak üstteki ingilizce kodu kopyalayıp } işaretinin hem altına yapıştıralım. Aşağıda ki gibi ingilice terimleri türkçeleştirelim. İngilizce bilmeyen arkadaşlar çeviri yardımı ile kolaylıkla türkçeleştirme yapabilir. Bazı temelarda ki fontlar türkçe karakterleri desteklemediği için türkçe karakter kullanımına dikkat etmek gerekiyor.
if (Lang == "tr") {
var days = ["Pazar","Pazartesi","Salı","Carsamba","Persembe","Cuma","Cumartesi"];
var shortdays = ["Pzr", "Pzt", "Salı", "Çar", "Per", "Cum", "Cts"];
var months=["Ocak","Subat","Mart","Nisan","Mayis","Haziran","Temmuz","Agustos","Eylül","Ekim","Kasım","Aralik"];
var shortmonths = ["Oc", "Sub", "Mar", "Nis", "May", "Haz", "Tem", "Agu", "Eyl", "Eki", "Kas", "Ara"];
var hourtext = ["Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki"];
var weatherdesc = ["Kasırga", "Tropikal Fırtına", "Kasırga", "Gök gürültülü", "Gök gürültülü", "Kar", "Sulu Kar", "Sulu Kar", "Hafif Yağmur", "Hafif Yağış", "Karla karışık", "Sağanak", "Sağanak", "Sağanak", "Kar", "Kar", "Kar", "Kar", "Sulu Kar", "Sisli", "Dumanlı", "Puslu", "Sisli", "Rüzgarlı", "Rüzgarlı", "Buzlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Açık", "Güneşli", "Açık", "Açık", "Sulu Kar", "Sıcak", "Gök gürültülü", "Gök gürültülü", "Gök gürültülü", "Sağanak", "Şiddetli Kar", "Hafif kar", "Şiddetli Kar", "Parçalı Bulutlu", "Gök gürültülü", "Kar", "Gök gürültülü", "blank"];
}

4) Türkçeleştirme sonrası Ayarlar/Xen Html/ Lockscreen/Background Widget e giriyoruz.
Add widget'e tıklayıp LS EW 176 seçiyoruz. Seçim sonrası siyah bir alanda temamız açılıyor. Alt kısımda ki ayarlar düğmesine tıklıyoruz.
Ekli dosyayı görüntüle 6597
Açılan seçeneklerde saat dilimini isterseniz 12 yada 24 saat olarak seçiyoruz. Türkçeleştirme esnasında "tr" diye yeni dil açtığımız için "en" yazan yere tr yazıp kaydet diyoruz.
Ekli dosyayı görüntüle 6598

Görüldüğü üzere artık temamız türkçe.
Ekli dosyayı görüntüle 6599

Mesaj düzenlendi:


2.AŞAMA GÖRSEL EDİT ( KOD BİLGİSİ GEREKTİRİR)

Yüklemiş olduğumuz temanın görselliğini belirleyen kodlar Style.css içerisinde bulunmaktadır. Burada yapılan değişikliklerle temaya farklı görsellik kazandırılabilir.
Yazıların birbirine yakınlığı uzaklığı, boyutlandırma, gölge ekleme vs gibi herşey bu dosya altında yapılabilir. Ben editlemiş olduğum style.css dosyasında ki kodları ve orjinal style dosyasını buraya atıyorum değişiklikleri görebilirsiniz.

ORJİNAL:
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:327px; left:0px; width:375px; text-align:center; z-index:50;
font-size:18.75px; letter-spacing:2;
}

#Stroke{
position:absolute; top:243.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; color:#494A9E;
}

#weekday{
position:absolute; top:160px; left:0px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy;
}
#Cal{
position:absolute; top:253.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize;
-webkit-transform:rotateZ(-5deg);
color:#494A9E;
}

EDİT
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:315px; left:12px; width:375px; text-align:center; z-index:50;
font-size:40.75px; letter-spacing:2; text-shadow: 2px 2px 3px #000000;
}

#Stroke{
position:absolute; top:355.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; shadow: 2px 2px 3px #000000;
}

#weekday{
position:absolute; top:160px; left:10px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy; text-shadow: 2px 2px 5px #000000;
}
#Cal{
position:absolute; top:365.5px; left:10px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize; shadow:2px 2px 3px #000000;
-webkit-transform:rotateZ(-5deg);
}

Editlenmiş hali;
Ekli dosyayı görüntüle 6601

Örnek kod çalışması
}

#weekday{ (Gün bilgisi)
position:absolute; ( duracağı pozisyon)
top:160px; (ortalama)
left:10px; ( sola uzaklık)
width:375px; ( boyut yüksekliği )
text-align:center; ( yazının pozisyonu)
z-index:50; ( ??? )
font-size:150px; (font büyüklüğü)
font-family:heavy; (Font seçimi)
text-shadow: 2px 2px 5px #000000; (Gölge)
}

Hazır TEMA’lar için
Xen HTML Lockscreen Temaları (Türkçe)
yeni başlayanlar için süper bir anlatım olmuş emeğine sağlık hocam. Kilit ekranı için'' var/mobile/library/lockhtml '' yolunu izleyip gerekli düzenlemeleri yapabiliyoruz peki ana ekran için hangi yolu izlemek gerek ?
 

zekeriyacr

Kayıtlı Üye
JailbreakTR
Katılım
18 Eyl 2018
Mesaj
10
Cihaz
iPhone 7 Plus
Evet arkadaşlar sizlere Lockscreen tema ve widgetlerini nasıl editlenebileceğini anlatacağım.
HTML ve Css kod bilgisine hakim olan arkadaşlar muhakkak ki bizlere daha fazla bilgi vereceklerdir.
Ben kullandığım Xen HTML tweaki üzerinden bilgi vereceğim. (Daha önce cihazımızda Xen HTML kurulu olmalıdır.)

1.AŞAMA DİL DEĞİŞİMİ;

1) Cydia’dan reposundan LS EW 176 lockscreen temasını yükledik diyelim.
Ekli dosyayı görüntüle 6592
Yükledikten sonra temanın ilk hali böyle olacaktır.
Ekli dosyayı görüntüle 6593

2) Yüklenen tema ve widgetler cihazımızda var/mobile/library/lockhtml dizini içine kurulmaktadır.
Filza yada iFile aracılığı ile belirtilen konuma gidiyoruz. Ve temamızın kurulu olduğu klasöre giriyoruz. Biz LS EW 176 klasörüne gidiyoruz.
Ekli dosyayı görüntüle 6596

3) Türkçeleştirme için öncelikle Script klasörü içine giriyoruz. Script klasöründe bulunan lang.js dosyasını editleyeceğiz.
if (Lang == "en") {
var days = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
var shortdays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var months=["January","February","March","April","May","June","July","August","September","October","November","December"];
var shortmonths = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
var hourtext = ["Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve"];
var weatherdesc = ["Tornado", "Tropical Storm", "Hurricane", "Thunderstorm", "Thunderstorm", "Snow", "Sleet", "Sleet", "Freezing Drizzle", "Drizzle", "Freezing Rain", "Showers", "Showers", "Flurries", "Snow", "Snow", "Snow", "Hail", "Sleet", "Dust", "Fog", "Haze", "Smoky", "Blustery", "Windy", "Cold", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Cloudy", "Clear", "Sunny", "Fair", "Fair", "Sleet", "Hot", "Thunderstorms", "Thunderstorms", "Thunderstorms", "Showers", "Heavy Snow", "Light Snow", "Heavy Snow", "Partly Cloudy", "Thunderstorm", "Snow", "Thunderstorm", "blank"];
}
Burada bulunan kodların başında hangi dili temsil ettikleri yazaz. "en" ingilizce üzerinden yol alalım. Burada ingilizce günler, saatler, hava durumu ve kısaltmalırını görüyoruz. dilersek direk "en" bölümünü editleyip temanın ayarlar seçeneklerinden ingilizce seçerek devam edebilir. Yada dosyada sayfanın en altına gelerek yeni bir paragrafa "tr" diye bir seçenek ekleriz. Böylelikle tema ayarlarından tr seçimini yaptığımızda türkçe aktif olur. Biz bu yolu izleyelim ve sayfanın en altına yeni bir paragraf açarak üstteki ingilizce kodu kopyalayıp } işaretinin hem altına yapıştıralım. Aşağıda ki gibi ingilice terimleri türkçeleştirelim. İngilizce bilmeyen arkadaşlar çeviri yardımı ile kolaylıkla türkçeleştirme yapabilir. Bazı temelarda ki fontlar türkçe karakterleri desteklemediği için türkçe karakter kullanımına dikkat etmek gerekiyor.
if (Lang == "tr") {
var days = ["Pazar","Pazartesi","Salı","Carsamba","Persembe","Cuma","Cumartesi"];
var shortdays = ["Pzr", "Pzt", "Salı", "Çar", "Per", "Cum", "Cts"];
var months=["Ocak","Subat","Mart","Nisan","Mayis","Haziran","Temmuz","Agustos","Eylül","Ekim","Kasım","Aralik"];
var shortmonths = ["Oc", "Sub", "Mar", "Nis", "May", "Haz", "Tem", "Agu", "Eyl", "Eki", "Kas", "Ara"];
var hourtext = ["Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki", "Bir", "İki", "Üç", "Dört", "Beş", "Altı", "Yedi", "Sekiz", "Dokuz", "On", "Onbir", "Oniki"];
var weatherdesc = ["Kasırga", "Tropikal Fırtına", "Kasırga", "Gök gürültülü", "Gök gürültülü", "Kar", "Sulu Kar", "Sulu Kar", "Hafif Yağmur", "Hafif Yağış", "Karla karışık", "Sağanak", "Sağanak", "Sağanak", "Kar", "Kar", "Kar", "Kar", "Sulu Kar", "Sisli", "Dumanlı", "Puslu", "Sisli", "Rüzgarlı", "Rüzgarlı", "Buzlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Bulutlu", "Açık", "Güneşli", "Açık", "Açık", "Sulu Kar", "Sıcak", "Gök gürültülü", "Gök gürültülü", "Gök gürültülü", "Sağanak", "Şiddetli Kar", "Hafif kar", "Şiddetli Kar", "Parçalı Bulutlu", "Gök gürültülü", "Kar", "Gök gürültülü", "blank"];
}

4) Türkçeleştirme sonrası Ayarlar/Xen Html/ Lockscreen/Background Widget e giriyoruz.
Add widget'e tıklayıp LS EW 176 seçiyoruz. Seçim sonrası siyah bir alanda temamız açılıyor. Alt kısımda ki ayarlar düğmesine tıklıyoruz.
Ekli dosyayı görüntüle 6597
Açılan seçeneklerde saat dilimini isterseniz 12 yada 24 saat olarak seçiyoruz. Türkçeleştirme esnasında "tr" diye yeni dil açtığımız için "en" yazan yere tr yazıp kaydet diyoruz.
Ekli dosyayı görüntüle 6598

Görüldüğü üzere artık temamız türkçe.
Ekli dosyayı görüntüle 6599

Mesaj düzenlendi:


2.AŞAMA GÖRSEL EDİT ( KOD BİLGİSİ GEREKTİRİR)

Yüklemiş olduğumuz temanın görselliğini belirleyen kodlar Style.css içerisinde bulunmaktadır. Burada yapılan değişikliklerle temaya farklı görsellik kazandırılabilir.
Yazıların birbirine yakınlığı uzaklığı, boyutlandırma, gölge ekleme vs gibi herşey bu dosya altında yapılabilir. Ben editlemiş olduğum style.css dosyasında ki kodları ve orjinal style dosyasını buraya atıyorum değişiklikleri görebilirsiniz.

ORJİNAL:
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:327px; left:0px; width:375px; text-align:center; z-index:50;
font-size:18.75px; letter-spacing:2;
}

#Stroke{
position:absolute; top:243.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; color:#494A9E;
}

#weekday{
position:absolute; top:160px; left:0px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy;
}
#Cal{
position:absolute; top:253.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize;
-webkit-transform:rotateZ(-5deg);
color:#494A9E;
}

EDİT
body{
margin:0;
padding:0;
font-weight:100;
text-shadow:1px 1px 1px rgba(100,100,100,0.4);
font-family:reg;
text-transform:uppercase;
color:#f3f3f3;
letter-spacing:1;
}

@font-face{
font-family:sc;
src:url(Stuff/script.otf);
}
@font-face{
font-family:heavy;
src:url(Stuff/heavy.otf);
}
@font-face{
font-family:reg;
src:url(Stuff/reg.otf);
}
@font-face{
font-family:stroke;
src:url(Stuff/stroke.otf);
}


#Clock{
position:absolute; top:315px; left:12px; width:375px; text-align:center; z-index:50;
font-size:40.75px; letter-spacing:2; text-shadow: 2px 2px 3px #000000;
}

#Stroke{
position:absolute; top:355.5px; left:0px; width:375px; text-align:center; z-index:50;
font-size:82.5px; font-family:stroke; shadow: 2px 2px 3px #000000;
}

#weekday{
position:absolute; top:160px; left:10px; width:375px; text-align:center; z-index:50;
font-size:150px; font-family:heavy; text-shadow: 2px 2px 5px #000000;
}
#Cal{
position:absolute; top:365.5px; left:10px; width:375px; text-align:center; z-index:50;
font-size:24.375px; font-family:sc; text-transform:capitalize; shadow:2px 2px 3px #000000;
-webkit-transform:rotateZ(-5deg);
}

Editlenmiş hali;
Ekli dosyayı görüntüle 6601

Örnek kod çalışması
}

#weekday{ (Gün bilgisi)
position:absolute; ( duracağı pozisyon)
top:160px; (ortalama)
left:10px; ( sola uzaklık)
width:375px; ( boyut yüksekliği )
text-align:center; ( yazının pozisyonu)
z-index:50; ( ??? )
font-size:150px; (font büyüklüğü)
font-family:heavy; (Font seçimi)
text-shadow: 2px 2px 5px #000000; (Gölge)
}

Hazır TEMA’lar için
Xen HTML Lockscreen Temaları (Türkçe)
Hocam iWidgets türkçeletirmeyi söylermisin
 

sakuraaaaa

Aktif Üye
JailbreakTR
Katılım
26 Ağu 2019
Mesaj
92
Cihaz
iPhone SE
Güzel olmuş ana ekranda hareketli animasyonlar kullanmadığımda kilitli ekrana ne koyarsan koy şarjı yemiyor xen i çözemeyen hemen siliyor kurulan widget çok önemli
 
Tips
Tips
Üst Alt