Adım Adım Wordpress Sitesi Kurma

 

Adım Adım Wordpress Sitesi Kurma

Bu yazıda "Royal Elementor Kit" kullanarak bir site kurulumunu adım adım yazmaya çalıştım. Farklı temalar ile benzer işlemler yaparak ilerleyebilirsiniz.

Not: Tema üzerinde özelleştirme yapmak için 4. adımdan sonra css ve js için eklentiler önerdim. Fakat bu özelleştirmeleri Child Theme ekleyerek de yapabilirsiniz. Eğer kaynak dosyalarda değişiklik yapmak gibi detaylı özelleştirmeleriniz olacaksa Child Theme yöntemi ile devam edebilirsiniz. Bu durumda bahsettiğim css ve js eklentilerine ihtiyacınız olmaz. Bu ayrımı baştan yapıp aşağıdaki adımları ona göre uygulayın. Child Theme nedir ve nasıl eklenir sorularına buradan yanıt bulabilirsiniz.

1. Temayı kurduktan sonra template kit paketini kurmak için bir buton çıkacak, bunu kur.
2. Free olanlardan bir template kit paketi seç ve kur.
3. Ayarlar menüsündeki tüm alt sayfalara girerek okuma, yorum gibi tüm ayarları size uygun şekilde yapın. Aşağıda önemli ayarları yazıyorum (bunları yapmanızı öneririm)
  • Ayarlar > Okuma: "Ana sayfa görüntülenmesi" için "Sabit sayfa" seçeneğini belirleyip ana sayfanızı kutudan seçin.
  • Ayarlar > Tartışma: " İnsanların yeni yazılara yorum yapmasına izin ver" ve "Kademeli yorumlar.." seçeneklerini pasif yapın. "Yorum el ile onaylanmalı" aktif olsun.
  • Ayarlar > Ortam: "Yüklemelerimi aylık -ve yıllık- bazda klasörlerde tut" işaretini kaldır (blog benzeri bir site yapmıyorsanız bu ayarı öneririm).
  • Ayarlar > Kalıcı bağlantılar: "Yazı ismi" seçeneğini aktif yapın.
4. Css ve Js ekleyerek tema üzerinde özelleştirme yapmak için Simple Custom CSS and JS (by SilkyPress) eklentisini kur (Child tema kullanıyorsanız bu ekletilere gerek olamayabilir).
5. custom_fg adıyla css ve js dosyası ekle (eklerken sağdaki ayarlarından harici dosya ve head seçeneklerini belirleyin).
6. Ayrı bir sekmede Royal Addons > Theme Builder menüsüne girip Header sekmesindeki edit butonuna tıklayın. Elementor açılacak. Buradan önce logoya tıklayıp svg logoyu görünen üç yere de ekleyin.
7. Klavuz penceresinden en üstteki bölüm yazısına tıklayın. Soldaki panelden Gelişmiş sekmesindeki CSS ID kısmına "fgtopbar" gibi benzersiz bir id ismi verin.
8. custom_fg.css dosyasına header'a svg logo desteği için şunları ekle:
#fgtopbar .wpr-logo,
#fgbottombar .wpr-logo {
    width: 100%;
}
#fgtopbar .wpr-logo-image img,
#fgbottombar .wpr-logo-image img {
    width: 100%;
}
#fgtopbar .wpr-logo-image {
    max-width: 136px !important;
    margin: 0;
}
9. Bundan sonra css'e sitedeki diğer buton rengi, yazı, rengi, header rengi gibi özelleştirmelerinizi ekleyerek ve bir yandan da slide, başlık gibi alanlara içeriklerinizi girerek sitenizin ilk ayarlamalarını yapın.
10. 6. adımdakine benzer şekilde varsa Footer düzenlemelerini de yapabilirsiniz.
11. Sayfalar menüsüne gelin ve her sayfayı hızlı düzenle diyerek adını ve kısa adını düzeltin.
12. Tavsiye ettiğim aşağıdaki eklentileri kurun:
  • "Yoast Duplicate Post" eklentisini sayfa ve postları kopyalamak/çoğaltmak için kurun.
  • "Yoast Seo" eklentisini kurun ve ilk ayarları yapın. Böylece temel Seo ayarlarınızı yapmış olacaksınız.
  • "Contact Form 7" kur ve ayarlarını yap, sitede iletişim formu olarak uygun yere ekle. Contact Form 7 kurulumu hakkındaki yazıyı buradan detaylı olarak inceleyebilirsiniz. Son olarak bu formun mail gönderebilmesi için bir sonraki maddede açıklayacağım smtp eklentisini kurmanız gereklidir.
  • Mail gönderimi için web sitenizde SMTP ayarlarının yapılmış olması gereklidir. Bu iş için "Fluent SMTP" eklentisini öneririm. Geliştiricisi; "FluentSMTP & WPManageNinja Team" olan bu eklenti ile mail gönderim işlemlerinizi yapabilirsiniz. Fluent SMTP ayarlarını nasıl yapacağınızı buradan okuyabilirsiniz.
  • "Akismet Anti-Spam: Spam Protection" eklentisi ile spam yorumları engelleyin.
  • Seo amaçıyla yüklemenizi önerdiğim diğer eklentiler "Google tarafından Site Kit" ve "IndexNow by Microsoft Bing". Bu eklentileri bağlarken Google ve Bing seo bağlantılarını da kurmuş olacaksınız.
