Javascript SEO Metin İşaretleme Editörü

 SEO metni oluştururken işaretlemede kolaylık sağlamak amacıyla basit bir işaretleme editörü yaptım

SEO Metin İşaretleme Editörü

İstediğiniz işareti seçin

P

Em

Strong

H1

H2

H3

H4

H5

H6

İşaretlemek istediğiniz metni girin

Metnin işaretlemek istediğiniz yerlerini kutudan seçin ve yukarıdaki menüden etiket seçimini yapıp, İşaretle ve ekle butonuna basın.

İşlem sonucu aşağıdaki gibi görünecektir.

---

C# Field Nedir?

 C# programlama dilinde sınıfa ait değişkenlere, yani sınıf değişkenlerine field denir. Field'lar string, integer vb değişken tipinde olabilir. Field ya da sınıf değişkeni için olabilecek en basit CSharp örnek programı aşağıdaki gibidir.

using System;

namespace CSharpFiledNedir

{

  class Orneksinif 

  {

    string field1 = "Sınıf Değişkeni";  // field ya da sınıf değişkeni

    int field2 = 200;  // field ya da sınıf değişkeni

    static void Main(string[] args)

    {

      Orneksinif ornekNesne = new Orneksinif();

      Console.WriteLine(ornekNesne.field1);

      Console.WriteLine(ornekNesne.field2);

    }

  }

}

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

 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 Instagram hesabınızı kişisel hesaba çevirin. Ardından bu hesabı tekrar profesyonel hesaba çevirin ve paylaşmak istediğinizi yeni Facebook sayfasını seçin. Ardından bu sayfaya bağlı Business Manager hesabı üzerinden çalışmalara devam edebilirsiniz.

HTML Range Elemanından Nasıl Veri Alınır?

HTML Range elemanı kullanımı için basit bir örnek

HTML Range elemanı aslında input nesnesinin bir özelliğidir. input nesnesinin type özelliğini range olarak ayarkayarak onu bir aralık seçiciye çevirebilirsiniz. bu işlemi yaptıktan sonra input nesnesi bir range elemanı şeklinde sayfada görüntülenir. Kullanıcı mouse ile üzerine gelip çizgi üstünde ileri gerei kaydırarak belirlediğiniz aralıkta istediği değeri ayarllar. Size kalan tek şey range elemanından değerleri javascipt ile almak.

Range elemanında değerler nasıl alınır? Fare sürükledikçe değerlerin değiştirilmeri/güncellenmesi nasıl sağlanır?

Örnek kodlama aşağıdaki gibidir

<form>

  <label for="vol">0 ile 50 arası bir değer belirleyin:</label><br/><br/>

  0  <input type="range" id="vol" name="vol" min="0" max="50"> 50

</form>

Range elemanının değerini bu kutucuğa yazdıralım.<br/><br/>

<div style="height:30px;display:block;float:left;text-align:center;line-height:30px;margin-right:5px;" >Seçilen değer : </div><div id="gst" style="width:30px;height:30px;border:solid 1px #f000f0;display:inline-block;text-align:center;line-height:30px;"></div>

<script>

window.addEventListener("load",function(){

var elem = 0;

var elemHand;

elem = document.getElementsByName("vol")[0].value;

elemHand=document.getElementsByName("vol")[0];

elemHand.onmousedown=function(){

elem = document.getElementsByName("vol")[0].value; // mouseye tıklandığında değeri yaz

     document.getElementById("gst").innerHTML=elem;

  this.onmousemove=function(){ // fare hareket ettiğinde değeri değiştir.

  elem = document.getElementsByName("vol")[0].value;

  document.getElementById("gst").innerHTML=elem;

}

}

});

</script>

Kodun çalışan Hali

0 ile 50 arası bir değer belirleyin:

0 50

Range elemanının değerini bu kutucuğa yazdıralım.

Seçilen değer :

Bir Dizideki Tek Sayıları Bulan JavaScript Programı Örneği

Bir Array değişkenindeki tek sayıları bulup yazdıran  JavaScript programının kodları aşağıdaki gibidir.

Bu programda tekSayiFiltre isminde bir fonksiyon kullanarak sayı dizisinin elemanlarını filtreledim.

Tabi başka yöntemlerle de bu program yazılabilir. Yazılım dünyasında bir işi yapmanın pek çok yolu vardır. Bu kod sadece örneklerden biridir.

