Postingan

Menampilkan postingan dengan label Widget

Cara Agar Artikel Bisa Diseleksi tapi tidak bisa di copy

Gambar
Tutorial bagaimana cara agar artikel tidak bisa di copy, Tetapi bisa di seleksi... Hello sobat blogger, berjumpa lagi kita bersama sama. Pada kesempatan kali ini kita membahas tentang copy paste ya sobat, teruntuk kalian yang suka copy paste artikel orang, mending nyerah deh hehe.. Karena banyak kode yang bisa digunakan untuk menghambat dan menghalangi kejahatan kalian. Artikel ini bertujuan agar para pengunjung tetap bisa menseleksi postingan, tetapi, tidak bisa di copy loh sobat, Penasaran kan?? Mari simak yukk sobat. KUMPULAN ANTI COPY PASTE ARTIKEL BLOGGER COBA SOBAT COPY TEXT NYA:) Memasang Fungsi Seleksi Dan tidak bisa dicopy 1. Login ke Blogger sobat 2. Lihat tab Tema > Edit HTML 3. Masukkan Kode Javascript dibawah ini, Tepat diatas kode </body> <script type='text/javascript'> //<![CDATA[ document.addEventListener('copy', function (e){ e.preventDefault(); e.clipboardData.setData("text/plain", "Jangan Copas Bangsut :...

Cara Membuat Kotak Catatan / Blockquote Keren di Blog

Gambar
Cara Membuat Kotak Catatan / Blockquote Keren di Blog  . Kotak catatan / Blockquote juga merupakan sebuah box untuk memperjelas rincian dan catatan yang harus diingat, karena jika memberikan catatan hanya text doang tidak mudah dipahami, Nah dengan menggunakan box catatan ini, menjadi lebih mudah untuk menjelaskan rincian sobat kepada pengunjung Tenang saja sobat, kode ini Pure CSS, jadi tidak memberatkan loading blog sobat, mari simak saja tutorial yang harus dilakukan DEMO WIDGET BLOGGER Contoh Penggunaan Blackquote pada Blogger 1. Contoh Penggunaan 2. Contoh Penggunaan 3. Contoh Penggunaan Cara Membuat Kotak Catatan / Blockquote Keren di Blog 1. Login ke Blogger 2. Lihat ke Tema > Edit HTML 3. Lalu, Letakkan kode dibawah ini, Tepat diatas kode </head> <style type='text/css'> /*Blockquote Catatan by Chaya Education*/ .post-body blockquote { text-align: left; background: #6591c2; position: relative; display: block; padding: 55px 20px 20px...

Cara agar Blog Redirect ketika di CTRL + U

Gambar
Blogger yang baik adalah blogger yang menghargai karya blogger lainnya, Namun masih juga ada yang ingin mengambil sebagian kode atau bahkan mengclone template menggunakan CTRL + U.. Memang sebagian orang penasaran akan template tersebut, namun bagaimana ceritanya ketika ada blogger yang ingin mengambil kodenya. DEMO (Gabungkan CTRL+U Di Keyboard Sobat) Jika sobat merasa tidak senang dan ingin menghentikan kegiatan itu, admin punya caranya loh sobat agar kode tidak bisa diambil menggunakan CTRL + U Penasaran kan? Nahh untuk mempersingkat waktu, mari simak tutorial blogger berikut ini untuk mengamankan blog sobat dari pencuri pencuri kode:D Cara agar Blog Redirect ketika di CTRL + U Tahap Pertama :  1. Login ke Blogger 2. Masuk ke Tata Letak > Edit HTML 3. Masukkan Javascript dibawah ini, Tepat diatas kode </body> <script type='text/javascript'> //<![CDATA[ shortcut={all_shortcuts:{},add:function(a,b,c){var d={type:"keydown",propagate:!1,disable_in...

Cara Memasang Pop Up Ucapan Selamat Berpuasa di Blogger

Gambar
Cara Memasang Popup Selamat Menunaikan ibadah puasa Seperti Arlina - Awal ingin membuat ini adalah pada saat mengunjungi situs Mbak arlina  Admin melihat sebuah popup selamat menunaikan ibadah puasa, tanpa berpikir lama admin mencoba untuk melihat kodenya dan agar semua muslim dan para blogger juga bisa mencicipinya. Tindakan ini bukanlah tindakan yang tidak diperbolehkan, hanya saja mengambil dan ingin membagikan, mbak arlina juga tidak keberatan loh sobat. Nahh jika sobat penasaran, silahkan simak berikut ini dan lihat demonya dulu ya+_= Selamat Menunaikan Ibadah Puasa ramadhan 1439 H Cara Memasang Pop Up Ucapan Selamat Berpuasa di Blogger 1. Login ke Blogger 2. Masuk ke Tata  Letak > Edit HTML 3. Masukkan Font Awesome dibawah ini, Tepat diatas kode </body> <link href='//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/> 4. Masukkan CSS dibawah ini, Tepat diatas kode </head...

Cara Membuat Button Demo dan Download di Sidebar

Gambar
Button Demo dan download memang sangat penting terlebih khusus para bloger yang mengambil niche blog download template dan download lainnya, Dengan kode di sidebar ini tidak mempersulit para pengunjung untuk melirik demo & downloadnya. Jika sobat penasaran cara membuatnya, ada baiknya perhatikan hal hal yang akan dibahas disini, dan pahami denga teliti, karena jika salah, button demo & download di sidebar tidak akan tampil sebagaimana mestinya Cara Membuat Button Demo dan Download di Sidebar Tahap Pertama :  1. Login ke Blogger 2. Lihat Tab Tema > Edit HTML 3. Masukkan Kode font awesome dibawah ini, Tepat diatas kode </head> <link href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/> Masukkan CSS dibawah ini, Tepat diatas kode ]]></b:skin> atau </style> /* CSS Button-Side Style By Chaya Education */ #store-style{background:#f6f8f9;display:block;overflow:hidden;padding:20px;margin:0 0 20px 0...