13. Temel olarak yapacaklarımız bu kadar. Artık yazılarınızı veya sayfalarınızı içerik olarak oluşturabilirsiniz. 
14. İsteğe ve ihtiyaca bağlı kullanabileceğiniz aşağıdaki eklentileri tavsiye ederim:
  • "GTranslate by Translate AI Multilingual Solutions" İngilizce veya başka dilleri sitenize eklemek istiyorsanız bulut çevirme özelliği ile direk tarayıcı üzerinden sitenizin dilini değiştirebilen bir eklentidir. Böylece sayfa içeriklerinizi tek tek çevirmek gibi zahmetli bir işten kurtulursunuz. Detaylı bilgi için buradan yardım alabilirsiniz.
  • "Popup Maker by Popup Maker" web sitenizde popup oluşturmak, e-posta aboneliği vb açılır pencere işlemleri için kullanabileceğiniz bir eklentidir. Ben genelde "Çerezleri Kullanıyoruz" uyarısı için kullanıyorum. Buradan nasıl ekleneceğini okuyabilirsiniz.
  • "Jetpack" eklentisi ile site istatistikleri, hız ve performans, seo araçları gibi faydalı olabilecek araçları wordpress sitenize eklemiş olursunuz.
  • "Webcraftic Disable Comments" eklentisi ile yorumları kapatabilirsiniz.

Yukarıdaki adımlarda 4. adımdan sonra bahsetmeye başladığım custom css ve js kodları yerine tema özelleştirmeleriniz için Child Theme yani çocuk teması ekleme yolunu da alternatif olarak uygulayabilirsiniz. Child tema kullanma ihtiyacı css ve js özelleştirmelerinden ziyade, kaynak kodlarda (örneğin header.php içindeki kodlarda) değişiklik yapmak istediğinizde ortaya çıkacaktır. Eğer tema dosyalarında bu anlamda özelleştirmeler düşünüyorsanız Child tema oluşturabilirsiniz. Bu durumda yukarıda anlattığım custom css ve/veya js eklentisine ihtiyaç duymayabilirsiniz. Çünkü Child temanın style.css dosyasına zaten bu özelleştirmeleri ekleyeceksiniz.

...
Son Güncelleme: 12/10/2023

UPS Kargo Sözleşmeniz Üzerinden Fiyat Hesaplama


UPS Kargo Sözleşmeniz Üzerinden Fiyat Hesaplama

YURT DIŞI

Yurtdışı gönderiler için ExpressSaver en çok tercih edilen fiyat listesidir. Buradaki fiyatlar bilgi amaçlıdır.  Paketinizin ebadı, ağırlığı ve içindeki muhtevası gibi birçok duruma göre ek ücretler çıkabilir. En güncel fiyat politikaları ve fiyatlar için UPS ile iletişime geçin.
  • Boyutsal ağırlık yani desi hesaplaması yapın:
    Boyutsal ağırlık(kg) = Uzunluk(cm) x Genişlik(cm) x Yükseklik(cm) / 5.000
  • Sözleşmenizle gönderilen excel tablosundan ülke kodunu bulun. Ülke koduna göre tabloda paketinizin boyutsal ağırlığına denk gelen navlun ücretini bulun. Bu ham fiyattır ve USD cinsindendir.
  • Haftalık olarak değişen yakıt ücretini buradan bakın. %2.5 evrensel posta hizmet (eph) ücreti ile birlikte yakıt ücretini de ekleyin:
    Navlun fiyatı * 1.27 * 1.025 (yakıt ücret yüzdesi %27 ise 1.27 şeklinde yazın)
  • Eğer gönderini 100 cm üzeri ise 16.5$ ek ücreti de ekleyin.
  • Boyutsal ağırlığı 30 kg üzeri olan gönderiniz için müşteri temsilciniz ile görüşün.


IOS'da (iphone) Html Video Çalışmama Hatası


IOS'da (iphone) Html Video Çalışmama Hatası

iphone'da safari veya chrome tarayıcılarında sitenizdeki html video elementi ile eklediğiniz videonun çalışmadığını farkederseniz aşağıdaki örnekte olduğu gibi playsinline özelliğini eklemeyi deneyin.

<video src="https://ornek.com/video.mp4" autoplay muted loop playsinline></video>

Cron Jobs

Cron Jobs Hakkında

Cron işleri oluşturulurken edindiğim bilgileri burada paylaşıyorum.

Bir Url için Cron Job Oluşturma:

Bunu iki şekilde yapabilirsiniz:
wget "https://example.com/index.php?route=product&name=book" >/dev/null 2>&1
curl -L -s "https://example.com/index.php?route=product&name=book"
Bu iki kullanımdan hangisi sizde çalışırsa onu kullanabilirsiniz. 

Url için Cron Job Oluşturdum Fakat Url'deki Parametreler Çalışmıyor:

Burada url'yi tırnak işareti arasına alarak parametrelerin de okunabilmesini sağlayabilirsiniz. Tırnak işareti koyulmazsa parametreler gitmez. Örneğin name=book parametresi gitmeyeceği için name değişkeni tanımsız hatası alabilirsiniz. Yukarıdaki örneği inceleyebilirsiniz.

Zamanlama İfadeleri:

Cron işleri belirttiğiniz zamanda tetiklenir ve çalışır. Bu zamanı belirlemek için bazı kullanım şekillerini bilmek işinizi kolaylaştıracaktır.
  • Saat 03.35'de çalışması için:
    Dakika: 35 Saat: 03
  • Saat 00.00'da çalışması için:
    Dakika: 0 Saat: 0
  • Her 15 dakikada bir çalışması için:
    Dakika: */15 Saat: *
  • 2 saat ara ile tam saatte çalışması için (yani 00:00, 02:00, 04:00 ... saatlerinde çalışır):
    Dakika: 0 Saat: */2
Not: Belirtmediğim diğer alanlar * olarak kalsın.

Amazon'da Ürün Reklamı Verme (Otomatik ve Manuel Hedefleme)

Amazon'da Ürün Reklamı Verme ve Doğru Hedefleme

Amazon'da satışını yaptığınız ürünlere reklam verirken bazı hususlara dikkat etmek çok önemlidir. Özellikle hedeflemenin doğru yapılması satış getirecektir. Bu anlamda reklam verme sürecini paylaşmak istedim.

Özet:

Burada örnek olarak kurşun kalem ürünü için otomatik ve manuel hedefleme olmak üzere 2 adet kampanya oluşturacağız. Manuel hedefleme kampanyası içerisinde de Manuel - anahtar kelime hedefleme ve Manuel - ürün hedefleme olmak üzere 2 adet reklam grubu oluşturacağız. Otomatik olan bize anahtar kelimeler anlamında veriler sağlayacak, yani hangi anahtar kelimelerden daha çok dönüş oluyor bunu anlamış olacağız, hatta satış gelen anahtar kelimeleri daha ön plana alacağız. Manuel hedeflemeler ise otomatik hedeflemeden aldığımız veriler ile daha nokta atışı reklamlar vermemizi sağlayacak. 

A) Otomatik hedeflemeli reklam oluştur:

  1. Kampanya Yöneticisi > Kampanya Oluşturun > Sponsored Products seçin.
  2. Reklam grubu adını yazın. Örneğin "Otomatik Hedefleme"
  3. Reklam verilecek ürün veya ürünleri seçin. Bu ürünler aynı anahtar kelimeleri karşılayan benzer ürünler olmalı. Örneğin mavi kurşun kalem, yeşil kurşun kalem vb..
  4. Bu reklam grubu için "Otomatik hedefleme" seçin.
  5. "Dinamik teklifler - sadece aşağı" seçin.  Eğer 100 TL gibi düşük ücretli bur ürününüz varsa, tıklama başına verdiğiniz teklif tutarını satışa dönüşme ihtimali düştüğünde daha aşağı indirmek için "sadece aşağı" seçilmesi uygundur. Eğer 1000 TL gibi bir ürününüz varsa ve teklifinizin satışa dönüşme ihtimali arttığında arttırılması ve ihtimal azalınca düşürülmesi için "yukarı ve aşağı" seçeneği seçilebilir.
  6. Tıklama başına teklifinizi önerilen değerler içerisinde belirleyiniz. Eğer 100 TL gibi düşük ücretli bir ürüne reklam veriyorsanız tıklama başına teklifiniz 0,50 TL gibi olabilir. 1000 TL gibi bir ürününüz varsa 1 TL olabilir.
  7. (opsiyonel) Varsa negatif anahtar kelime ve ürünleri girebilirsiniz. Yani şu arama kelimeleri sonucunda veya şu ürün sayfasında reklamımı gösterme dediğiniz durumları belirleyebilirsiniz.
  8. Kampanya adını girin. Örneğin "Kurşun Kalem Otomatik - 05.05.2023". Başlangıç tarihi zaten bugünün tarihi olur, bitiş tarihi vermemenizi öneririm. Reklam uzun soluklu bir iştir ve marka bilinirliği için uzun süre devam etmesi daha uygundur.
  9. Günlük bütçeyi belirleyin. 100 TL gibi düşük ücretli bir ürüne reklam veriyorsanız günlük bütçe 10 TL olabilir, 1000 TL gibi bir ürüne reklam veriyorsanız günlük bütçe 50-100 TL arası olabilir.
