7 tools yang harus anda pasang di blog atau 7 tools that you must install on the blog
7 tools yang harus anda pasang di blog
Halo Sahabat [Duniaku Techno ##home##] - "7 tools yang harus anda pasang di blog" Banyak blogger pemula lebih mementingkan pendaftaran adsense untuk berpenghasilan. Namun dengan ketidak mlengkapanya pasti banyak sekali yang ditolak oleh Google adsense.
Dalam postingan kali ini [Duniaku Techno ##home##] akan memberikan cara memasang 7 tools.
Jika anda menghubungkan google adsense banyak yang ditolak karena konten tidak memadai, padahal widget anda sudah banyak.
Ternyata konten tidak memadai adalah yang dimaksut dengan laman yang tidak lengkap, Bisa juga karena jumlah kata yang di post terlalu sedikit.
Adapun tools tersebut diantaranya adalah:
- - Cara Membuat Atau Pasang About Pada Blogger
- - Cara Membuat Atau Pasang Contact Pada Blogger
- - Cara Membuat Atau Pasang Sitemap Pada Blogger
- - Cara Membuat Atau Pasang HTML Converter Pada Blogger
- - Cara Membuat Atau Pasang Css Minifier Pada Blogger
- - Cara Membuat Atau Pasang Charackter Countter Pada Blogger
- - Cara Membuat Atau Pasang Prvacy Policy Pada Blogger
Langsung saja saya bagikan cara memasangnya:
1. About
Tools About adalah tools yang berisi dengan sejumlah deskripsi blog atau juga peraturan yang anda buat di blog, caranya sebagai berikutlangkah pertama
=>-masuk ke blogger=> laman => laman baru
-ketik seperti biasa di compose dan masukkan deskripsi blog anda
-lalu jika telah selesai langsung publikasikan
langkah ke-2
-masuk ke tema => edit html
-buat submenu About, Lihat gambar panah
-masuk lagi ke laman, lihat laman tersebut , copy link laman , [Lihat gambar dibawah]
-jika link sudah dicopy masuk ke edit html
-cari About > masukkan link tersebut ke tanda # [lihat gambar]
-simpan dan lihat hasilnya di blog anda.
2. Contact
Contact adalah tools untuk menghubungkan anda dengan para visitor, jika ada kritik saran/masukan dari para visitor blog, adapun caranya seperti berikut:langkah pertama
-masuk ke blogger > laman > buat lman baru
-pilih editan dengan fitur html bukan compose
-copy kode dibawah ini
Silakan isi form di bawah ini untuk menghubungi admin. Jika tidak ada halangan dan kesibukan lainnya, admin akan langsung merespon pesan yang Anda kirimkan.
CODE BOX
[<form id="kontak-arlina" name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="Name *" size="30" type="text" value="" />
<input id="ContactForm1_contact-form-email" name="email" size="30" placeholder="Email *" type="text" value="" />
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Message *" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Send Message" />
<div style="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
<style scoped="" type="text/css">
#comments,.post_meta,#blog-pager{display:none}
form{color:#666}
#kontak-arlina{margin:auto;max-width:640px}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;width:100%;min-width:100%;transition:all 0.5s ease-out}
#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:15px 12px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.14);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;resize:none;transition:all 0.5s ease-out}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:#66afe9;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6)}
#ContactForm1_contact-form-submit{float:left;background:#95a5a6;margin:auto;vertical-align:middle;cursor:pointer;padding:12px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;max-width:140px;border-radius:3px;color:#fff;font-weight:500;transition:all .8s ease}
#ContactForm1_contact-form-submit:hover{background:#e74c3c;color:#fff;}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}
.contact-form-error-message-with-border{background:#f6f6f6;border:none;box-shadow:none;color:#444;padding:5px 0}
.contact-form-success-message{background:#4fc3f7;border:none;box-shadow:none;color:#fff}
img.contact-form-cross{line-height:40px;margin-left:5px}
.post-body input{width:initial}
@media only screen and (max-width:640px){
#ContactForm1_contact-form-name, #ContactForm1_contact-form-email,#ContactForm1_contact-form-submit{width:100%;}}
</style>
<script type="text/javascript">
//<![CDATA[
if (window.jstiming) window.jstiming.load.tick('widgetJsBefore');
//]]>
</script>
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '119913699998711552';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d119913699998711552','//kene-wonten.blogspot.com/','119913699998711552');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Sending...', 'contactFormMessageSentMsg': 'Your message has been sent.', 'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.', 'contactFormInvalidEmailMsg': 'A valid email address is required.', 'contactFormEmptyMessageMsg': 'Message field cannot be empty.', 'title': 'Contact Form', 'blogId': '119913699998711552', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]></script>]
-masukkan pada laman html di atas
-ganti angka yang berwarna biru dengan id blog anda. Cara mengetahui ID, login blogger lihat link di atas, yang angka adalah id blog anda.
-dan ganti url yang saya tebali kene-wonten.blogspot.com dengan alamat web anda
-simpan selesai
langkah ke-2
-ulangi seperti lagkah ke-2 diatas. [yang About]. yaitu memasukkan link ke sub-menu
-kemudian lihat hasilnya [lihat gambar dibawah]
3. Sitemap
Site map adalah sebuah tools untuk memberitahu kepada pengunjung jumlah post, dan juga mengetahui label pada post. Sitemap sangat penting untuk blogger yang belum terdaftar google adsense. Karena sitemap akan memberika sebuah kenyamanan bagi visitor untuk mengetahui daftar postinganya. Langsung saja saya jeaskan cara memasangnyalangkah pertama
-copy secript dibawah
CODE BOX
[<div id="bp_toc">
</div>
<script src="https://cdn.rawgit.com/Arlina-Design/redvision/master/sitemap-content.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&max-results=9999&callback=loadtoc" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
</style>]
-masuk ke blog, buat halaman baru
-pilih metode html bukan compose
-pastekan secript
-publikasikan
langkah ke-2
-ulangi kembali langkah ke-2 seperti yang About, yaitu dengan memasukkan link ke submenu
-simpan lalu lihat hasilnya [gambar dibawah]
4. Html Converter
Fungsi Html converter adalah jika anda ingin membuat postingan artikel dimana artikel itu berbentuk kode script HTML/ JavaScript maka, cara untuk memasangnya dalam postingan tidak bisa dilakukan secara langsung karena jika kamu memasukan secara langsung kode script itu, maka hasilnya berbentuk sama dengan format yang dipasang dalam postingan Makanya diperlukan kode-kode pengganti untuk memunculkan kode script itu agar sesuai dengan kode aslinya dengan menggunakan tools Html converter atau Html pharse .Fungsi lainnya ketika anda mau memasang script pihak ketiga dalam template blog misalnya script iklan maka terlebih dulu anda diharuskan memparse script tersebut baru boleh disematkan dalam template . hal ini terjadi karena adanya perintah pemanggil yang beda pada script template yang mengharuskan anda membuat script yang dipasang sendiri. cara membuatlangkah pertama
-buat halaman baru
-pilih metode html bukan compose
-masukkan secript dibawah
-publikasikan
CODE BOX
[<script type="text/javascript">langkah ke-2
function convert(){var ele1 = document.getElementById("somewhere");var replaced;replaced = ele1.value;replaced = replaced.replace(/&/ig, "&");replaced = replaced.replace(/</ig, "<");replaced = replaced.replace(/>/ig, ">");replaced = replaced.replace(/"/ig, """);replaced = replaced.replace(/±/ig, "±");replaced = replaced.replace(/©/ig, "©");replaced = replaced.replace(/®/ig, "®");replaced = replaced.replace(/ya'll/ig, "ya'll");ele1.value = replaced;}
</script><br />
<table style="margin: 0 auto;"><tbody>
<tr> <td><textarea id="somewhere" style="background: none repeat scroll 0% 0% rgb(248, 248, 248); border: 1px solid rgb(204, 204, 204); height: 300px; width: 500px;"></textarea><br />
<input onclick="convert();" style="padding: 5px;" type="button" value="Parse Script" /></td> </tr>
</tbody></table>]
-lakukan lengkah ke-2 dengan cara memasukkan link ke submenu seperti yang diatas [About]
-lihat hasilnya
5. Css minifier
Anda perlu tahu, Bahwa kecepatan loading sebuah blog menjadi sebuah hal yang penting untuk menentukan keberhasilan sebuah blog . Sebab alat web browser saat menampilkan blog kita secara utuh dari saat dibuka Lebih memperhatikan hal hal utama antara lain : ukuran gambar, ukuran file html, ukuran file sebuah script .
Script css yang tersemat pada template blogger berada diatas kode ]]> </ b: skin> Nah, jika anda mau uji apakah blogmu berat atau tidak kamu bisa mengujinya lansung dengan menuju ke [https://gtmetrix.com##link##] silahkan uji blogmu dengan memasukkan url ke kolom yang disediakan kemudian klik analisa .selesai.
Jika diketahui kurang dari 50% anda wajib pasang Css minifier. Bagaimana caranya, langsung sj kita simak dibawah ini
langkah pertama
-buat laman baru
-masukkan kode dibawah
-gunakan metode html bukan copose
-lalu publikasikan
CODE BOX
[<div id="cssminifier">langkah ke-2
<style scoped="" type="text/css">
#cssminifier{background:#ecf0f1;position:relative;display:block;clear:both;border-radius:5px;padding:20px;border:1px solid rgba(0,0,0,0.05)}
#cssminifier textarea{width:90%;height:240px;margin:0 auto;display:block;background-color:#fff;padding:20px;font:normal 13px 'Courier New',Monospace;border:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,0.05);border-radius:5px 5px 0 0;resize:none}
textarea:focus{background-color:#FFF;color:#303030}
#cssminifier .box{margin:10px auto 30px;color:rgba(255,2255,255,.6);}
#cssminifier .box p{margin:0 0 2px}
#cssminifier button{cursor:pointer;}
#cssminifier .col{widt48%;margin:0 auto 30px}
#cssminifier .left{float:left;margin-left:1%}
#cssminifier .right{float:right;margin-right:1%}
#cssminifier .button-group{background:#2980b9;text-align:center;padding:20px 20px 40px 20px;margin:0;border-radius:0 0 5px 5px}
#cssminifier button,#cssminifier button[disabled]:active{background:rgba(255,255,255,0.2);text-align:center;color:#fefefe;display:inline-block;padding:6px 12px;font-size:14px;font-weight:400;line-height:1.471;border-radius:4px;margin:0 5px;border:0;transition:all .1s}
#cssminifier button:hover,#cssminifier button:active{background:#fff;color:#2980b9}
#cssminifier button[disabled],#cssminifier button[disabled]:active{background:#fff;}
#cssminifier .opt1,#cssminifier .opt2,#cssminifier .opt3,#cssminifier .opt4,#cssminifier .opt5{display:inline-block;margin:0 0 0 10px;vertical-align:middle;border:none;outline:none}
#cssminifier br{display:none}
</style>
<span class="clear"></span>
<textarea autofocus="" id="cssField" placeholder="Paste kode css disini..." spellcheck="false"></textarea>
<br />
<div class="button-group">
<div class="box">
<input class="opt1" id="stripAllComment" type="checkbox" />
<label for="stripAllComment">Strip all comments</label>
<input class="opt2" id="superCompact" type="checkbox" />
<label for="superCompact">Super compact</label>
<input class="opt3" id="betterIndentation" type="checkbox" />
<label for="betterIndentation">Keep indentation</label>
<input checked="" class="opt4" id="keepLastComma" type="checkbox" />
<label for="keepLastComma">Remove the last semicolon</label>
</div>
<button onclick="compressCSS("cssField");">Compress CSS</button>
<button onclick="clearField("cssField");">Clear Field</button>
<button onclick="selectAll("cssField");">Select All</button>
</div>
<div class="clear">
</div>
<script type="text/javascript">]
-sama seperti langkah kedua About [dengan memasukkan ke sub menu]
-simpan lihat hasilnya
-dibawah ini gambar css minifier
6. Charackter counter
Charackter counter adalah tools yang digunakan sebagai alat penghitung kata, Charackter counter berguna untuk memastikan jumlah kata artikel blog. Langsung saja saya jelaskan caranya
lagkah pertama
-buat laman baru
-gunakan metode html bukan compose
-masukkan secript dibawah
-publikasikan
CODE BOX
[<form method="POST" name="wordcount">langkah ke-2
<script language="JavaScript">
function countit(){
/*Word count script
Over 400+ free scripts here!
*/
var formcontent=document.wordcount.wordcount2.value
formcontent=formcontent.split(" ")
document.wordcount.wordcount3.value=formcontent.length
}
</script>
<br />
<table border="0" cellpadding="5" cellspacing="0">
<tbody>
<tr>
<td width="100%"><textarea cols="55" name="wordcount2" rows="22" wrap="virtual"></textarea></td>
</tr>
<tr>
<td width="100%"><div align="right">
<input onclick="countit()" type="button" value="Calculate Words" /> <input name="wordcount3" size="20" type="text" /><br />
<div align="center">
</div>
</div>
</td>
</tr>
</tbody></table>
</form>]
-ikuti langkah seperti yang About di atas, [memasukkan link ke sub menu]
-lihat hasilnya, dan selesai
7. Privacy policy
Privacy Policy adalah sebuah dokumen hukum yang mengungkapkan beberapa informasi tentang pengelolaan situs atau blog. Privacy Policy ini mutlak dibuat oleh blogger yang ingin terjung kedalam dunia bisnis online, semisal Google Adsense. Privacy policy intinya sangat penting, Jika anda ingn memasangnya ikuti langkah dibawah
langkah pertama
-masuk ke situs [http://www.privacypolicyonline.com]
-lihat gambar dibawah
-your site title [isi judul blog anda]
-yoursite [isi alamat web anda]
-masukkan email
-centang seperti contoh dan klik generate policy
-mucul tulisan, lalu secroll kebawah pilih generate html for this page
-setelah itu copy semua code [klik high text] untuk mengcopy
-buat laman baru
-pilih metode html bukn compose
-paste disitu
-publikasikan
langkah ke-2
-lakukan dengan memasukkan link kedalam submenu seperti yang saya contohkan di About paling atas
-lihat hasilnya
Diatas merupakan hasil rangkuman Duniaku Techno untuk berbagi ilmu cara mempermudah menghubungkan ke google adsense dengan melengkapi 7 tools penting
#Jangan lupa like, coment, dan share
#Semoga sukses
7 tools that you must install on the blog
Comments
Post a Comment