Cara Membuat Widget Subscription Jalantikus

Gambar
Widget subscription / Newsletter / banyak juga yang bilang form langganan adalah sebuah cara agar para pengunjung bisa mendaftarkan alamat emailnya dan mendapatkan update terus menerus dari blog yang di langgankan. Sebagai contoh sobat memiliki youtube, dan ada yang subcribe blog sobat, nahh orang yang subscribe youtube sobat itu akan mendapatkan update tiap kali sobat mengupload video. Sama halnya dengan form langganan versi blog, jadi ketika ada pengunjung yang rela untuk mendapatkan update terbaru dengan cara memasukkan emailnya, maka pengunjung tersebut akan mendapatkan update dari blog sobat. Kali ini admin mencoba membagikan widget Subscription milik jalantikus, Bukan niat untuk mengambilnya, tetapi memang tampilannya oke dan bagus jadi minat untuk mencomotnya:D Sebelumnya maaf untuk yang memiliki web jalantikus. Jika sobat penasaran cara buatnya, mari simak berikut ini.. See the Pen ELEmvE by Enter Blogger ( @enterblogger ) on CodePen . Demo on Web Kelebihan Dari Subscription P...

Cara Membuat Widget Syntax Highlight + Line Number Buatan Gue

Gambar
Cara membuat Syntax Highlights - Kotak Syntax merupakan template untuk memberikan keterangan coding dengan berbagai macam warna dan agar lebih mudah dipahami. Syntax Highlghts ini berfungsi untuk menampilkan atau menjelaskan isi dari coding agar mudah dipahami dan enak dipandang. Namun ada beberapa blogger pemula yang masih bingung bagaimana cara membuatnya. Nahh untuk itu sobat, admin mencoba untuk membagikan kode syntax highlight yang buatan admin sendiri, semoga sobat suka ya. Untuk mempersingkat waktu, mari simak berikut ini : Cara Membuat Widget Syntax Highlight + Line Number  See the Pen Zoxxow by Enter Blogger ( @enterblogger ) on CodePen . Demo on Web Tertarik untuk mencobanya?? Yukk simak berikut ini. Tahap pertama :  1. Login ke Blogger 2. Lihat Tab Tema > Edit HTML 3. Masukkan CSS dibawah ini tepat diatas kode ]]></b:skin> atau </style> .tl-dropcap{float:left;display:block;font-size:50px;line-height:50px;background-color:$(keycolor);color:white;...

Cara memasang tombol Up dan Down di Blog

Gambar
Tombol up dan down merupakan tombol otomatis scroll keatas dan kebawah, dengan adanya tombol ini mempermudah pengunjung untuk melihat bagian bawah maupun bagian atas tanpa scroll mouse Tombol up dan down tidak memberatkan blog sobat, dan kebenyakan para blogger menggunakannya untuk mempermudah para pengunjung untuk mencari informasi yang sedang dicari. Jika sobat ingin mencobanya, mari simak berikut ini ya sobat+_= Cara memasang tombol Up dan Down di Blog Tahap Pertama :  1. Login ke Blogger sobat 2. Lihat Tab Tema > Edit HTML 3. Masukkan Fontawesome dibawah ini, Tepat diatas kode </head> <script type='text/javascript'> //<![CDATA[ function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || ...

Membuat Widget Popular Post keren Buatan Chaya Education

Gambar
Widget Popular Post wajib dipasang pada blog adalah bisa membuat pengunjung situs blog mengetahui postingan mana yang paling digemari atau populer pada situs blog tersebut. Dengan demikian postingan artikel yang diunggulkan atau populer tersebut tidak hanya mendapatkan pengunjung dari search engine saja, melainkan bisa didapatkan dari pengunjung situs blog sobat sendiri, karena mereka telah tertarik terhadap post unggulan yang tersemat pada navigasi widget Popular Post tersebut. Hasilnya tentu Pageview yang sobat dapatkan akan lebih bertambah. Setelah membaca alasan diatas, apakah masih ada blogger yang tidak memanfaatkan fitur dari widget Popular Post??? Sangat disarankan untuk memanfaatkan widget ini ya para sahabat. Jika sobat tertarik untuk memasang Widget popular post ini pada blognya, silakan menyimak dan menerapkan tutorial berikut. Membuat Widget Popular Post keren Buatan Chaya Education Tahap Pertama :  1. Login ke Blogger 2. Lihat tab Tema > Edit HTML 3. Masukkan CSS...

Cara Membuat Grid Popular Post di Blog

Gambar
Widget popular post merupakan widget kode yang sudah diberikan secara otomatis oleh platform blogger, namun karena ituu, widget tersebut terasa tidak enak dilihat dan dipandang, nah untuk itu admin membagikan Grid popular post di blog. Popular post adalah salah satu widget yang menampilkan rincian maupun gambar terkait banykanya para pengunjung yang membaca, Dengan itu jika banyak artikel yang dibaca pengunjung, maka di widget popular post akan tampil di nomor 1. Nahh sobat, untuk mempersingkat waktu, mari simak berikut ini : Cara Membuat Grid Popular Post di Blog Tahap Pertama :  1. Login ke Blogger sobat 2. Lihat ke tab Tata Letak > Edit HTML 3. Masukkan CSS dibawah ini, Tepat diatas kode ]]></b:skin> /***** Sidebar Popular Posts - By Chaya Education*****/ .sidebar .popular-posts ul { counter-reset: popcount; margin: 0; padding: 0; } .sidebar .popular-posts ul li:first-child {} .sidebar .popular-posts ul li { font-family:'Oswa...

Membuat Credit Link Seperti Sora Template dan ThemeXpose

Gambar
Credit link atau bisa juga dibilang credit footer merupakan salah satu kode pengaman untuk suatu template. Dengan adanya credit tersebut, para pemakai template agak kesusahan untuk melepasnya, walaupun ada yang berhasil juga. Nahh menurut admin dari sekian banyak template yang admin coba untuk melepas creditlink, ternyata soratemplate dan ThemeXpose yang lumayan agak sulit sobat. Karena kesulitan itu membuat admin jadi penasaran dan ingin mengambil kodenya. Pada akhirnya, kodenya pun terambil, dan akan admin bagikan disini pada sobat semua. Untuk mempersingkat waktuu, mari simak apa saja yang harus dilakukan. Membuat Credit Link Seperti Sora Template dan ThemeXpose Tahap Pertama :  Ambil Kode javascript dibawah ini :  var _0xd7b4 = [ 'b t(5,0){1 2=B;1 3=A;7=\'<z y="\'+2+\'" x="\'+3+\'" q="\'+5.4(\'/o-c/\',\'/w\'+2+\'-h\'+3+\'-c/\')+\'" l="\'+0.4(/"/g,"")+\'"...

Cara Membuat Button Download Dan Demo Animated CSS

Gambar
Cara Membuat Tombol Download dan Demo - Button Download atau bisa dibilang juga dengan tombol, baik tombol download, demo, dan lainnya, Sesuai fungsi yang diinginkan. Membuat Button ini tidaklah sulit sobat, disini admin mencoba membagikan button download versi animated css hover, jadi terlihat lebih menarik dan wow pastinya :D Button download ini jgua digunakan oleh chayaeducation, karena buatan admin, jadii jarang yang menggunakan dan pastinya okee. Nahh untuk itu, mari simak saja apa apa yang harus dilakukan.. Live demo Cara Membuat Button Download Dan Demo Animated CSS Tahap Pertama :  1. Login ke Blogger 2. Lihat Tab Tema > Edit HTML 3. Masukkan CSS dibawah ini, Tepat diatas kode ]]></b:skin> Atau </style> .button,input.button{position:relative;display:inline-block;margin-right:1em;margin-bottom:1.34em;padding:0.667em 2em;border-bottom:none;-webkit-border-radius:0.333em;-moz-border-radius:0.333em;border-radius:0.333em;background-color:rgba(84,87,102,1);color:...

Cara Membuat Form Login Pure CSS + HTML

Gambar
Form Login atau biasa disebut dengan kotak login merupakan sebuah kode yang disusun baik kode CSS, HTML, Js, Dan lainnya. Form login berfungsi untuk memasukkan data login ke Database yang disediakan, dan biasanya database tersebut berada didalam Hosting, Proses inpu output mengguanakan Login php dan lainnya. tetapi admin tidak membahas sampai dengan Php, kita membahas dari mulai pembuatan form loginnya. Untuk ituu, mari simak berikut ini apa saja yang harus dilakukan.. Live Demo Tahap Pertama :  1. Untuk Memulai Pembuatannya, berikan nama sebagai berikut login.html (untuk kode HTML) dan Style.Css (untuk Kode CSS) 2. pada data login.html > Masukkan kode HTML dibawah ini: <html> <head> <title>Cara Membuat Form Login Keren Pure CSS + HTML</title> </head> <link rel="stylesheet" type="text/css" href="style.css"> <body> <div class="container"> <h1>FORM LOGIN BY CHAYA EDUCATION<...