Ana içeriğe atla

Bu Blogda Ara

Turgut Arslan

Google Ads & Analytics | SEO | HTML | CSS | JS ve E-Ticaret

Kayıtlar

Nisan 6, 2026 tarihine ait yayınlar gösteriliyor

Tümünü göster

Zihinsel Odaklanma Egzersizi

Bağlantıyı al
Facebook
X
Pinterest
E-posta
Diğer Uygulamalar

Akışa Odaklan ve Rahatla

Yazıyı Oku »

Diğer yayınlar

En Çok Okunanlar

JQuery Toggle Açılır Kapanır Menü

Temmuz 03, 2017

Menünün Çalışır Hali Aslına bakarsanız önceden bu şekilde bir planlama yapmamıştım ama menü responsive olmuş :) See the Pen Jquery Toggle Menü by Turgut Arslan ( @draguth ) on CodePen . Menü Kodları Aşağıdaki Gibidir <!DOCTYPE html> <html> <style> div.menuKutu { float: left; width: 200px; display: block; height: auto; background-color: #269470; cursor: pointer; font-size: 14px; font-family: Arial; text-align: center; color: white; padding: 5px; font-weight: bold; line-height: 18px } div.menuKutu p { height: 50px; line-height: 50px; display: none; background-color: #45b0a3; padding: 0px; margin: 0px; } div...

Yazıyı Oku »

Javascript Kopyalama Kodu

Eylül 10, 2018

Web sitelerinde kullanıcı deneyimini artırmak için sıkça kullanılan işlevlerden biri de, bir metni panoya kopyalamaktır. "Copy to clipboard" yani "Panoya Kopyala" işlemi sayesinde, kullanıcılar bir metni kolayca kopyalayabilir ve diledikleri yere yapıştırabilirler. Aşağıda, sayfa içerisindeki belirli bir HTML elemanının (örneğin bir paragraf ya da açıklama bloğu) içeriğini panoya kopyalamayı sağlayan bir örnek bulacaksınız. Ayrıca örnekte, kopyalanan metnin bir metin kutusuna yapıştırılarak test edilmesi de mümkündür. ✅ Kopyalama İşlevi Nasıl Çalışır? Aşağıdaki modern JavaScript fonksiyonu, navigator.clipboard API'sini kullanır. Bu yöntem, eski document.execCommand("copy") metoduna kıyasla daha güvenli ve günceldir: <script> function copyContent() { const content = document.getElementById("kopya").innerText; navigator.clipboard.writeText(content) .then(() => { alert("İçerik başarıyla panoya kopyalandı!"); ...

Yazıyı Oku »

ROAS Nedir? ROAS Nasıl Hesaplanır?

Şubat 23, 2017

ROAS(Return On Advertising Spend-Reklam Harcaması Başına Düşen Gelir) özellikle dijital pazarlama sektöründe sıkça tekrarlanan bir sözcük. Adından da anlaşılacağı üzere bir reklam kampanyası için harcadığınız para ile o kampanyadan elde ettiğiniz bürüt gelir miktarı arasındaki ilişkiyi kurmak için kullanılır. Burada bürüt gelir kampanyanın elde ettiği ciro oluyor. Eğer dijital pazarlama ile uğraşıyorsanız hazırladığınız kampanyalar için birden çok satış kanalı kullanmak istersiniz. Bu kanallara zaman ya da zaman+para yatırımı yaparsınız. Bu sizin ürün tanıtımı için yaptığınız yatırım olarak isimlendirilir. Kampanya kanallarını seçtiniz. Yatırımınızı yaptınız. Acaba kampanyam başarılı oldu mu? Şimdiden sorunun cevabını ROAS hesabı ile öğrenemezsiniz diyebilirim. Çünkü ROAS kampanya başarısını değil kampanya için kullandığını kanala yaptığınız yatırımın getirisini yüzdelik bir oran şeklinde gösterir. Orana bakarak sadece kanaldaki reklam performansını değerlendirebilir...

Yazıyı Oku »

Javascript İle Kelimelerin ilk Harfini Büyük Yapmak

Hazırladığım yazıların başlıklarını büyük harfle yapmaya üşendiğim için, biraz zahmet edip basit bir Javascript programı yazdım. Tembellik insana her şeyi yaptırıyor. Ha bu arada; resimdeki acayiplik bazılarını rahatsız edebilir :) Online Büyük Harf - Küçük Harf Çevirme Aracı İlk harflerini büyük yapmak istediğiniz metni girin ve uygula butonuna basın Uygula Saygılarımla... Turgut Arslan

