Müjdat Korkmaz - Kişisel blog. » İpuçları

HandBrake ile Filmlerinize Altyazı Ekleyin

Müjdat Korkmaz — Mon, 23 Aug 2010 14:41:12 +0000

Merhaba arkadaşlar. Bu yazımda sizlere HandBrake ile filmlerinize nasıl altyazı gömeceğinizi anlatacağım. Program mkv veya mp4 formatı yani iPod veya iPhone’larınız için de geçerlidir, ama ben yalnızca mp4 formatını denedim.

Öncelikle HandBrake adlı programı buradan indiriyoruz. Yükleme süreci kısa sürüyor ve programı açıyoruz….

jQuery ScrollTo Posts Eklentisi

Müjdat Korkmaz — Tue, 22 Jun 2010 14:19:44 +0000

Birçok blogda footer kısmında mevcuttur, yukarı çık şeklinde bir buton vardır, ve tıkladığınızda yavaş bir şekilde sayfanın en üstüne çıkar. İşte bu yazıda da sizlere bu özelliği, yazılar arası geçişlerde nasıl kullanılacağını WebDesignerWall‘da gördüğüm yazıyı Türkçeleştirerek anlatacağım. Tabii yalnızca yazılar arası geçiş olması şart değil, bunu birçok farklı yerde de kullanabilirsiniz. Ama bu yazıdaki asıl kullanım amacı yazılar arası atlama yapmak içindir. Neyse konuya gelelim…

CSS box-shadow özelliği

Müjdat Korkmaz — Mon, 21 Jun 2010 17:34:54 +0000

Belki birçok blogda görmüşsünüzdür. Oldukça güzel bir özellik. CSS’de herhangi bir id veya class’a gölge efekti veriyor bu özellik. Bunu birçok yerde kullanabilirsiniz. Mesela ben yazı içerisindeki resimlere ekledim bu özelliği.

Bu css hilesi yalnızca Mozilla Firefox ve webkit tabanlı tarayıcılarda geçerli. Yani Internet Explorer ve Opera tarayıcılarında geçerli değil.

Mozilla Firefox için:

-moz-box-shadow: 0 0 5px #666;

Webkit tabanlı tarayıcılar için:

-webkit-box-shadow: 0 0 5px #666;

Kodları geçerli olacaktır. Demo sayfasından da canlı bir örneğini görebilirsiniz.

jQuery ile basit tab menü yapımı

Müjdat Korkmaz — Sun, 20 Jun 2010 15:16:06 +0000

Aslında uzun zamandır yazmak istediğim bir yazıydı, ama tema falan derken şimdiye kısmet oldu… Neyse efenim konuya geçelim; Bildiğiniz gibi tab menüler blogunuzun yan menüsündeki kalabalığa birebir geliyor. Örneğin, kategorileri, popüler yazıları v.b. gibi şeyleri, alt alta dizmek yerine yan yan diziyor, böylece alandan ve yan menüdeki o kalabalıktan kurtuluyorsunuz.

Ben de şimdi hemen şu yan menüde görmüş olduğunuz gib bir tab menünün nasıl yapıldığını anlatacağım sizlere, birkaç basit adımda biraz HTML, biraz CSS ve biraz da jQuery ile blogunuza bir tab menü yapabileceksiniz.

IE6 Margin & Padding Sorunu ve Çözümü

Müjdat Korkmaz — Thu, 17 Jun 2010 16:07:26 +0000

En son, temadaki iyileştirmeleri yaparken IE6′da sidebardaki tab menünüm sorun yarattığını farkettim. Bunun üzerine ufak bir araştırma yaptım ve David Walsh Blog‘da sorunun neden kaynaklandığını ve nasıl çözüleceğini anlatan bir yazı buldum. Sonuç olarak sorunu çözdüm ve burada da anlatayım dedim.

Bu sorunu halleden ufak bir css kodu var. Aşağıdaki örnek kodu orijinal yazıdan aynen aldım ve kodda normalde hiçbir problem yok. Fakat IE6 için yetersiz kalıyor:

#global-column-1{ margin:0 0 0 33px; padding:0 20px 0 0; width:255px; float:left; }
#global-column-2 { margin:0 0 30px 30px; width:250px; float:left; }

Yukarıdaki kod IE6 hariç hiçbir tarayıcıda sorun çıkarmayacaktır, ancak IE6′da double margin/padding ile ilgili bug olduğu için için kod çalışmayacaktır.

Aynı koda ufak bir ekleme yaparak bu sorunu düzeltebiliriz.

#global-column-1 { margin:0 0 0 33px; padding:0 20px 0 0; width:255px; float:left; } * html #global-column-1 { display:inline; }
#global-column-2 { margin:0 0 30px 30px; width:250px; float:left; }

Yukarıda yer alan display:inline; asıl sorunu düzelten koddur, * html #global-column-1 ifadesi ise yalnızca IE6 tarafından görüntülenmektedir. Yani bu ifadeyi kullanmasak da sorun çözülür.

Kaynak: David Walsh Blog

Add to search bar Firefox Eklentisi

Müjdat Korkmaz — Fri, 11 Jun 2010 20:05:51 +0000

Çok hoşuma giden bir eklentidir. Hızlıca anlatayım; Örneğin Google’dan bir şey ararken, Firefox’da adres çubuğuna kelimeyi yazıp enter’a basmamız yetiyor. Ancak işin içine başka aramalar girince önce aramayı yapacağımız web siteye girip, daha sonra oradaki arama kutusunu bulup sonra başlıyorduk aramaya.

İşte bu eklenti sayesinde herhangi bir web sitedeki arama kutularını tek bir yere toplayabiliriz. Ve arama çubuğunda en sağ kısımdan neyi nerede arayacaksak tek tık ile aktif edebilir ve daha sonra adres çubuğuna yazdığımız arama terimini o web site üzerinden aratmış oluruz. Aşağıdaki resimde benim arama yaptığım sitelerin bir listesi var. İstediğimi aktif edip, araç çubuğuna kelimeyi yazıp aratıyorum.

PX – EM dönüştürücü

Müjdat Korkmaz — Mon, 07 Jun 2010 17:54:20 +0000

Bugün temada değişiklikler yaparken sık sık bu web aracını kullandım, hazır da boşluğu yakalamışken hakkında bir yazı yazayım dedim. Basit bir şekilde özetlersek -ki zaten karmaşık bir şey değil - pxtoem aracı px değerlerini em değerlerine dönüştürüyor. Yani, eğer CSS’de ölçülendirmelerinizi px ile yaptıysanız em biçimine çevirebilir veya em ile yaptıysanız px‘e çevirebilirsiniz. Ayrıca PX ve EM arasındaki farklara bakmak isterseniz şu yazıyı okumanızı tavsiye ederim.

Firefox 3.6′da Yeni sekmede aç Sorunu ve Çözümü

Müjdat Korkmaz — Tue, 26 Jan 2010 14:49:11 +0000

Aslında bu bir sorun değil, ama benim gibi alışamayanlar için sorun olabiliyor. Şimdi neyden bahsettiğimi anlamamış olabilirsiniz doğal olarak. Efem, geçenlerde de Twitter’dan bahsettiğim üzere, Firefox 3.6′da herhangi bir linke “Yeni sekmede aç” dediğimiz zaman, bulunduğumuz sekmenin hemen yanına açıyor. Eski sürümlerde ise, yeni açılan sekmeyi en sona atıyordu. İşte benim gibi bu duruma alışamayanlar için çözümü kısaca anlatayım. Bu arada bu sorunun çözümünü Orçun buldu ben anlatıyorum.

Adres çubuğuna about:config yazıp enter diyoruz ve filter kısmına browser.tabs.insertRelatedAfterCurrent yazıp karşımıza çıkan filtreleme sonucuna sağ tıklayıp Değerini değiştir dediğimiz zaman, artık Yeni sekmede aç dediğimiz bir link için açılan sekme en sona gidecek.

