MalesTea

Posts

Showing posts from November, 2020

Cara Membuat Permalink Copy To Clipboard di Blogger

Kurang kumplit jika blog yang kita pasang tidak menambahkan kode Copy To Clipboard untuk mempermudah pengunjung membagikan url blog kita tanpa perlu share ke sosmed dan cara ini saya gunakan untuk blog yang satu lagi, bukan yang ini. Permalink ini akan mengikuti sesuai Artikel yang sedang dibaca oleh pengunjung ke blog kita jadi akan otomatis berubah menyesuaikan permalink dari artikel masing-masing tanpa perlu membuat secara manual di blog. Cara Membuat Permalink Copy To Clipboard Pertama buka Blog > klik Tema > klik Edit HTML Langkah berikut tambahkan kode berikut tepat dibawah kode Share <div class='permalink'> <input expr:value='data:blog.url' id='copy-link' name='shortlink' readonly='' type='text'/> <span class='copy'> <svg id='copy' viewBox='0 0 488.3 488.3'> <g> <path d='M314.25,85.4h-227c-21.3,0-38.6,17.3-38.6,38.6v325.7c0,21.3,17.3,38.6,38.6,38.6h227c21.3,0,38

Cara Membuat Tombol Share Seperti Bungfrangki

Tombol share sudah pasti sering digunakan untuk membagikan artikel atau postingan yang menurut kita menarik dan dibagika ke orang orang yang ada di sosmed atau dunia maya selain itu juga tombol share ini sangat bermanfaat sekali bagi blog. Karena dengan adanya tombol share dapat membuat blog semakin banyak penunjung karena semakin banyak orang yang membagikan blog kita maka pengunjung akan semakin ramai juga. Jika sobat sudah pernah melihat sosial share di bungfrangki maka saya tidak perlu menjelaskan tampilan nya lagi karena sudah pasti sangat bagus banget sob tampilan nya. Bagi sobat yang ingin mencoba tombol share yang sama seperti bungfrangki sobat bisa pakai tombol share dengan kode yang ada dibawah ini. Cara Membuat Tombol Share 1. Buka Blogger > Klik Tema > Klik tombol Edit HTML > Kemudian tambahkan kode dibawah ini sebelum ]]></b:skin> atau </style> .icons, .icon {width: 24px;height: 24px;} #share_btnper{margin:25px auto 0;padding:0;display:block;} .shar

Cara Mudah Menambahkan Animasi CSS

Animate.css adalah animasi CSS yang siap pakai dan tidak perlu susah susah untuk membuat animasi CSS bagi sobat yang kurang paham dalam memainkan CSS karena dengan bantuan dari animate.css ini sobat dapat dengan mudah menambahkan animasi dengan sangat mudah. Beberapa animasi dari animate.css ini sangat lengkap menurut saya dari fadedin dan fadedout bahkan shakes juga ada. Untuk menggunakannya sangat mudah, sobat tinggal menambahkan class yang telah disediakan oleh animate.css dan element yang sobat beri classpun akan bergerak sesuai dengan tipe animasi yang dipilih. animate.css yang dibuat oleh Dan Eden ini menggabungkan beberapa fitur dari CSS3 seperti animation (keyframes), transformation, dan transition, semuanya dikemas dalam class-class siap pakai, jadi jika sobat ingin menambahkan animasi sederhana, tidak perlu repot lagi membuatnya secara manual, cukup sertakan file animate.css dan tambahkan class animasi yang diinginkan. animate.css dapat didownload di daneden.me/animate/

Cara Mengatasi Sticky Ads di Blog