Not: Yukarıda yazdığım teklif ve bütçe tutarlarını optimal seviyede belirlemeye çalıştım. Bu tutarları arttırmanız daha fazla reklam gösterimi anlamına gelecektir. Bu anlamda tutarları arttırmak iyi olur fakat yazdığım tutarlar da gayet yeterli olacaktır, sonuçta reklam gelirimizi verimli kullanmalıyız.

B) Manuel - Anahtar Kelime Hedeflemeli reklam oluştur:

  1. Kampanya Yöneticisi > Kampanya Oluşturun > Sponsored Products seçin.
  2. Reklam grubu adını yazın. Örneğin "Anahtar Kelime Hedefleme"
  3. Reklam verilecek ürün veya ürünleri seçin. Bu ürünler aynı anahtar kelimeleri karşılayan benzer ürünler olmalı. Örneğin mavi kurşun kalem, yeşil kurşun kalem vb..
  4. Bu reklam grubu için "Manuel hedefleme" ve alttaki kısımdan da "Anahtar kelime hedefleme" seçin.
  5. Anahtar kelime hedefleme > Önerilen sekmesinde önerilen kelimeler varsa bunları ekleyin. 
    • Bunlardan size ürününüzle ilgili olmadığını düşündükleriniz varsa (düşük ihtimal) bunları eklemeyebilirsiniz. Bu arada bir kelime için üç kullanım şekli vardır: Geniş, İfade, Tam. Bunlar kelimenin arama ifadesinde nasıl geçtiği ile alakalıdır. Yani Tam seçerseniz tam olarak bu kelimenin aranması ile reklam görünür, İfade seçerseniz arama yazdığınız ifadeyi içermelidir, Geniş ise kelimenizle alakalı diğer varyasyonlarda da reklamın görünmesini sağlar. Örneğin "spor ayakkabı" kelimesi için geniş seçerseniz "krampon" yazdığınızda da reklamınız görünür.
  6. Anahtar kelime hedefleme > Listeyi girin sekmesine geçin. 
    • Buraya otomatik hedeflemeden aldığımız tıklama getirecek kelimeleri alt alta (enter ile) giriniz. Yine geniş, ifade ve tam hallerinin üçünü de seçiniz.
    • Geniş, ifade ve tam her üçü için de "spor ayakkabılar" kelimesini yani yazdığınız kelimelerin çoğulunu yazmanıza gerek yok, sadece tekil hallerini yazın.
    • Otomatik hedeflemeden nasıl en çok tıklama ihtimali olan kelimelerin listesini alabileceğinizi aşağıda↓ ayrı bir başlıkta bulabilirsiniz.
    • Yine buraya 0,50 TL veya 1 TL gibi ürününüzün fiyatına göre mantıklı bir teklif yazınız.
    • Sonrasında listeyi ekleyin.
  7. "Dinamik teklifler - sadece aşağı" seçin.  Eğer 100 TL gibi düşük ücretli bur ürününüz varsa, tıklama başına verdiğiniz teklif tutarını satışa dönüşme ihtimali düştüğünde daha aşağı indirmek için "sadece aşağı" seçilmesi uygundur. Eğer 1000 TL gibi bir ürününüz varsa ve teklifinizin satışa dönüşme ihtimali arttığında arttırılması ve ihtimal azalınca düşürülmesi için "yukarı ve aşağı" seçeneği seçilebilir.
  8. (opsiyonel) Varsa negatif anahtar kelimeleri girebilirsiniz. Yani şu arama kelimeleri sonucunda reklamımı gösterme dediğiniz durumları belirleyebilirsiniz.
  9. Kampanya adını girin. Örneğin "Kurşun Kalem Manuel - 05.05.2023". Başlangıç tarihi zaten bugünün tarihi olur, bitiş tarihi vermemenizi öneririm. Reklam uzun soluklu bir iştir ve marka bilinirliği için uzun süre devam etmesi daha uygundur.
  10. Günlük bütçeyi belirleyin. 100 TL gibi düşük ücretli bir ürüne reklam veriyorsanız günlük bütçe 10 TL olabilir, 1000 TL gibi bir ürüne reklam veriyorsanız günlük bütçe 50-100 TL arası olabilir.