Firefox 3.6′da Görsel Sekme Değiştiriciyi Aktif Etmek

Müjdat Korkmaz — Sun, 24 Jan 2010 11:08:57 +0000

Firefox 3.6′nın yeni özelliklerinden birisi de sekmeler arasında dolaşırken, yani ctrl+tab yaptığımız zaman görsel bir sekme değiştirici çıkması, tıpkı Windows 7‘de alt+tab ile pencereler arasında dolaşırken olduğu gibi. Aktifleştirilmesi de oldukça kolay.

Öncelikle adres çubuğuna about:config yazıp enter diyoruz. Ardından Süzgeç (Filter) bölümüne browser.ctrlTab.previews yazıp enter diyor ve filtreleme sonucu karşımıza çıkan sonuca, sağ tıklıyor ve Değerini değiştir diyoruz. Sonuç olarak artık ctrl+tab yaptığınızda karşınıza aşağıdaki gibi görsel bir sekme değiştirici çıkmış olacak.

jQuery ile İletişim Formunuza Esneklik Katın

Müjdat Korkmaz — Sat, 23 Jan 2010 18:23:21 +0000

Bu tür ipucu yazıları serisine bir haylı sardım bu aralar. Hem kendim öğreniyorum hem de doğru düzgün içerik girmiş oluyorum bloga. Neyse, bu yazıda ufak bir jQuery betiği ile iletişim formlarınıza oldukça güzel görünüm katacak bir kaydırma efektinden bahsedeceğim.

CSS3 ile Gelen Yeni Özellikleri IE’de Kullanabilmek

Müjdat Korkmaz — Fri, 22 Jan 2010 14:29:34 +0000

Başlığın o kadar uzun ve karmaşık gözüktüğüne bakmayın. Çok basit bir scriptten bağsedeceğim size. Mâlum CSS3 geldi ve akabinde, öncesinde çok zahmetli olan özelliklerin birçoğu yalnızca kodlarla yapılabilir hale geldi. Örneğin, bir önceki CSS3 Gradient Generator başlıklı yazımda da belirttiğim gibi, eskiden resim ile yaptığımız gradient efektini CSS3 ile birlikte yalnızca kodlar ile yapabiliyoruz.

Ancak bu ve bunun gibi birçok özelliği bizim ilkel tarayıcımız olan Internet Explorer (5-8) algılayamıyor, o yüzden aşağıdaki kodu tagleri arasına yerleştiriyor ve bu sorunu da ortadan kaldırmış oluyoruz.

(k: Keith Clark)

CSS3 Gradient Generator

Müjdat Korkmaz — Sat, 09 Jan 2010 15:21:48 +0000

Önceden bir görsel ile yaptığımız gradient efektini CSS3 ile birlikte yalnızca kodlar ile yapabiliyoruz. Ancak henüz Safari, Google Chrome ve Firefox dışındaki tarayıcılar bu özelliği desteklememekte. Sonuç olarak bu tarayıcılar için CSS3 Gradient Generator aracını kullanarak, birkaç tık ile istediğiniz şekilde gradient efektini tasarımınıza uygulayabilirsiniz.

CSS ile Anaglifik Yazı Efekti Oluşturmak

Müjdat Korkmaz — Mon, 04 Jan 2010 18:37:15 +0000

Anaglifik dendiği zaman biraz yabancı gelebilir ama bildiğimiz gölge efekti gibi bir şey. Daha ayrıntılı bilgiyi Google‘dan alabilirsiniz. Neyse ben anlatıma geçeyim.

Öncelikle kesinlikle çok kolay bir efekt olduğundan bahsetmeliyim. Verdiğim kodları doğru bir şekilde kaydederseniz yapımı oldukça basit. Ve istenilen her yerde kullanılabilir ama bence, blogunuzun üst (header) kısmında imaj değil de, yalnızca bir yazı efekti olmasını istiyorsanız, tam da aradığınız şey bu.

ScrapBook: Mozilla Firefox Sayfa İmleme Eklentisi

Müjdat Korkmaz — Sat, 26 Dec 2009 13:15:27 +0000