Yazıyı Oku »

CSS ile Overlay Yapmak

Şubat 22, 2018

Resim Başlığı Resim Yazısı. <!DOCTYPE html> <html> <head> <title>CSS Overlay Efekti</title> <style> .kapsayici{ width:800px; height:476px; overflow:hidden; text-align:center; position:relative; } .perde{ position:absolute; top:100%;left:0;right:0;bottom:0; background:rgba(237,71,74,0.5); color:#fff; z-index:1; padding-top:45%; transition:top 0.5s; } .kapsayici:hover .perde{ top:0; } </style> </head> <body> <div class="kapsayici"> <img src="/kirmizi-mercedes.jpg" /> <div class="perde"> <h3>Resim Başlığı</h3> <p>Resim Yazısı.</p> </div> </div> </body> </html> CSS overlay efetki ve diğer pratik bilgiler için Arin Yazılımın videolarını izleyebilirsiniz https://www.youtube.c...

Yazıyı Oku »

JavaScript ile Mesai Sayacı

Bu çalışmamda JavaScript ile bir geri sayım sayacı yaptım. Input elemanına bitiş zamanını yazıp butona tıkladığınızda belirlediğiniz saate kaç saat kaldığını görebilirisiniz. Bu uygulamada input elemanına yapılan girişleri sınırlandırdım. Program klavyeden girilen değerin sayısal olup olmadığını kontrol ediyor ve girilen değerleri saat formatına göre HH:MM:SS şeklinde düzenliyor. Javascript mesai sayacının kodları aşağıdaki gibidir. Lütfen mesai bitiş saatini girin Kodları yazarken https://www.w3schools.com/howto/howto_js_countdown.asp linkindeki sayfadan yararlandım Kodun çalışan örneğini buraya ekliyorum. Dilerseniz günün bir saatini girip kalan sürenin geriye doğru sayılmasını deneyimleyebilirsiniz. Lütfen mesai bitiş saatini girin

Yazıyı Oku »

Javascript Büyüteç Uygulaması

Saf Javascript ve CSS kullanarak basit bir büyüteç programı yazdım. Javascript Büyüteç Kodları: HTML Kodu; <div id="resimKabi"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzzIU2K83cIbm0r_wB8lrZ5m3iSKchB-WolIEDvxFCz3BuYLB-g2_keCJ6QxbpfXBJ9tYjOQtWTn3sEub5tOycXxKFx_gK99s3jsUZckLWCyFEA_lab-T0A5voDQcXy0fLxjJopxevCa4/s1600/lotr-ring.jpg" /> <div id="buyutec"></div> </div> CSS Kodu; #resimKabi { width: 100%; height: auto; display: block; position: relative; overflow: hidden; } #resimKabi img { display: block; width: 100%; height: auto; } #buyutec { width: 100px; height: 100px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzzIU2K83cIbm0r_wB8lrZ5m3iSKchB-WolIEDvxFCz3BuYLB-g2_keCJ6QxbpfXBJ9tYjOQtWTn3sEub5tOycXxKFx_gK99s3jsUZckLWCyFEA_lab-T0A5voDQcXy0fLxjJopxevCa4/s1600/lotr-ring.jpg); ...

Yazıyı Oku »

Anahtar Kelime Rehberi : Turizm Sektörü

Ağustos 12, 2019

Turizm sektöründe SEO ve Dijital Pazarlama çalışmalarında faydalı olacağına inandığım bazı uzun kuyruklu anahtar kelimeler ve bu kelimelerin ortalama aylık aranma hacimlerini bir liste haline getirdim. Evet haklısınız, turizm ve tatil ile ilgili tüm kelimeler bunlar değil. Zaman zaman bu yazıyı güncelleyerek listeyi dahada da genişleteceğim. Listeye geçmeden önce şunları belirtmek istiyorum . SEO için içerik mi üreteceksiniz ? Bu sadece listede tatil ve turizm sektörüne hangi kelime ne kadar aranmış? Onu görebilirsiniz. Bazı kelimelerin aranma sayıları çok yüksek bazılarınınkisi ise düşüktür. Aranma hacminin düşük olması o anahtar kelimelenin kullanışsız olduğu anlamına gelmez. Size nacizane tavsiyem düşük aranma hacimli kelimelerin daha yüksek aranma hacimli varyasyonlarını türetmeniz ve düşük aranma hacimli kelimelerle birlikte ürettiğiniz içeriğe uygun bir şekilde yerleştirmeniz yönünde olacaktır. Reklam çalışması mı yapacaksınız ? Google Ads(AdWords) vb arama mecraların...

Yazıyı Oku »

Luhn Algoritmasıyla Kredi Kartı Validasyon Kontrolü

Luhn Algoritması: Kredi Kartı Numarası Doğruluğunu Test Etme Yöntemi Kredi kartı numaralarının doğruluğunu kontrol etmek için kullanılan Luhn algoritması, 1954 yılında IBM'de çalışan Hans Peter Luhn tarafından geliştirilmiştir. Bu algoritma, basit matematiksel işlemlerle bir numaranın geçerli olup olmadığını belirler.

Yazıyı Oku »

Javascript ile veriyi bir alt satıra nasıl yazdırabiliriz?

Aralık 29, 2019

Javascript ile veriyi bir alt satıra nasıl yazdırabiliriz? HTML dilinde bir alt satıra geçmek için ya da şeklinde yazılan etiketi kullanırız. Javascirpt ile bir yere sonuç yazdırırken de yazdırdacağımız çıktı içine bu tag'i ekleyerek çıktı verilerimizi bir alt satıra yazdırabiliriz. Örnek senaryomuzda biri mavi diğeri yeşil iki adet div bulunmakta. Mavi kutudaki "İçerik Metni" yazısını yeşil kutudaki "İşlemin Sonucu" metninin altına yazdırmak istiyoruz. Bunun için yazdir isminde bir fonksiyon oluşturuyoruz. Bu fonksiyon butona basıldığında çalışacak ve mavi kutudaki metni alıp yeşil kutudakinin altına ekleyecek. Önce veri isminde bir değişken tanımlayalım ve içine mavi kutudaki içeriği aktaralım. var veri=document.getElementById("maviKutu").innerHTML; Sonra yeşil kutuyu yakalayalım ve veri değişkenindeki değeleri bukutunun içine yazdıralım. document.getElementById("yesilKutu").innerHTML+=""+veri; Gördüğünüz gibi sadece ...

Yazıyı Oku »

Blogger tarafından desteklenmektedir

2025 Bir Hak İddia Etmiyorum

Translate

Yazı Listesi

2026 2
- Nisan 2026 1
  - Nis 06 1
    
    Zihinsel Odaklanma Egzersizi
- Şubat 2026 1
  - Şub 11 1

2025 3
2024 11
- Ekim 2024 1
  - Eki 21 1
- Mart 2024 2
  - Mar 20 1
  - Mar 13 1
- Şubat 2024 6
  - Şub 29 1
  - Şub 19 1
  - Şub 16 1
  - Şub 13 1
  - Şub 07 1
  - Şub 06 1
- Ocak 2024 2
  - Oca 17 1
  - Oca 04 1
2023 7
- Aralık 2023 1
  - Ara 13 1
- Kasım 2023 1
  - Kas 08 1
- Mayıs 2023 1
  - May 25 1
- Mart 2023 1
  - Mar 29 1
- Şubat 2023 3
2022 5
2021 12
- Kasım 2021 1
  - Kas 30 1
- Ekim 2021 1
  - Eki 28 1
- Temmuz 2021 1
  - Tem 28 1
- Haziran 2021 2
  - Haz 24 1
  - Haz 03 1
- Mayıs 2021 1
  - May 27 1
- Mart 2021 1
  - Mar 27 1
- Şubat 2021 5
  - Şub 23 1
  - Şub 19 1
  - Şub 18 1
  - Şub 17 1
  - Şub 09 1
2020 14
- Kasım 2020 1
  - Kas 17 1
- Ekim 2020 1
  - Eki 29 1
- Eylül 2020 3
- Temmuz 2020 5
  - Tem 30 1
  - Tem 29 2
  - Tem 21 1
  - Tem 09 1
- Şubat 2020 3
  - Şub 16 2
  - Şub 03 1
- Ocak 2020 1
  - Oca 24 1
2019 6
2018 13
- Aralık 2018 2
  - Ara 13 1
  - Ara 10 1
- Kasım 2018 2
  - Kas 29 1
  - Kas 09 1
- Ekim 2018 3
- Eylül 2018 2
  - Eyl 26 1
  - Eyl 10 1
- Temmuz 2018 1
  - Tem 22 1
- Mayıs 2018 1
  - May 14 1
- Mart 2018 1
  - Mar 16 1
- Şubat 2018 1
  - Şub 22 1
2017 9
- Eylül 2017 1
  - Eyl 27 1
- Temmuz 2017 1
  - Tem 03 1
- Haziran 2017 1
  - Haz 22 1
- Nisan 2017 2
  - Nis 10 1
  - Nis 05 1
- Şubat 2017 4
  - Şub 23 1
  - Şub 11 3

Daha fazla göster Daha az göster

Trend Yazılar(30 Gün)

Beyin Sisini(Brain Fog) Gidermek için Online İçin Egzersiz

Şubat 11, 2026

🧠 Zihin Berraklaştırıcı Derin Nefes Göz Takibi Refleks Odak Başla Daire büyürken burnundan derin nefes al, sabitken tut, küçülürken ağzından yavaşça ver. Başlat / Durdur Başını sabit tut, sadece gözlerinle topu takip et. Bu hareket sinir sistemini yatıştırır. Yatay Döngüsel Durdur Kırmızı yanan kareye mümkün olduğunca hızlı tıkla. Dikkati şimdiki ana getirir. Skor: 0 Oyunu Başlat

Yazıyı Oku »

JavaScript ile Mesai Sayacı

Bu çalışmamda JavaScript ile bir geri sayım sayacı yaptım. Input elemanına bitiş zamanını yazıp butona tıkladığınızda belirlediğiniz saate kaç saat kaldığını görebilirisiniz. Bu uygulamada input elemanına yapılan girişleri sınırlandırdım. Program klavyeden girilen değerin sayısal olup olmadığını kontrol ediyor ve girilen değerleri saat formatına göre HH:MM:SS şeklinde düzenliyor. Javascript mesai sayacının kodları aşağıdaki gibidir. Lütfen mesai bitiş saatini girin Kodları yazarken https://www.w3schools.com/howto/howto_js_countdown.asp linkindeki sayfadan yararlandım Kodun çalışan örneğini buraya ekliyorum. Dilerseniz günün bir saatini girip kalan sürenin geriye doğru sayılmasını deneyimleyebilirsiniz. Lütfen mesai bitiş saatini girin

Yazıyı Oku »

Luhn Algoritmasıyla Kredi Kartı Validasyon Kontrolü

Luhn Algoritması: Kredi Kartı Numarası Doğruluğunu Test Etme Yöntemi Kredi kartı numaralarının doğruluğunu kontrol etmek için kullanılan Luhn algoritması, 1954 yılında IBM'de çalışan Hans Peter Luhn tarafından geliştirilmiştir. Bu algoritma, basit matematiksel işlemlerle bir numaranın geçerli olup olmadığını belirler.

Yazıyı Oku »

Basit JQuery Slider (Responsive)

JQuery ile basit bir slider çalışması yaptım. Bu çalışmamda birbiri üstüne absolute konumlu dizilen a ve img elemanları sırayla kullanıcılara gösteriliyor. Geçiş efekti olarak JQuery'nin fadeIn ve fadeOut fonksiyonlarını kullandım. Sayfanın yüklenme anında resimKut id'li div elemanının içindeki a elemanlarını saydırıyor ve sırasıyla fadeIn-fadeOut efektlerini elemanlara uygulatarak slaytlar arasında geçişi sağlıyorum. a ve img elemanlarına sahip oldukları CSS'ler yine sayfanın yüklenme anında JQuery'nin css() fonksiyonuyla veriliyor. Böylece sliderı düzenlerken stil kodlarıyla uğraşmak zorunda kalmıyorsunuz. Slider'ı responsive olacak şekilde kodladım . Slider görselleri içinde bulundukları elemanın genişliğine göre otomatik olarak boyutlandırılıyor. Yine çalışma anında slider'da bulunan a'ların yükseklik değerini alıyor ve bunu resimKut id'li elemana atıyorum. Bunu yapma sebebim resimKut elamanını position değerinin relative, içindeki a ...

Yazıyı Oku »

JS ve CSS ile HTML Elemanlarının Sıralamasını Nasıl Değiştiririz?

Şubat 09, 2021

HTML elemanlarının sıralarını değiştirebilmeniz için kapsayıcı elemanının display değerinin flex olması gerekmektedir. Sonrasında javascript ile verdiğiniz order değerine göre sıralanacaktır. Aşağıdaki kodlar butona basıldığında elemanların sırasının karışık olarak değişmesini sağlamaktadır. <style> .kapsayici { display: flex; display: -webkit-flex; flex-direction: column; max-width: 92px; height: auto; margin: 0px auto; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; align-content: stretch; } .eleman, .karistirButon { padding: 3%; border: solid 1px #f00; margin: 2px; max-width: 92px; text-align: center; } .karistirButon { background-color: red; color: #fff; margin: 0px ...

Yazıyı Oku »

Amazon Affiliate Link Oluşturucu

Aşağıdaki formu kullanarak Kendi Amazon Affiliate Linkinizi Oluşturun Amazon site adresini girin Affiliate kodunuzu girin

Yazıyı Oku »

Instagram Hesabına Bağlı Facebook Sayfası Nasıl Değiştirilir?

Kasım 30, 2021

Bildiğiniz gibi Facebook Business Manager üzerinden Facebook sayfasına bağlı profesyonel Instagaram hesabınızı yönetmek mümkün. Bu sistem sayesinde Facebook Business Manager hesabına erişimi olan ve izinleri tanımlanan her kullanıcı bağlı hesaplardaki Facebook Sayfalarına ve bu sayfaya bağlı Instagram hesaplarına erişebilir. Mesajları yanıtlayabilir, Reklamları yönetebilir ve paylaşım yapabilirler. Bu sistem profesyonel hesap yönetimi açısından büyük bir kolaylıktır. Özellikle sosyal medya üzerinden e-ticaret yapıyorsanız ve hesabınızın uzmanlar tarafından yönetilmesini istiyorsanız, bu sistem işlerinizi oldukça kolaylaştırmaktadır. Bazı durumlarda profesyonel Instagram hesabınızın bağlı olduğu Facebook Business Manager hesabını değiştirmek isteyebilirsiniz. Genelde çalıştığınız sosyal medya uzmanı ile yollarınızı ayırdığınız zaman eğer onun Business Manager heabına bağlı olarak çalışıyorsanız başka bir hesaba geçiş yapmak için bir dizi işlem yapmanız gerekir. Önce profesyonel Ins...

Yazıyı Oku »

Berat Kandilimiz Mübarek Olsun

Yazıyı Oku »

Mozilla Firefox Çoklu Pencere Kapatma Uyarısı

Kasım 09, 2018

Mozilla Firefox Çoklu Pencere Kapatma Uyarısı Nasıl Açılır? Firefox web gezginlerinin en çok tercih ettikleri, internet dünyasının popüler tarayıcılarından biridir. Kolay kullanımı, pek çok fonksiyonu desteklemesi ve sayısız eğlenceli eklentisi ile kullanıcılarına son derecede kaliteli ve hızlı bir hizmet sunmaktadır. Firefox'un kullanıcılarına sunduğu güzel özelliklerden biri girdiğiniz siteleri ayrı birer sekmede(Tab) görüntülemesi. Bu sayede her site için ayrı bir pencere açıp, pencereler arasında kaybolmaktan kurtuluyorsunuz. Ancak bu sekmeli gösterimin bir dezavantajı var. Sağ üstteki çarpı şeklindeki kapatma tuşuna bastığınızda tüm sekmelerin birden kapanması. Firefox bunu önlemek için, kapatma butonuna bastığınızda bir uyarı kutucuğu görüntülemektedir. Bu sayede tüm pencereleri birden kapatmadan önce son bir kez düşünme şansınız olur. şansınız oluyor. Eğer kullandığınız tarayıcıda "Kapatma Onayı" kutucuğu görüntülenemiyorsa, birden fazla s...

Yazıyı Oku »

JQuery Toggle Açılır Kapanır Menü

Temmuz 03, 2017

Menünün Çalışır Hali Aslına bakarsanız önceden bu şekilde bir planlama yapmamıştım ama menü responsive olmuş :) See the Pen Jquery Toggle Menü by Turgut Arslan ( @draguth ) on CodePen . Menü Kodları Aşağıdaki Gibidir <!DOCTYPE html> <html> <style> div.menuKutu { float: left; width: 200px; display: block; height: auto; background-color: #269470; cursor: pointer; font-size: 14px; font-family: Arial; text-align: center; color: white; padding: 5px; font-weight: bold; line-height: 18px } div.menuKutu p { height: 50px; line-height: 50px; display: none; background-color: #45b0a3; padding: 0px; margin: 0px; } div...

Yazıyı Oku »