<div id="sayilar"></div>

<script>

  var sayilar = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 20]; // Filtrelenecek sayı dizisi

  var tekSayilar = []; // tek sayıların depolanacağı Array değişkeni

  var j = 0;

  function tekSayiFiltre(sayi) {

    return (sayi % 2 == 1); // eğer sayının 2'ye bölümünden kalan 1 ise true döndürür.

  }

  for (i = 0; i < sayilar.length; i++) {

    if (tekSayiFiltre(sayilar[i])) {

      tekSayilar[j] = sayilar[i];

      j++;

    }

  }

  document.getElementById("sayilar").innerText = tekSayilar;

</script>

Tatil terimini içeren 1000 adet anahtar kelime

 

Tatil, insanların yılın en çok beklediği dönemlerden biridir. Bu dönemde insanlar, iş ve okuldan uzaklaşarak dinlenmek, eğlenmek ve yeni yerler keşfetmek için fırsat bulurlar. Bu nedenle, tatil ile ilgili anahtar kelimeler, SEO ve Google Ads çalışmaları için oldukça değerlidir.

Tatil anahtar kelimeleri, geniş bir yelpazeye yayılmaktadır. Bu anahtar kelimeleri, hedef kitlenize ve bütçenize göre doğru bir şekilde kullanmak önemlidir.

::after Pseudo Class'i ile Bir Elemana Verilen float Özelliğini Kaldırmak

 Bu çalışmamızda :after pseudo classı ile clear both nasıl yapılır? Bulmaya çalışacağız.

Şu şekilde bir kodlama yaptığımızı hayal edelim.

<style>

    .flist{display:block;max-width:25%;height:auto;padding:3rem;margin:.3rem;background:red;float:left;}

    .kap{width:80%;height:auto;display:block;background:blue;}

    .kap::after{clear:both;content:"";display:table;clear:left;font-size:0;height:0;}    .kapIki{width:3rem;height:3rem;background:green;display:block;color:white;padding:2rem;margin:.5rem 0;}

</style>

<div class="kap">

    <div class="flist">1</div>

    <div class="flist">2</div>

    <div class="flist">3</div>

    <div class="flist">4</div>

</div>

<div class="kapIki">2. kap</div>

Görünümü bu şekilde olacaktır.

Clearfix ya da clear işlemi uygulanmadan önce

Görüldüğü gibi kırmızı kutulara float:left özelliği verildiğinden dolayı dolayı yeşil kutu olması gereken yerde değil. Ayrıca kapsayıcı olan mavi arka planlı kutuyu da göremiyoruz. Çünkü kırmızı kutularla aynı float değerinde değil. Normalde bu problemi çözmek için araya clear:both özellikli bir temizleme divi koyarız.  Ama bu şekilde kutucukların çok kullanıldığı bir tasarımda pek çok defa bu clear:div özellikli elemanı yazmamız gerekir. Sürekli kod tekrarı yapmamak ve gereksiz HTML kod kalabalığı yapmamak için :after pseudo classını kullanacağız. Aynı kodun Style kısmına kırmızı ile işaretli kod satırını ekleyelim.

<style>

    .flist{display:block;max-width:25%;height:auto;padding:3rem;margin:.3rem;background:red;float:left;}

    .kap{width:80%;height:auto;display:block;background:blue;}

    .kap::after{ content:""; display:table;clear:both; font-size:0;height:0;}

    .kapIki{width:3rem;height:3rem;background:green;display:block;color:white;padding:2rem;margin:.5rem 0;}

</style>

Eklendikten sonraki sonuç

Gördüğünüz gibi kırmızı kutucukların kapsayıcısına :after pseudo classı ile clear:both özelliğini ekledik. Classın oluşturduğu eleman tasarımda yer kaplamasın diye font-size:0; ve height:0; özelliklerini de ekledikten sonra mavi kutumuz kırmızı kutuları otomatik olarak kapladığı gibi, bir sonraki elemanın da tam olarak olmasını istediğimiz yerden devam etmesini sağladı. Bu çözüm Firefox 84.0.1 Microsoft Edge, Safari 14.1.1 ve Chrome 90.0.4430.212 sürümlerinde denendi ekran görüntüsü Chrome'dan alındı. Diğer tarayıcılarda denemedim. Kontrol etmeden kullanmayınız.