ScrapBook eklentisi, Mozilla Firefox üzerinde yer imlerine eklediğimiz sayfaları düzenleme; Yani kategorize etme, bu sayfalardan ekran görüntüsü alma, organize etme, sayfalar içinde ayrıntılı arama seçeneği ve bunun gibi birçok özelliği bize sunan bir eklenti. Bu eklentiyi edinmek için eklenti sayfasını ziyaret edebilir, ve kullanımı hakkında daha ayrıntılı bilgi almak için web sitesine veya ayrıntılı pdf dosyasına göz atabilirsiniz.

Envai Çeşit Cheat Sheet

Müjdat Korkmaz — Fri, 25 Dec 2009 15:51:05 +0000

HTML, CSS, PHP, Javascript ve bunların yanı sıra birçok konuyla ilgili, yazının başlığında da belirttiğim gibi envai çeşit cheat sheet’lerin bir listesini buldum ve hiçbir değişiklik yapmadan aynen buraya geçirdim. Biraz uzuncana bir liste oldu. Yazının devamında görebilirsiniz.

MooTools Overlay Eklentisi ve Kullanımı

Müjdat Korkmaz — Wed, 23 Dec 2009 13:48:44 +0000

Son birkaç gündür David Walsh‘ın blogunu takip ediyorum. Ve gerçekten kaliteli yazılar yayınlıyor. Özellikle de MooTools dersleri ile ilgili yazıları. Bu yazıda yine David Walsh’ın blogunu kaynak olarak kullandım ve “MooTools Overlay” eklentisinin kullanımını anlatacağım. Gayet basit ve iki adımda tamamlanıp kullanıma hazır olacak bir eklenti.

XP’de Herhangi Bir Dosya Türünün Simgesini Değiştirmek

Müjdat Korkmaz — Tue, 22 Dec 2009 16:13:37 +0000

XP’de genel olarak tüm dosya türlerine ait simgeler mevcut. Ama örnek verecek olursak PHP dosyaları için belirli bir simge yok. Ve bu tür bilinmeyen dosyalar için sistem o dosya türüne, kendi simge dosyalarından -benim hiç hoşuma gitmeyen- bir simge koyar. (bkz) Siz de benim gibi o simgeden nefret eden biriyseniz ve kendi dosya türlerinize istediğiniz simgeyi koymak istiyorsanız bu anlatacağım yazıyı dikkatle okuyun.

MooTools ile Slideshow Yapmak

Müjdat Korkmaz — Mon, 21 Dec 2009 16:26:28 +0000

Bu yazıda MooTools kullanarak çok basit bir slideshow yapmayı göstereceğim. Açıkçası zaten gösterilmiş olan bu yazıyı Türkçeleştireceğim.

Geri Dönüşüm Kutusunu Masaüstünden Kaldırmak

Müjdat Korkmaz — Tue, 15 Dec 2009 15:27:53 +0000

Benim de merak ettiğim bir şeydi. İnternette biraz araştırma yaptım ve buldum. Bildiğiniz üzere artık birçok masaüstü programıyla XP’yi düzenliyor ve kendi masaüstümüzü yaratıyoruz. Ama bazen Geri Dönüşüm Kutusu masaüstünde kaldığından dolayı sinir bozucu olabiliyor. Ancak bunun da çözümü çok basit.

XP kullanıyorsanız:

Başlat > Çalıştır > gpedit.msc yazın ve enterlayın. Karşınıza grup ilkesi çıkacak. Oradan da Yönetim şablonları > Masaüstü, yolunu izleyerek seçenekler arasından Masaüstünden Geri Dönüşüm Kutusu’nu Kaldır seçeneğini etkin hale getirin ve masaüstüne gelip bir F5 çekin. İşlem tamamdır.

Home Edition kullanıyorsanız:

Burada işler biraz karışık. registry‘de değişiklikler yapmamız gerekebilir. O yüzden bu işlemleri yapmadan önce bir yedeğini almanız iyi olacaktır. Daha sonra; Başlat > Çalıştır > regedit yazıp enterlayın ve “hkey_local_machine\software\microsoft\windows\cur rentversio n\explorer
\desktop\namespace” bu dizini bulun. Daha sonra “645FF040-5081-101B-9F08-00AA002F954E” bu girişi bulun, ister silin, isterseniz de REG_DWORD değerini 0×00000001 olarak değiştirin. Reset atın. İşlem tamamdır.

Kaynak: PCnet Forum.

Tumblr’a Yorum Aparatı Ekleyin

Müjdat Korkmaz — Thu, 10 Dec 2009 16:40:44 +0000

FriendFeed’de ne yazayım diye düşünürken, Orçun bir fikir verdi. Tumblr bloglarında bildiğiniz üzere yorum yapabilme özelliği yok. Fakat bunu manuel olarak farklı servisler aracılığı ile kendimiz yapabiliyormuşuz. Öğrendim ve anlatayım dedim. Daha doğrusu Orçun dedi, onun vesilesiyle anlatıyorum.

Öncelikle yorum aparatını alacağımız servislerden bir tanesi -aralarından en iyisi- olan DISQUS‘a üye oluyoruz. Üyelik işlemi çok basit, site URL ve İsmini yazarak formu tamamlıyor ve ikinci aşamaya geçiyoruz. İkinci aşamada bize kullandığımız altyapıyı soruyor, Tumblr’ı seçip ileriki aşamaya geçiyoruz. O aşamada ise size blogunuz için bir kısa isim veriyor, daha sonra o ismi, Tumblr hesabınıza giriş yapıp tema düzenleme kısmından gerekli yere ekliyorsunuz. İşlem bu kadar.

Blogunuza Twitter Aparatı Ekleyin

Müjdat Korkmaz — Sat, 05 Dec 2009 12:11:47 +0000

Son günlerde Twitter gerek tasarım gerekse ekstra özelliklerini geliştiriyor. Bir kaç gün öncesine kadar Twitter’ın Widget seçenekleri pek de güzel değildi, ancak güncelleme yapmışlar ve widget seçeneklerini daha esnek ve kullanışlı hale getirmişler. Birçok kişi biliyordur, ama bilmeyenler için blogunuza nasıl ekleyeceğiniz konusunda yardımcı olayım dedim.

Öncelikle, Twitter’da Settings bölümüne giriyoruz. More Info URL kısmına yani web sitemizi yazdığımız kısa geliyor ve hemen altında “(You can also add Twitter to your site here)” yazan bölüme tıklıyoruz. Karşımıza Widget seçenekleri çıkıyor, dilerseniz web siteniz haricinde Facebook ve MySpace profilinize de eklemeniz için size seçenekler sunulmuş. Biz ilk sıradaki My Website seçeneğini seçiyor ve açılan menüden Profile Widget‘ı seçiyoruz.

Artık son aşamadayız, boş kutucuğa kullanıcı adımızı yazıyor ve Preferences, Appearance ve Dimensions menülerinden de gerekli ayarlamaları yaptıktan sonra Finish & Grab Code butonuna tıklayarak karşımıza çıkan kodu kopyalıyor ve blogumuzda görünmesini istediğimiz yere yapıştırıyoruz.

Sonuç; İşlem tamamlanmılştır. Artık tasarımınıza uygun renkler ve boyutlarda hazırladığınız Twitter aparatınız son güncellemelerinizi gösterecektir.

Google’da Sosyal İmleme Sitelerine Göre Arama

Müjdat Korkmaz — Sat, 31 Oct 2009 12:08:38 +0000

Bir kaç örnek ile açıklayacağım bu Google arama özelliğinin hepinizin işine yarayacağına eminim. Bildiğiniz üzere günümüzde bir çok sosyal imleme sidesi mevcut. Ve aradığımız bir şeyin hangi sosyal imleme sitesinde daha iyi sonuç vereceğini anlamak için bütüm imleme sitelerini gezerek içinde arama yapmamıza gerek yok. Google bizim için bunu zaten yapabiliyor. Nasıl mı?