C) Manuel - Ürün Hedeflemeli reklam oluştur:

  1. Kampanya Yöneticisi anasayfasından yukarıda oluşturduğunuz manuel hedefleme kampanyasına tıklayın: "Kurşun Kalem Manuel - 05.05.2023"
  2. Reklam grubu adını yazın. Örneğin "Ürün Hedefleme"
  3. Reklam verilecek ürün veya ürünleri seçin. Bu ürünler aynı anahtar kelimeleri karşılayan benzer ürünler olmalı. Örneğin mavi kurşun kalem, yeşil kurşun kalem vb..
  4. Bu reklam grubu için "Manuel hedefleme" ve alttaki kısımdan da "Ürün hedefleme" seçin.
  5. Ürün hedefleme > Kategoriler sekmesinde önerilen kategoriler varsa bunları teklif tutarını yukarıdakine benzer şekilde belirleyerek ekleyin. Varsa reklamınızın görünmesini istediğiniz belirli bir kategoriyi ara diyerek ekleyebilirsiniz.
  6. Ürün hedefleme > Bağımsız Ürünler sekmesinde önerilen ürünler varsa bunları teklif tutarını yukarıdakine benzer şekilde belirleyerek ekleyin. Varsa reklamınızın görünmesini istediğiniz belirli bir ürünü ara diyerek ekleyebilirsiniz.
  7. (opsiyonel) Varsa negatif ürün ve markaları girebilirsiniz. Yani şu ürün veya marka sayfalarında reklamımı gösterme dediğiniz durumları belirleyebilirsiniz.
  8. "Dinamik teklifler - sadece aşağı" seçin.  Eğer 100 TL gibi düşük ücretli bur ürününüz varsa, tıklama başına verdiğiniz teklif tutarını satışa dönüşme ihtimali düştüğünde daha aşağı indirmek için "sadece aşağı" seçilmesi uygundur. Eğer 1000 TL gibi bir ürününüz varsa ve teklifinizin satışa dönüşme ihtimali arttığında arttırılması ve ihtimal azalınca düşürülmesi için "yukarı ve aşağı" seçeneği seçilebilir.
Buraya kadar yaptıysanız reklamınız artık iyi durumda demektir. Daha sonrasında otomatik hedefleme listesinde çok tıklama getiren anahtar kelimelerden veya ürünlerden eklemedikleriniz varsa onları yine manuel hedefleme içerisine dahil edebilirsiniz. Arada bir bu kontrolleri yapmanızda fayda vardır.

Otomatik hedefleme kampanyasından çok tıklama getiren anahtar kelime listesini alma:

  1. Kampanya Yöneticisinden sırayla oluşturduğunuz otomatik hedeflemeli kampanyaya ve içindeki reklam grubuna tıklayınız.
  2. Soldan Arama terimleri kısmına geliniz.
  3. Sütun başlıklarından Tıklamalar başlığına tıklayarak tablonun en çok tıklanan en üstte olacak şekilde sırılanmasını sağlayınız.
  4. Şimdi anahtar kelimeleri seçiniz. Bunu yaparken hepsini değilde belirli bir tıklamanın üstünde olan kelimelerden yukarısını seçin. Kopyalayın.
  5. Şimdi excel'i açıp içerisine yapıştırın. Böylece kopyalamamızdan kaynaklanan boş satırları elemiş oluruz. Tekrar bu kelimeleri excel'den seçip kopyalayın.
  6. Manuel kampanyanızdan > anahtar kelime hedefleme reklam grubunuza gelin. Sol menüden hedefleme kısmına geçin ve anahtar kelime ekle butonuna tıklayın.
  7. Artık bu kopyaladığınız kelimeleri listeyi girin sekmesine yapıştırabilirsiniz.

VS Code Klavuzu 2024

Visual Studio Code Sıfırdan Kurulum, Ayarlar ve Eklentiler

Php ile kodlama yapıyorsanız ve VS Code editörüne geçmek istiyorsanız bu yazının faydalı olacağını düşünüyorum. Ayrıca Python'a giriş yaptığım için Python ayarlarını ve gerekli eklentilerini de ekleyeceğim. Ayarları yaptığınızda Php + Python için uygun bir ortam hazırlamış olacaksınız. Uzun bir süredir Sublime Text editörünü kullanıyordum fakat github copilot gibi eklentilerin bu gibi editörlere geç gelmesi, VS Code'un daha çok kullanılması, python için yine VS Code'un tercih edilmesi gibi nedenlerle VS Code'a geçmeye karar verdim. Sonuçta hepsi bir araç, tercih size kalmış. Bu geçişte güncel bilgileri adım adım yazmaya çalışacağım. Hadi başlayalım...
---

İlk kurulum:

  • “Code/Preferences/Profiles/Create profile” ile profil adını yaz (ayhan vb) ve oluştur.
  • “Code/Preferences/Settings Sync is On” tıkla ve githup ile oturum aç. Böylece profilindeki tüm ayar, tema, vs.. senkronize olur.

Kullanıcı ayarlarını değiştirme (Vs Code standart ayarlarını bu dosya ile değiştirebilirsiniz):

  • Cmd+Shift+P ile komut paletini aç.
  • "Open User Settings (JSON)" yaz ve tıkla.
  • Açılan settings.json dosyasına ayar komutunu yaz ve kaydet.

PHP için ilk yapılacaklar (önce yukarıdaki ilk kurulum işlemlerini yapın!):

  • Extensions menüsünü sol panelden aç.
  • “PHP Intelephense by Ben Mewburn” kur. Aşağıdaki ayarları yap (eklenti sayfasında yazanlardır, güncelini eklenti sayfasından bakın).
    • Extensions arama kutusuna “@builtin php” yaz. “PHP Language Features” yerleşik php eklentisini Disable yap. Diğer “PHP Language Basics” syntax highlighting eklentisi Enable kalsın.
    • settings.json dosyasını aç ve aşağıdaki satırı ekle ve kaydet:
"files.associations": {
    "*.module": "php"
},
    • yine settings.json içine aşağıdaki satırı ekleyerek default php yazım önerilerini devre dışı bırakın:
"php.suggest.basic": false,
  • “PHP Debug by Xdebug” kur.

PYTHON için ilk yapılacaklar (önce yukarıdaki ilk kurulum işlemlerini yapın!):

  • “Python by Microsoft” kur.

Buraya kadar yaptıysanız artık çalışmaya hazırsınız demektir.

Diğer eklentiler (isteğe bağlı):

  • "SFTP" by Natizyskunk: web sitenizin dosyalarını local ve server tarafı olmak üzere senkronize etmek istiyorsanız bu eklentiyi tavsiye ederim. "ftp-sync by Lukasz Wronski" ve birkaç farklı ftp eklentisini denedim fakat htaccess dosyalarını senkronize edememek gibi farklı hatalar aldım. Bu nedenle SFTP eklentisini tercih ettim. Eklentiyi kurup ftp bilgilerinizi girdikten sonra klasörünüzdeki dosyalarda bir değişiklik yapıp kaydet dediğinizde otomatik olarak upload edilir. İsterseniz sol panelden dosyaya/klasöre sağ tık yapıp upload veya download yapabilirsiniz. Tüm klasörü download veya upload yapmak için komut paletini de kullanabilirsiniz (local to remote veya remote to local). 
    • Komut paletine "SFTP: config" yazıp tıklayın. İlk kez kullandığınız için bir ayar oluşturmamız gerekecek. sftp.json (klasörünüzdeki .vscode içine yerleşir) dosyası açılır. Bu dosyaya aşağıdaki ayarları girip kaydedin (bu ayarlarda ftp bilgilerinize göre gerekli değişiklikleri yapın. Ftp bilgileriniz yoksa cpanel > ftp hesapları kısmından ftp hesabı oluşturabilirsiniz):
{
    "name": "mywebsite.com",
    "host": "reseller.ni.net.tr",
    "protocol": "ftp",
    "port": 21,
    "username": "ftp@mywebsite.com",
    "password": "your_password",
    "remotePath": "/",
    "uploadOnSave": true,
    "ignore": [".vscode", ".git", ".DS_Store"],
    "useTempFile": false,
    "openSsh": false
}

  • JavaScript Productivity Pack - Emre MUTLU: Bu bir eklenti paketidir. Faydalı bulduğum eklentileri içerdiği için ben kurdum. Fakat içinden daha sonra "Code Spell Checker, Turkish Code Spell Checker, Error Lens" isimli üç eklentiyi kaldırdım (yanlış yazılmış kelimelerle ilgili bu eklentileri kodda karışıklık yaptığı için kaldırdım).
  • "Twig" by whatwedo: Php twig dosyalarının syntax highlighting eklentisidir. Twig dosyaları ile çalışıyorsanız faydalı olacaktır.
  • CodeMetrics: Bu eklentiyi kullandım fakat bence gerek yok. Javascript kodlarındaki karmaşıklığı ölçüyor. Örneğin bir fonksiyonunuz var bunun yanına bir renk ve sayı ile karmaşıklık notunu yazıyor. Görünüm olarak karışıklığa neden olduğunu düşündüğüm için kaldırdım.
  • Codeium: Kod ve yorum yazarken yapay zekadan öneri almak için bu eklentiyi kurabilirsiniz. Github Copilot gibi AI desteği sunan bir eklentidir. Copilot ücretli olduğu için Codeium eklentisini ücretsiz bir alternatif olarak tavsiye ediyorum. Üstelik Chat bölümü de sidebar'a ekleniyor ve buradan soru sorabiliyorsunuz. Eklentiyi kur + signup + mailden onayla + token gir sırasını izleyerek aktif edebilirsiniz.
  • "Selected Lines Count" by Ram Dayal Vaishnav: Normalde durum çubuğunda seçtiğiniz alanın satır sayısını göstermenin malesef bir seçeneği yok. Durum çubuğunda kaç karakter seçtiğiniz görünüyor fakat kaç satır seçtiğiniz görünmüyor. İşte bu eklenti durum çubuğunda kaç satır seçtiğinizin görünmesini sağlıyor.

 

Diğer ayarlar kısmını ikiye ayırıyorum:
1) settings.json dosyasına yazılacaklar
2) ayarlar arayüzünden yapılacaklar

1) Diğer ayarlar - settings.json dosyasına eklenir (isteğe bağlı):

Cmd+Shift+P ile komut paletini aç. "Open User Settings (JSON)" yaz ve aç. Açılan settings.json dosyasına aşağıdaki ayarlardan yapmak istediklerinizi ekleyin ve kaydedin.

  • workspace'i kaydetme işlemine onay vermek için.
