Mengubah Tag <br> Menjadi Tag <p> yang Membungkus Content


Taukah kamu bahwa pengunaan SEO sangat penting untuk menendang website kita untuk menjadi yang teratas di pencariaan google. Dalam kutip SEO yang sehat yang dianjurkan oleh google sendiri. dalam SEO ada banyak penerapaannya antara lain:
  • Content design.
  • Penerapan meta.
  • Memasang backlink.
  • Menambahkan Analytic.
  • Friendly Url.
  • Pengunaan HEADING.
  • Dan masih banyak lagi. 

Namun yang akan kita bahas kali ini tentang Apa sih content design..??
Jika dalam pemahaman saya content design itu adalah cara paling penting dalam penerapan SEO dalam Content design kita akan berlomba lomba untuk memberikan isi yang menarik, unik, dan mampu bermanfaan untuk si user.

Dengan begitu google akan menjadikan website kita yang teratas dari di mesin pencariaannya. jadi intinya google menyukai website yang banyak berguna untuk user. Tapi menulis content juga mempunyai aturan aturan yang cukup penting untuk di perhatikan. Yaitu penulisan di tag yang benar.

Seperti contoh nya jika kita ingin menulis judul hendaknya menggunaka tag H1 untuk subjudulnya menggunakn H2 dan seterusnya sampai H6 untuk subjudul yang dibawahnya.
dan untuk isi paragraf sewajarnya memggunakan Tag <p>. dalam pelulisan yang benar hal ini akan berperan penting untuk ber SEO.

Nah yang saya akan bahas kali ini adalah pengunaan tag dalam melulis content. karena saya menggunak blogger jadi mungkin ini bisa berguna untuk para penguna blogger lainnya.

Blogger memiliki tempat untuk menulis artikel, lalu tulisan tersebut akan diterjemahkan secara otomatis dan di tampilkan dilayout blog yang sudah disediakan.

Namun penerjemahan tersebut menurut saya kurang optimal. kenapa saya katakan kurang optimal? Karna menurut saya pada saat content kita ditampilkan bloger akan menerjemahan paragraf paragraf dengan tag <br> bukan dengan tag <p>, Lalu apakah itu salah..??

Jelas tidak, bukan berarti salah. Namun tergantung sipengguna blogger itu sendiri nyaman mengunakan tag apa. Jika ada yang berpikiran seperti saya yang menggunakan tag <p> tapi masih binggung bagaimana mana merubahnya. Saya perjelas kembali yaitu merubah ya bukan menambahkan tag <p> manual pada saat kita menulis karena hal itu mungkin akan merepotkan. jika kita memiliki lebih dari 100 paragraf.
Yang kita akan coba yaitu untuk mengubahnya otomatis. dengan bantuan javascript.

Pertama tama kita harus tahu bagaimana struktur content yang di terjemahkan oleh blogger.? Yang saya ketahui pertama blogger akan menempatkan tag <br> di setiap kita menambahkan baris baru atau jika tekan Enter pada saat kita menulis. Jika kita menekan enter 2 kali maka tag <br> juga ikut menambah.
Jadi sekarang kita paham bagaimana penempatan tag <br> tersebut.

Selanjutnya yang kita tau bahwa tag <p> adalah tag yang mengurung content sedangkan tag <br> adalah tag yang berada di depan atau di blakang konten saja.

Contoh untuk penulisan tag <br> dan tag <p>

Tag <br> :
<div id="post">
<h2>Judul Mengubah Tag</h2>
<br>
indocodex berbagi kode dan info secara gratis <br>
<br>
indocodex berbagi kode dan info secara gratis</div>

Tag <p> :
<div id="post"> 
<h2>Judul Mengubah Tag</h2>
<p>indocodex berbagi kode dan info secara gratis </p>
<p>indocodex berbagi kode dan info secara gratis </p>
</div>

Setelah kita paham benar stukturnya jika maka koding di bawah ini akan membantu anda

<script>
    var s = document.getElementById('post').innerHTML.replace(/<br\s*\/?>\n<br\s*\/?>/gi, '<br>');
    var i = -1;
    s = s.replace(/<br\s*[\/]?>/gi, function() {
        i++;
        if(i==0){
            return '<p>';
            }else{
            return '</p><p>'
        }
        
    }, 'gi');
    var p =  document.getElementById('post').innerHTML = s+'</p>';
    document.getElementById('post').innerHTML = p.replace(/<\p>\n<\/p>/gi, '');
</script>

Namun untuk pengguna brogger kode tag pada script tidak diperbolehkan kecuali mengunakan spesial karakter untuk HTML jadi begini kodingnya.

<script>
    var s = document.getElementById('post').innerHTML.replace(/&lt;br\s*\/?&gt;\n&lt;br\s*\/?&gt;/gi, '&lt;br&gt;');
    var i = -1;
    s = s.replace(/&lt;br\s*[\/]?&gt;/gi, function() {
        i++;
        if(i==0){
            return '&lt;p&gt;';
            }else{
            return '&lt;/p&gt;&lt;p&gt;'
        }
        
    }, 'gi');
    var p =  document.getElementById('post').innerHTML = s+'&lt;/p&gt;';
    document.getElementById('post').innerHTML = p.replace(/&lt;\p&gt;\n&lt;\/p&gt;/gi, '');
</script>

Koding Tersebut bisa kalian copy di atas kode <body>
Untuk DEMOnya bisa kalian Inspect Element dipost saya ini atau post post lainya.
Selamat Mencoba !!