Apakah anda menggunakan sticky ads diblog ? Udah lihat bagaimana tampilanya yang menghabiskan space kosong mau itu sticky top or bot ? Sebagian orang mencari cara agar tampilanya kembali normal agar tidak ada space kosong lagi... Sebetulnya cukup mudah untuk menghilangkan space kosong akibat sticky ads tersebut karena pada pengaturan ads mereka sudah ada padding dan margin default nya yang mana mengakibatkan space kosong itu tersebut. Ini adalah tampilan sebelum sticky ads diperbaiki dan sudah diperbaiki : Seperti yang bisa anda lihat dari gambar di atas ada perbedaan space dari gambar kiri dan kanan. menurut saya itu cukup menganggu sekali jika Anda menggunakan sticky ads seperti punya saya berada diatas. Untuk menghilangkan spacenya cukup mudah Anda hanya perlu mengikuti caranya dibawah ini. 1. Buka Blogger > Klik Edit HTML 2. Cari kode css bernama body 3. Kemudian tambahkan kode berikut margin: 0 !important; padding: 0 !important; 4. Terakhir simpan tema 5. Sek

Cara Memasang Script Redirect Uc Browser Ke Google Chrome

Cara ini sangat ampuh sekali bagi pengunjung yang suka melakukan block iklan sobat, yah tentu saja Uc Browser ini sangat handal sekali dalam melakukan adblock untuk iklan iklan yang tayang di Uc Browser dan akan diblock begitu saja tentu saja ini sangat memprihatinkan untuk para pendapatan blogger apalagi yang menggunakan Adsense pasti pendapatan akan menurun. Tapi tenang saja karena ada cara ampuh agar blog sobat dapat selamat dari Uc Browser dan dapat meningkatkan pengunjung dan juga pendapatan sobat dengan cara melakukan redirect atau dialihkan ke browser Google Chrome, jika terdeteksi membuka URL blog/web sobat dengan Uc Browser. Cara Memasang Script Redirect Uc Browser 1. Buka Blogger > Klik Tema > Klik tombol Edit HTML > kemudian tambahkan kode dibawah ini sebelum </head> <script type='text/javascript'> //<![CDATA[ var findmove1 = navigator.userAgent; var redirect = findmove1.search("UCBrowser"); if(redirect>1) { var queries1

Cara Membuat Animasi Air Bergelombang di Blog

Hai, lama tidak berjumpa lagi dengan kalian Blogger Indonesia. So pada kesempatan kali ini saya akan share Tutorial Membuat Animasi Air Bergelombang agar terlihat menarik pada tema-tema yang sedang kalian pakai. Kalau temanya gitu-gitu aja terus mah ngak bakal seru donk karena penampilan yang dibuat itu aja terus ikutin tutorial yang sudah ada dan dipakai lagi dan lagi jadinya kayak monoton gitu ngak ada IDE lain lagi apa ? Dengan adanya tutorial ini dapat membuat kalian untuk mendapatkan Ide desain yang bagus dan berbeda tentunya dengan yang lain. Tapi tergantung kitanya sih mau dibuat apa itu tampilan blog. Cara Membuat Animasi Air Bergelombang Pertama buka Blog > klik Tema > klik Edit HTML Kedua tambahkan kode berikut tepat dibawah kode </header> <section> <div class='air air1'></div> <div class='air air2'></div> <div class='air air3'></div> <div class='air air4'><

Merubah Title Blog Menjadi Mesra

