Mucho. Panduan Bisnis Online dan Blogging Pemula dari A sampai Z

4 Cara Membuat Halaman Testimoni di Blog Termudah

4 Cara Membuat Halaman Testimoni di Blog Termudah
Sumber gambar: boast.io

Hm, kamu mungkin bertanya-tanya bagaimana sih cara membuat halaman testimoni di blog menggunakan blogspot untuk produk kosmetik atau bisnis masker organik yang sudah kamu jual? Tidak perlu khawatir, kamu hanya harus memperhatikan beberapa cara di bawah ini. 

Memang, untuk melakukan cara ini setidaknya harus memiliki sedikit keterampilan coding yang untuk bisa menulis testimonial di blog. 

Hah? Coding? Apaan tuh?

Ini juga yang mungkin menjadi pertanyaan untuk kamu yang baru saja mengenal istilah tersebut. Jangan khawatir! Kamu bisa mendapatkan kode khusus untuk halaman testimonial dan sudah banyak orang yang melakukannya dan bersifat open source bagi mereka yang ingin memodifikasinya.

Terlebih, kode testimonial ini bisa kamu gunakan untuk memaksimalkan bisnis online kosmetik yang kamu sedang jalankan. Menarik, bukan?. 

Apa Sih Testimoni Itu?

Sebelum memulai ke tahapan yang lebih jauh, kamu sudah paham belum pengertian dari testimoni itu sendiri? 

Yup, testimonial atau yang biasa orang sebut dengan testimoni adalah sebuah bukti atau kesaksian tentang kepuasan terhadap suatu produk atau barang dan jasa yang diberikan oleh konsumen atau pembeli. 

Dari adanya testimoni ini bisa memberikan nilai lebih tentang pengalaman orang-orang memakai sebuah produk atau jasa. Sebagai contoh misalnya kamu memproduksi kosmetik langsung dari Maklon Kosmetik yang kemudian produknya kamu jual kepada pembeli. 

Nah, para pembeli merasa puas karena mendapatkan kualitas yang sesuai dengan klaim produk yang kamu berikan. Mereka akhirnya memberikan ulasan positif, baik itu berupa chat atau ulasan langsung melalui komentar di blog kamu. Itulah yang dikatakan sebagai testimoni, pengalaman memakai produk atau jasa tertentu. 

Manfaat Testimoni Bagi Penjual

Yup, seperti yang sudah disebutkan diatas, testimoni memiliki manfaat yang sangat penting untuk menambah nilai kepercayaan terhadap calon  pembeli baru. 

Namun selain itu, karena bukti ini merupakan ulasan jujur, penjual pun bisa melakukan evaluasi jika ada pembeli yang memberikan testimoni kurang puas. Jadi tidak semata-mata hanya membutuhkan testimoni positif, yang kurang baik pun bisa kamu jadikan sebagai bahan improvisasi. 

Nah, masuk ke bagian inti dari pembahasan artikel ini. Perhatikan beberapa caranya, terlebih di bagian coding agar tidak terjadi kesalahan. 

1. Masukan Kode HTML dan CSS

Yang pertama sekali, kamu bisa salin atau copy kode HTML dan CSS dan juga JavaScript di bawah ini. 

<div id=”responsive-container”>

<div class=”testimonial”>

<div id=”slideshow1″>

<img src=”ALAMAT_URL_FOTO_PROFIL_1″/>

<p>KATA_TESTIMONI_1</p>

<div>NAMA PELANGGAN 1</div>

<h3>JABATAN PELANGGAN 1</h3>

</div>

<div id=”slideshow2″ style=”display: none”>

<img src=”ALAMAT_URL_FOTO_PROFIL_2″/>

<p>KATA_TESTIMONI_2</p>

<div>NAMA PELANGGAN 2</div>

<h3>JABATAN PELANGGAN 2</h3>

</div>

<div id=”slideshow3″ style=”display: none”>

<img src=”ALAMAT_URL_FOTO_PROFIL_3″/>

<p>KATA_TESTIMONI_3</p>

<div>NAMA PELANGGAN 3</div>

<h3>JABATAN PELANGGAN 3</h3>

</div>

<div id=”slideshow4″ style=”display: none”>

<img src=”ALAMAT_URL_FOTO_PROFIL_4″/>

<p>KATA_TESTIMONI_4</p>

<div>NAMA PELANGGAN 4</div>

<h3>JABATAN PELANGGAN 4</h3>

</div>

</div>

</div>

<style>

#responsive-container{width:100%;margin:auto}.testimonial{height:500px;width:100%;padding:1em;margin:1em auto}

.testimonial div{text-align:center;vertical-align:middle;color:#42b549;font-size:1.5em;margin-bottom:20px;}

.testimonial h2{font-size:30px;font-weight:300;margin:25px 0 48px 0;width:100%;text-align:center}

.testimonial img{margin:0 1em 0 1em;border-radius:50%;width:150px;height:150px}

.testimonial p{text-align:center;vertical-align:middle;color:#555;font-size:18px}

.testimonial h3{font-size:15px;text-align:center}

#slideshow1, #slideshow2, #slideshow3, #slideshow4{background:transparent}

</style>

<script type=”text/javaScript”>

function startSlides(start, end, delay) {

        setTimeout(slideshow(start,start,end, delay), delay);

    }

    function slideshow(frame, start, end, delay) {

        return (function() {

        $(‘#slideshow’ + frame).fadeOut();

        if (frame == end) { frame = start; } else { frame += 1; }

        setTimeout(function(){$(‘#slideshow’ + frame ).fadeIn();}, 850);

        setTimeout(slideshow(frame, start, end, delay), delay + 850);

    })

    }

    // usage: startSlides(first frame, end frame, delay time);

    startSlides(1, 4, 5000);

</script>

2. Buka Blogger

Selanjutnya masuk ke halaman Blogger menggunakan akun Google kamu yang sudah dibuat. Lalu klik Halaman dan pilih Halaman Baru. 

Setelah melakukan langkah tersebut, ubah mode di pengaturan menjadi HTML. 

3. Paste Kode Coding

Apabila sudah mengubah mode menjadi HTML, langkah selanjutnya adalah paste atau tempel kode coding yang sudah kamu salin tadi. Edit beberapa kode yang bertanda merah di atas sesuai dengan data yang kamu inginkan. 

4. Publish

Nah, langkah yang terakhir jika semuanya sudah selesai kamu lakukan, klik Publish. Supaya halaman testimonial yang sudah kamu buat bisa dilihat orang lain, salin alamat URL lalu masukkan di menu navigasi blog kamu. Jadi seperti itulah cara membuat halaman testimoni di blog yang bisa kamu lakukan dengan mudah. Hanya tinggal salin kode, dan boom! Halaman testimonial ada di blog kamu.

Total
0
Shares
Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Related Posts