"security.workspace.trust.untrustedFiles": "open",
  • exit veya close işleminde kaydedilmemiş dosyalar var uyarısını devre dışı bırakmak için (vs code tekrar açıldığında bu dosyalar son hali ile gelecektir).
"window.confirmBeforeClose": "never",
"files.hotExit": "onExitAndWindowClose"

2) Diğer ayarlar - ayarlar sayfasından yapılır (isteğe bağlı):

Cmd+Shift+P ile komut paletini aç. "Open User Settings" yaz ve tıkla (json olmayan seçeneği tıklayın). Bu genel kullanıcı ayarlarını açar. Bu sayfanın başında arama kutusu var oraya yapacağınız ayarı aratabilirsiniz.

  • line highlight özelliği default olarak açıktır ve bulunduğunuz satırı highlight yapar yani satır rengi değişir. Bu benim istemediğim bir durum çünkü o satırda bir kelimeyi seçili hale getirdiğimde satırı tamamen seçmişim gibi görünüyor, nereyi seçtiğim karışıyor. Bu özelliği kapatmak için: 
    • Ayarlar sayfanın başındaki arama kutusuna "Render" yazarak aratın.
    • "Editor: Render Line Highlight" seçeneğini bulup "none" olarak belirleyin.
  • Vs Code içinde tanımlı olmayan bir dosya türünü bilinen bir dosya türünün şablonu ile eşleştirebilirsiniz. Böylece vs code yeni dosyayı ilişkilendirdiğiniz dosya türünde açacaktır.  Örneğin Tpl dosyaları (önceden kullanılan twig benzeri bir şablon oluşturma dilidir) ile çalışıyorsanız ve bu tpl dosyalarının php renk şablonunda açılmasını istiyorsanız:
    • Ayarlar sayfasının solundaki menüden Text Editor altındaki Files başlığına tıklayın.
    • Associations kısmına gelin ve Add Item butonuna tıklayın. Birinci kutuya *.tpl ikinci kutuya da php yazın. Ok tıkladığınızda artık tpl dosyaları php dosyası gibi açılacaktır. 
  • Tabların arasındaki boşlukların azaltılarak daha sıkışık görünmesi için Workbench › Editor: Tab Sizing değerini "shrink" olarak belirleyin. Ben bir süre "shrink" ayarıyla kullandım fakat sonra default olan "fit" değerine geri döndüm. Çünkü çok fazla tab açınca tablar iyice küçülüyordu. Dolayısı ile çok fazla tab kullanacaksanız "fit" ayarı daha mantıklı olacaktır.
  • Örneğin bir css dosyasında height kelimesinin üzerine tıklayınca tüm height kelimelerini highlight yapar. Bu bence gereksiz çünkü bunu istiyorsanız o kelimeye çift tıklamanız yeterli, kendiliğinden yapmasına gerek yok ki bu da editörü yavaşlatır bence. Bunu kapatmak isterseniz "Editor: Occurrences Highlight" seçeneğindeki işareti kaldırın.
  • "workbench.editor.untitled.labelFormat" ayarını "name" olarak belirledim. Varsayılan olarak content olarak gelir ve yeni bir sayfa açtığınızda tab başlığında yazdığınız kodun ilk birkaç kelimesi görünür. Bu tab mesafesini arttırdığı için ve karışık görünmesine neden olduğu için bana gereksiz geldi. Yine de kara sizin.
  • "editor.tabSize": 4 olarak belirleyebilirsiniz. Böylece tab boşlukları 4 karakter olarak ayarlanır. Default değeri 1'dir.
  • "editor.lightbulb.enabled" ayarını kaldırdım. Çünkü bu ayar aktif olunca özellikle js dosyalarında satırların başında bir ampül ikonu çıkıyor. Ampüle tıklayınca o satırla ilgili yapılabilecek düzeltmeleri ve sonuçlarını gösteriyor. Yine çok gerekli görmediğim ve karmaşıklığa sebep olduğu için bu ayarı kaldırdım. 
  • "workbench.editor.pinnedTabsOnSeparateRow" seçeneğini işaretli hale getirirseniz pin'lediğiniz tablar bir üst sırada sabitlenir.
  • "editor.colorDecorators" seçeneğinin işaretini kaldırdım. Böylece css gibi yerlerde bir renk kodu yazdığınızda yanında kare kutucuk çıkmıyor, fakat renk kodunun metnini o renkte göstermeye devam ediyor. Bu seçenek aktif olursa kutu çıkar ve siz o kutuya tıklayıp paletten renk seçebilirsiniz. Fakat kod yazarken bu kutu karışıklığa yol açıyor bence ve zaten bu renk seçme işini tarayıcının developer araçlarından yapıyorum genellikle. Bu kutuya gerek olmadığını düşünüyorum.
  • "workbench.editor.highlightModifiedTabs" ayarını işaretli yaparak değişiklik yapılan tabın highligth yapılmasını böylece diğer tablardan daha rahat ayrışmasını sağlayabilirsiniz.
  • "workbench.editor.tabCloseButton" off yaparak tabların yanında görünen Close butonunu kaldırabilirsiniz. Böylece tabın genişliği biraz daha küçülecektir. Ayrıca tab'a tıklarken yanlışlıkla x butonuna basma durumuna çözüm olacaktır.
  • "problems.decorations.enabled": seçeneğini kapatarak dosyalardaki uyarıları (kodlama hatası vb) göstermeyi kapatabilirsiniz. Çünkü burada uyarı verdiği durumlar her zaman bir hata olmayabiliyor, örneğin css'de boş sınıf olunca bir uyarı veriyor. Yani bu uyarı verilen durumları bazen bilerek yapıyoruz ve bunların hataymış gibi görünmesini istemediğim için bu ayarı kapattım. Ayrıca bu ayar açık olunca hatalı dosyalar sidebar ve tab olarak renk değiştiriyordu ve bu görünüşte karışıklığa nadan oluyordu.
  • "editor.showUnused": false olarak belirleyin. Normalde tanımladığınız bir değişken herhangi bir yerde kullanılmayınca (unused) farklı renkte görünüyor. False yaparak bu özelliği kapatabilirsiniz.