Maksud dari judul artikel ini adalah untuk merubah bagian Title pada Tab Browser yang sobat pakai dan pada bagian Title yang terdapat pada tab tersebut akan merubah jika si pengunjung atau user pergi ke tab sebelah tentunya ini cukup menarik untuk membuat para pengunjung balik lagi donk karena ngak cuman Title nama situs gitu-gitu saja. Tapi tenang saja karena ini ringan kok ngak bakal beratin blog sobat malah ini cukup menarik buat saya tapi belum ditambah Marquue biar Title blognya berjalan. Bagi sobat yang tertarik bisa coba dibawah tutorialnya. Merubah Title Blog Menjadi Mesra Pertama buka Blog > klik Tata Letak > Tambahkan Gadget Widget > Pilih HTML/Javascript Kedua copy kode berikut dan paste <script> (function() { var OriginTitile = document.title, titleTime; document.addEventListener('visibilitychange', function() { if (document.hidden) { document.title = ' Aku ngak mau kita putus :( '; clearTimeout(titleTime); } else { document.title

Cara Membuat Tanda Centang (√) di Samping Judul Postingan Blog

Tanda centang ini lagi trend banget dikalangan blogger indonesia karena terlihat unik pada saat kita melihat judul postingan dari situs web atau blog yang anda pernah kunjungi sebelumnya dan sekarang banyak blog yang menggunakan Tanda Centang (√) di Samping Judul Postingan Blog biar terlihat keren gitu loh dan beda sama yang lain. Pada kesempatan kali ini saya akan membagikan tutorial tersebut tapi sebelumnya ini bukan disebut membuat melainkan menambahkan lebih tepatnya. Ada beberapa cara yang bisa kalian gunakan yaitu Unicode, Hex Code Html Code, Html Entity, langsung tanda centang (√). Cara Memasang Tanda Centang (√) di Samping Judul Postingan Blog Cara memasang tanda ceklis di samping judul postingam blog sangatlah mudah. Cukup memahami pengetahuan dasar pada edit HTML template blogger dan mengikuti tutorial ini dengan benar maka sobat akan berhasil membuat tanda centang di samping judul postingan blogger yang tampil pada hasil penelusuran. Pertama buka Blog > klik T

Cara Membuat Side Navigation di Blogger

Pada kesempatan kali ini saya akan membuat Side Navigation untuk mempercantik tampilan dari situs sobat dan banyak Request minta tutorial ini jadi saya buatkan sekarang. Tampilan yang akan saya berikan simple saja ngak terlalu bagus tapi bisa kalian kembangkan lagi untuk kedepan nya. Side navigation ini saya buat dengan bantuan javascript agar terlihat lebih bagus karena ada unsur interface nya tapi bisa juga sih pakai pure css tapi nanti banyak kode css yang harus dibuat beda dengan mengabungkan dari css dan javascript. Bagi kalian yang sudah penasaran bagaimana cara untuk membuat side/slide navigasi tersebut bisa baca dibawah ini. Cara Membuat Side Navigation di Blogger Pertama buka Blog > klik Tema > klik Edit HTML Langkah berikutnya tambahkan kode side/slide navigasi tepat dibawah kode </header> <nav id='nav-wrapper' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement' role='navigation'> <u

Cara Memasang DNS Prefetch di Blog

Blog anda lambat susah untuk dikunjungi ? mungkin penyebab blog lambat banyak tapi ada beberapa yang perlu anda ketahui biasanya pada tema yang dipakai oleh kita terdapat sebuah javascript eksternal dan itu merupakan penyebab membuat blog lambat tapi kalau tidak pakai javascript tampilan serasa hambar seperti nasi tanpa lauk pauk. Tapi sekarang kalian tidak perlu khawatir lagi karena sudah ada yang namanya DNS Prefetch supaya membuat blog lebih stabil pada kecepatan loading serta pengunjung lebih enak dalam berkunjung di situs web atau blog anda. Berikut penjelasan tentang dns prefetch : Daftar isi 1 Apa itu dns prefetch ? 2 Bagaimana Penerapan dns prefetch ? 3 Cara Memasang DNS Prefetch Apa itu dns prefetch ? DNS prefetch adalah sebuah cara untuk mempercepat loading situs web atau blog dengan memanfaatkan DNS domain pada bagian tertentu. Seperti gambar,js,css dan lainnya pada tema kalian pasti ada link eksternal yang dapat memperlambat pemuatan situs web atau blog Anda den

Cara Membuat Halaman Rating Bintang di Blog

Rating bintang merupakan sebuah skor review dari website atau situs yang dimana akan ditampilkan pada mesin penelusuran seperti Google dengan menggunakan rating bintang ini dapat membuat pengunjung mengetahui bahwa situs tersebut lebih bagus ketimbang yang lain. Tapi belum tentu yah karena konten is king jadi meskipun menggunakan cara ini tapi konten tidak bagus tetap akan sama saja. Apakah dengan menggunakan rating bintang ini ada manfaatnya ? tentu saja pasti ada, apa saja manfaat yang akan kalian dapatkan jika memasang rating bintang atau rich snippet ini dan beriku beberapa manfaat yang akan di dapatkan oleh kalian. Daftar isi 1 Manfaat Menggunakan Rating Bintang di Blog 1.1 Perkecil Ukuran Gambar 1.2 Buat Ukuran Gambar Sesuai Blog 1.3 Bidik Keywoard Gambar 1.4 Tambahkan Atribut Pada Gambar 1.5 Tambahkan Atribut Pada Gambar 2 Cara Membuat Halaman Rating Bintang 2.1 Menggunakan Json-ld 2.2 Menggunakan Microdata Manfaat Menggunakan Rating Bintang di Blog Manfaat

Cara Pasang Lazy Load di Blog

Lazy load adalah suatu cara yang dapat membuat sebuah situs atau website menjadi lebih cepat atau kita sebut saja mempercepat sebuah situs dan untuk menerapkan lazy load kita harus menggunakan Javascript atau Jquery tentu ini dapat sangat membantu sekali dalam pembuatan lazy load. Apa itu lazy load ? Jika kalian sudah masuk ke situs ini pada bagian Homepage kalian bisa lihat bagian gambar yang ada pada situs ini tidak akan tampil terkecuali jika ada action atau sebuah aksi yang dimana jika mouse melakukan scroll kebawah maka gambar akan terlihat. Dengan cara ini gambar tidak akan termuat kecuali jika sudah ada aksi dari user. Apa lazy load bagus untuk Seo ? Bisa saya katakan sih bagus karena ini dapat membantu Seo onpage pada situs kita dan ini hanya sebuah nilai tambahan saja tidak seluruhnya. Jadi pelajari Seo bila ingin tau lebih banyak lagi. Apa lazy load membantu kecepatan website ? Yah, lazy load sangat membantu untuk menambah kecepatan website yang sebelumnya lambat da

Cara Membuat Adblock Antimainstream

Adblock yang gitu-gitu aja sih sudah biasa mending pakai cara ini yang pasti bakal membuat pengunjung langsung waw :v saya sarankan pakai ini biar ampuh 100% daripada cara yang lain loh. Sebelumnya kode ini masih sama seperti waktu saya share adblock sebelumnya hanya saja dirubah sedikit biar ngak sama kayak orang lain aja. Cara Membuat Adblock Antimainstream Pertama buka Blog > klik Tema > klik Edit HTML Kedua tambahkan kode berikut tepat diatas kode </body> <script>//<![CDATA[ var _0x22fd=['aW5zZXJ0QmVmb3Jl','TmVtSXg=','c3RyaW5n','Y291bnRlcg==','ZGVidQ==','b293TGo=','WFZuRGY=','Y29uc3RydWN0b3I=','d2hpbGUgKHRydWUpIHt9','SXFaZFM=','V2taT24=','bUJxWmw=','WHpWWW0=','RHlhWXo=','UUJUamc=','Y2FsbA==','YWN0aW9u','Z2dlcg==','c3RhdGVPYmplY3Q=','S3NGYUU=','XCtcKyAqKD86XzB4KD86W2EtZjAtOV0pezQsNn18K

Cara Membuat Halaman FAQ Page Schema di Blog

Kali ini saya ngak share Tutorial dulu tapi belajar bareng saja dan pada kali ini saya akan membahas mengenai FAQ atau Frequently Asked Question yang biasanya digunakan untuk sebuah Halaman pertanyaan yang sering diajukan oleh user atau pengguna disebuah situs. Bagi kalian yang belum lihat bagaimana hasilnya dari mesin penelusuran di Google hasilnya seperti berikut. Tampilan diatas hanya akan terlihat pada saat di mesin penelusuran dan pertanyaan yang akan saya berikan adalah Bagaimana Cara Membuat Itu? Pastinya kalian tidak tau kan? Oleh sebab itu saya membuat artikel ini agar belajar bareng. Apa itu Schema FAQPage? Schema.org memiliki info lebih lanjut tentang data terstruktur FAQ dan di acara Google Dance di Singapura di Juli 2018 Google mengumumkan bahwa mereka akan mulai menggunakan ini dalam pencarian. Anda dapat menemukan dokumentasi Google di sini . Bagaimana saya bisa mendapatkan hasil penelusuran FAQ di Google? Google telah mulai menampilkan halaman dengan markup