-- Genel

Sublime Text – Kurulumu, Kullanımı, Eklentileri ve İpuçları

Merhaba bu yazımda Sublime Text Editöründen bahsetmek istiyorum bende yaklaşık 4,5 editör değiştirdikten sonra Sublime Text`e geri döndüm çünkü kullanımı  eklentileri ve arayüzü oldukça başarılı.Bende bu yüzden Sublime Text`in Kurulumu, Kullanımı, Eklentileri ve ipuçlarını anlatacağım.

 

Sublime Text 2 Nasıl İndirilir ?

Sublime Text 3 mevcut ama ben Sublime Text 2 kullanıyorum bunun üzerinden gideceğim.

Buraya tıklayarak Sublime Text 2 web sitesine gidelim.İşletim sistemimize uygun olan versiyonu indirelim.

 

İnen Dosyayı normal bir şekilde kuralım(Burayı anlatmama gerek yok galiba:) ).

 

Sublime Text 2 Eklentileri

Benim en çok kullandığım eklentileri kurabilirsiniz.Sublime Text`te diğer editörlere göre eklenti kurulumu biraz farklı.

CTRL+Shift+P tuşlarına basalım ve açılan pencereye Install Package Yazalım.Aşağıda resimli bir şekildede anlattım.

 

sublime-text-2

 

Not:Eğer bu ekranda Install Package Yazısı gelmiyor ise aşağıdaki adımları uygulayın.

Bu hatayı düzeltmek için Sublime Text programında View > Show Console menüsüne girip Konsolu açalım. Altta açılan pencereye aşağıdaki kodları yapıştıralım ve progoramı kapatıp açalım.

import urllib2,os,hashlib; h = 'eb2297e1a458f27d836c04bb0cbaf282' + 'd0e7a3098092775ccb37ca9d6b2e4b7d'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')

 

Şimdi Eklentileri yükleyebiliriz.CTRL+Shift+P tuşlarına basalım ve Install Package yazalım ve Enterlayalım.Her eklenti yüklerken bu komutu yazıp yükleme yapıyoruz bunuda unutmayalım.

 

1)Emmet Eklentisi

 

Çoğu yerde Zen Coding olarak geçer hatta tüm editörlerde diyebiliriz burada adı değiştirilmiş olarak geliyor ama işlevi aynı 🙂 , Bu Eklentiyi kurduktan sonra HTML sayfası açalım ve html:5 yazıp TAB tuşuna basalım.HTML5 standart yapısının oluşturduğunu göreceksiniz.Bu şekilde farklı kullanımlarıda mevcut aşağıda bazıları gösterdim.

 

ul>li*5>a : Bu kısaltmayı yazdığınızda aşağıdaki gibi bir liste yapısı oluşturacaksınız.

<ul>
     <li><a href=""></a></li>
     <li><a href=""></a></li>
     <li><a href=""></a></li>
     <li><a href=""></a></li>
     <li><a href=""></a></li>
</ul>

 

form>input[class=”kelime”]*5: Burada Form içinde sınıfı kelime olan 5 adet input oluşturduk.

<form action="">
	<input type="text" class="kelime">
	<input type="text" class="kelime">
	<input type="text" class="kelime">
	<input type="text" class="kelime">
	<input type="text" class="kelime">
</form>

 

mt:a: Bu kullanımda CSS için bunu css dosyanızda yazdığınızda aşağıdaki gibi bir çıktı verecektir.

margin-top:auto;

 

Bunun gibi yüzlerce kullanımı var hepsine buradan ulaşabilirsiniz.

2)Emmet CSS Spinnets Eklentisi

HTML için olan Emmet eklentisinin CSS versiyonu.

 

3)ColorPick Eklentisi

CTRL+Shift+C kısayolu ile CSS`de Renk Paleti açıyoruz ve istediğimiz rengi seçip kodunu alabiliyoruz.

 

 

4)AutoFileName Eklentisi

HTML/CSS de resim,ses kıcaca yol belirtirken dosyaların isimleri gösteren bir eklenti.

 

Not: Benim kullandıklar bunlar bir de Tüm jQuery eklentilerinide kurabilirsiniz, Çok işe yarıyor.

 

Sublime Text Kullanımı ve İpuçları

 

Sublime Text`te Yazıları Büyütmek & Küçültmek

Bu işlemi CTRL tuşuna basılı tutup Fare Tekerleğini ileri geri döndürerek yapabilirsiniz.Fare kullanmıyorsanız CTRL tuşuna basıp + veya – tuşları`yla yapabilirsiniz.

 

Çoklu Seçim Özelliği 

Bir kodu satırı seçip CTRL+D tuşlarını basığımızda Çoklu seçim devreye girer ve seçilen yerleri sadece bir kez`de değiştrebilirsiniz. Bunla uğraşmayıp Kelimenin aynısını değiştirmek istiyorsanız ALT+F3 işinizi görecektir.

 

Sublime Text  Tema Seçimi

Tema seçmek için Preferences > Color Scheme menüsüne girip istediğiniz temayı seçebilirsiniz.

 

Sublime Text  Proje Yönetimi

Solda proje yönetimi yapabileceğimiz proje klasöründeki dosya,resimlere erişebiceğimiz paneldir.Bu panele

View > Side Bar > Show Side Bar menüsünden ulaşabiliriz.Proje eklemek için ise Project Menüsünden Add Folder to Project menüsünden proje klasörünü seçebilirsiniz.