Kullandığım renk ve ikon temaları:

Tema seçimi tamamen kişiye bağlıdır ve rahat ettiği bir renk düzeni olmalıdır. Çoğunlukla koyu temalar kullanılır. Ben de koyu temaları uzun süre kullandım ve halen de kullanıyorum fakat arada sıkıldıkça açık temalara da geçiş yapıyorum. Sublime Text editöründe daha fazla tema vardı, bu anlamda Vs Code daha az seçeneğe sahip gibi geldi. Tema renk düzeni olarak tavsiye edebileceğim hususlardan biri de mavi renkleri çok içermeyen bir tema seçin. Çünkü mavi ışık uzun süre bakılınca göze rahatsızlık veriyor. Ben bu anlamda mavi rengi azaltıp ekranı sarartan bir yazılım olan flux'u kullanıyorum bilgisayarda. 

Aşağıya kullandığım temaları "Renk Teması / İkon Teması" formatında ekliyorum.
  • Github Dark Default / Material Icon Theme
    • Material Icon Theme için şu ayarları normal ayarlar arayüzünden yaptım: activeIconPack: react seç, material-icon-theme.files.associations: "*.tpl": "php" satırını ekle, material-icon-theme.folders.color: #F8D775 olarak belirle, material-icon-theme.folders.theme: Classic seç.

Bazı Kısayollar:

  • Cmd + Shift + L: dosyadaki seçili ifadenin geçtiği her yere imleç ekler.
  • Alt + Shift + I: her satırın sonuna imleç ekler (önce tümünü seç).
  • Cmd+Shift+P: komut paletini açar.
  • Cmd+P: folder daki ve son açılan dosyalar arasında hızlı dosya açmayı sağlar.
  • Cmd+Shift+P / Open user settings (JSON): settings.json kullanıcı ayarlarını açar.
  • Kntrl + G: satıra git.
  • F8: sonraki hataya git
  • Bookmark add: Alt+Cmd+K
  • Bookmark next: Alt+Cmd+L
  • Alt + up/down arrow: satırı aşağı yukarı taşır.
  • Transform to Lowercase: Shift + Kntrl + Alt + L
  • Transform to Uppercase: Shift + Kntrl + Alt + U
  • Transform to Titlecase: Shift + Kntrl + Alt + T
  • Shift + Alt + F: Auto indent (otomatik girinti ayarlama)

Kendi Eklediğim Kısayollar:

File > Preferences > Keyboard Shortcuts açın ilgili komutları bulup kısayolları ekleyin:
  • Transform to Lowercase: Shift + Kntrl + Alt + L
  • Transform to Uppercase: Shift + Kntrl + Alt + U
  • Transform to Titlecase: Shift + Kntrl + Alt + T

Bonus:

https://learn.vscode.one/
VS Code'yi profesyonel olarak kullanmayı öğreten web sitesi.


Farklı öneriler oldukça buraya eklemeye devam edeceğim...
Son Güncelleme: 28/12/2023

PHP foreach Döngüsünde Son Değer Değilse Virgül Ekle

determine the last iteration in a php foreach loop?()

Php'de foreach döngüsü ile değerleri aralarına virgül işareti koyarak yan yana yazdırdığınızı düşünelim. Bu durumda en sonununcu değerden sonra virgül koyulmasın istersiniz. Bu durumda son kayıt olup olmadığını array_key_last ile kontrol ederiz (aynı şekilde ilk kayıt kontrolü yapmak isterseniz array_key_first kullanabilirsiniz).

foreach ($array as $key => $value) {
    echo $value;
    if ($key !== array_key_last($array)) echo ", ";
}