Showing posts with label Tips dan Trik. Show all posts
Showing posts with label Tips dan Trik. Show all posts

Monday, February 19, 2018

Tips Dan Trik Mempercepat Loading Blog

Tips dan Trik Mempercepat Loading Blog. Untuk lebih jelasnya, ikuti langkah-langkah dibawah ini.

Tips Mempercepat Loading Blog

      1. Mempersingkat Tampilan awal atau home blog dengan cara menciptakan baca selengkapnya di setiap halaman posting. Dengan begitu loading blog dihalaman awal blog akan terbuka lebih cepat.
      2. Mengurangi atau mendelete widget yang tidak diperlukan, menyerupai widget jam, tanggal dan lain-lain. Jika memang tetap ingin mempertahankan widget2 tersebut, tempatkan widget di bab footer bawah blog. Maka loading blog akan sedikit bertambah cepat, alasannya yaitu bagian-bagian terberat blog akan dibuka belakangan. 
      3. Menampilkan 4 hingga 5 posting saja di halaman beranda/home blog. 
      4. Jangan terlalu banyak memakai gambar di blog.
      5. Kompres gambar yang akan dimasukan di blog, memakai Ms. Office Picture Manager atau software Compress gambar lainnya.
      6. Menghilangkan gambar tang obeng diblog,  yang berada di setiap bab widget yang digunakan.
      7. Compress Template Blog. Caranya, silakan lihat di bawah.
      8. Menghilangkan sidebar widget pada halaman tertentu. Caranya, lihat dibawah.
      9. Mengatur lebar gambar semoga tidak melebihi halaman posting.

      Trik Mempercepat Loading Blog


        Sebelumnya, test dulu kecepatan blog kau di situs ini http://gtmetrix.com. Untuk melihat berapa skor kecepatan dari blog kamu. Selanjutnya, sehabis melaksanakan cara-cara dibawah ini, test kembali kecepatan loading blog kau di situs tersebut, untuk melihat berapa besar perbedaannya.

        Cara Kompres Template Blog


          1. Login ke blog, Dari halaman dasbor pilih pengaturan template.
          2. Edit HTML dan Copy semua arahan yang ada di template kau dari awal hingga akhir.
          3. Selanjutnya kunjungi situs http://htmlcompressor.com/compressor.html
          4. Dan Pastekan semua arahan tadi ke kotak yang ada disitus tersebut.
          5. Setelah itu click COMPRESS dan pilih CHANGE
          6. Mempersingkat Tampilan awal atau home blog dengan cara menciptakan baca selengkapnya di setiap Tips dan Trik Mempercepat Loading Blog
          7. Terahir, Copy semua arahan hasil compress tadi, dan pastekan ke template blog kamu. Save template, Selesai.

          Menghilangkan Sidebar Widget pada halaman tertentu


          1. Ada 2 cara menyembunyikan sidebar widget di halaman terntentu di blog.
          2. Cara Pertama, Login ke blogger > pengaturan template > edit html > cari arahan </head>
          3. Dan tempatkan arahan berikut diatas </head>
          4. <b:if cond='data:blog.url == "http://fandrajuani.blogspot.com/p/daftar-isi_12.html"'>
            <style type='text/css'>
            .main-inner .columns {
            padding-left: 0px;
            padding-right: 0px;
            }
            .main-inner .column-left-outer {
            display: none;
            }
            .main-inner .column-right-outer {
            display: none;
            }
            </style>
            </b:if>
          5. Ganti ihttp://fandrajuani.blogspot.com/p/daftar-isi_12.html dengan URL halaman yang ingin sidebarnya disembunyikan. Save Template, selesai.
          6. Cara kedua, cari arahan <head>,
          7. Dan tempatkan arahan berikut diatas <head>
          8. <b:if cond='data:blog.url == "http://fandrajuani.blogspot.com/p/hubungi.html"'>
            <style type='text/css'>
            .sidebar{
            display: none;
            }
            </style>
            </b:if>
          9. Ganti http://fandrajuani.blogspot.com/p/hubungi.html dengan url dari halaman kamu. Save template, Selesai.
          Dan yang terakhir, mengatur lebar gambar di postingan blog semoga tidak melebihi halaman. Jika kita memakai ukuran gambar ekstra besar, biasanya gambar akan melewati batas halaman posting, dapat hingga terkena widget bab sidebar kanan, dan itu akan menciptakan loading blog lebih lambat. Berikut ini yaitu script arahan untuk mengatur lebar gambar, untuk lebih jelasnya ikuti langkah-langkah dibawah ini.

          Mengatur lebar gambar posting blog


          1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
          2. Dan klik edit HTML, selanjutnya cari kode  ]]></b:skin> dan masukan arahan berikut diatasnya.
          3. #header img { max-width: 99%; max-height:90%; margin:1px 1px;padding:0px;}
            .post img { vertical-align:bottom; max-width:90%; max-height:90% }
            #navigation img { vertical-align:bottom; max-width:80%; }
          4. Save Template, selesai.
          Sebenarnya blogger sudah menunjukkan tools untuk mengatur gambar ketika kita menulis artikel, tapi itu tidak cukup untuk mengatur gambar dengan lebar yang sangat besar. Setelah memasukan arahan diatas, maka gambar dengan lebar ekstra besar, tidak akan melewati lebar halaman posting, dan cukup membantu untuk mempercepat loading blog. Silakan baca juga cara mempercepat loading blog lanjutan dari artikel ini. Untuk menambah kecepatan loading blog anda. Semoga Bermanfaat.
            Share:

            Sunday, February 18, 2018

            Belajar Seo Untuk Blogger Pemula

            Belajar Seo untuk blogger pemula. Seo atau search engine optimization berkhasiat untuk meningkatkan peringkat artikel blog di mesin pencari google. Atau cara supaya artikel blog berada di halaman pertama di google, dikala ada orang yang memasukan kata kunci di google search yang sesuai dengan isi dari artikel yang sudah kita buat.

            Bicara perihal seo, ada banyak faktor yang menciptakan artikel dapat berada di halaman pertama google, dari umur blog, content isi dari artikel yang berkualitas, backlink dan banyak lagi yang lain. Disini kita akan mempelajari dasar-dasarnya terlebih dahulu. Dari mengubah title judul blog, menambahkan deskripsi, keywoards, dan tools seo yang sudah disediakan oleh blogger. Untuk lebih jelasnya ikuti langkah-langkah dibawah ini.

            Merubah Judul Title Blog

            1. Login ke blogger > pengaturan template  > Edit HTML
            2. Dan Cari aba-aba <title><data:blog.pageTitle/></title> ganti menjadi
            3. <b:if cond='data:blog.pageType == &quot;index&quot;'>
              <title><data:blog.pageTitle/> | Desain Blog Tutorial dan Tips Trik Blogspot</title>
              <b:else/>
              <title><data:blog.pageName/> - <data:blog.title/></title>
              </b:if>
            4. Ganti "Desain Blog Tutorial dan Tips Trik Blogspot" dengan judul yang kau inginkan, tidak lebih dari 60 karekter. Dan tanda | dan - itu batas pemisah.
            5. Save template, selesai.

            Menambahkan meta deskripsi di Halaman awal dan setiap posting blog

            1. Login ke blogger, dari halaman dasbor pilih Setelan > Preferensi Penelusuran > Tag Meta Deskripsi.
            2. Pilih Aktifkan deskripsi penelusuran, dan isi deskripsi blog dengan klarifikasi dari judul blog, panjang deskripsi Maksimum 150 karakter.
            3.  Seo atau search engine optimization berkhasiat untuk meningkatkan peringkat artikel blog di  Belajar Seo untuk Blogger Pemula
            4. Simpan Perubahan, Selesai.
            5. Sekarang, menambahkan Deskripsi di setiap posting blog.
            6. Buka Entri Baru atau Edit posting yang ada. 
            7. Dan Lihat bab kanan entri, di bab Deskripsi penelusuran isi dengan klarifikasi dari isi posting blog, disarankan 20-30 kata saja.
            8.  Seo atau search engine optimization berkhasiat untuk meningkatkan peringkat artikel blog di  Belajar Seo untuk Blogger Pemula
            9. Setelah itu klik selesai.

            Menambahkan meta keywords kata kunci Blog

            1. Login ke Blog, pengaturan template, edit HTML dan tempatkan keywoard yang bekerjasama dengan isi blog, dibawah aba-aba judul blog tadi.
            2. <meta content='Fandra Juani,Desain blog,blogger,blogspot,tutorial,cara,belajar,Tips,Trik,edit template,pemula' name='keywords'/>
            3. Ganti kata kunci diatas dengan kata kunci yang kau inginkan. Isi keywords dengan kata kunci yang berbeda satu sama lainnya dan pisahkan setiap kata dengan tanda koma.
            Setelan mengganti Title judul blog, menambahkan deskripsi dan keywords. Sekarang test tingkat seo blog kita, kunjungi http://www.submitshop.com/seo-tools/meta-tag-analyzer untuk melihat berapa skor seo title keseluruhan blog. Setelah selesai, lanjut ke langkah seo berikutnya yaitu menambahkan title dan alt gambar di posting blog.

            Menambahkan Title dan Alt text gambar blog

            1. Klik gambar di entri blog, dan isi title text dengan kata kunci 1 hingga 3 kata saja. Dan isi Alt text dengan klarifikasi kata kunci gambar, jangan terlalu panjang. Contoh:
            2.  Seo atau search engine optimization berkhasiat untuk meningkatkan peringkat artikel blog di  Belajar Seo untuk Blogger Pemula
            3. Isi setiap gambar dengan title dan alt yang sesuai dengan isi dari posting blog.

             Mengatur Tautan Permanen URL Posting Blog

            1. Buka Entri Baru, dan klik bab kanan entri pada Tautan permanen. Contoh:
            2.  Seo atau search engine optimization berkhasiat untuk meningkatkan peringkat artikel blog di  Belajar Seo untuk Blogger Pemula
            3. Gunakan Tautan Permanen Khusus, jikalau judul posting terlalu panjang. Buatlah URL yang masih dapat dimengerti maksudnya, walaupun diperpendek url nya, setidaknya 4 hingga 7 kata saja. Setelah di publikasikan URL posting blog tidak dapat diedit lagi alias permanen, alasannya itu setiap kita menciptakan entri baru, buatlah judul yang benar-benar sesuai dengan isi dari posting artikel.
            Selanjutnya yakni menambahkan Internal link url dari satu posting ke posting yang lain. Masukanlah Link Url dari posting atau artikel yang saling bekerjasama antara satu dengan yang lainnya. Contoh: Jika kita sedang menciptakan artikel dengan judul belajar menciptakan blog, maka masukanlah link url dari posting kita yang lain menyerupai belajar menulis blog yang telah dipublikasikan sebelumnya.

            Cara Menggunakan Internal Link Blog

            1. Klik Link pada bab tools entri, dan masukan url artikel dari dalam blog. contoh:
            2.  Seo atau search engine optimization berkhasiat untuk meningkatkan peringkat artikel blog di  Belajar Seo untuk Blogger Pemula
            3. Masukan url di bab web address, dan ganti goresan pena di bab text to display dengan judul atau isi dari url tersebut.
            4. Jangan gunakan kata Disini atau Klik Disini, Baca Disini pada bab text to display.
            5. Gunakanlah kalimat sesuai judul, maksimal 4 hingga 5 kata saja, jangan panjang-panjang.
            6. Selanjutnya klik Ok. Abaikan saja pengaturan yang lainnya.
            Seperti pola diatas, aku memasukan link url dari posting yang lain berjudul cara mempercepat loading blog dengan 4 kata saja. URL yang dimasukan sesuai dengan isi dari artikel ini, perihal berguru seo, alasannya loading juga menghipnotis seo. Sekarang coba klik goresan pena ini perihal cara menulis artikel di blog , maka akan terbuka halaman gres yang berisi artikel lain yang ada di blog ini.
            Terakhir yakni tentang Eksternal link atau memasukan URL dari situs lain diluar blog kita. Contohnya facebook.com yahoo.com dan lain-lain. Cara memasukannya di posting blog, sama menyerupai memasukan url internal link, yang membedakan yakni kita harus mencentang Add 'rel=nofollow' attribute. Untuk meningkatkan seo blog di google.

            Untuk lebih jelasnya lagi perihal berguru seo blogger, coba cari di google dengan kata kunci seo for blogger, baca dari situs google, jangan situs lain, biasanya dalam format PDF untuk seo starter guide, isinya lebih lengkap dari cara diatas dan yang niscaya sumber terpercaya dari google sendiri. Semoga Bermanfaat.
            Share:

            Breadcrumb Seo Untuk Blogspot

            Breadcrumb Seo untuk Blogspot. Breadcrumb berkhasiat untuk memudahkan google untuk menelusuri isi dari blog kita, dan juga memudahkan pembaca melihat gosip letak artikel yang sedang dibaca. Breadcrumb letaknya berada di bawah sajian header, dan diatas judul artikel yang sedang dibuka. Untuk lebih jelasnya, lihat pola gambar dibawah ini.

            Breadcrumb berkhasiat untuk memudahkan google untuk menelusuri isi dari blog kita Breadcrumb Seo untuk Blogspot
            Cara menciptakan breadcrumb seo untuk blogspot. Ikuti langkah-langkah dibawah ini.
            1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
            2. Selanjutnya klik edit HTML dan cari isyarat <b:include data='top' name='status-message'/> dan masukan isyarat berikut ini diatasnya.
            3. <b:include data='posts' name='breadcrumb'/>
            4. Setelah itu cari isyarat <b:includable id='main' var='top'> dan masukan isyarat berikut ini diatasnya.
            5. <b:includable id='breadcrumb' var='posts'>
              <b:if cond='data:blog.homepageUrl != data:blog.url'>
              <b:if cond='data:blog.pageType == "static_page"'>
              <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
              <b:else/>
              <b:if cond='data:blog.pageType == "item"'>
              <!-- breadcrumb for the post page -->
              <b:loop values='data:posts' var='post'>
              <b:if cond='data:post.labels'>
              <div class='breadcrumbs' xmlns:v="http://rdf.data-vocabulary.org/#">
              <span typeof="v:Breadcrumb"><a expr:href='data:blog.homepageUrl' rel="v:url" property="v:title">Home</a></span>
              <b:loop values='data:post.labels' var='label'>
               » <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>
              </b:loop>
               » <span><data:post.title/></span>
              </div>
              <b:else/>
              <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
              </b:if>
              </b:loop>
              <b:else/>
              <b:if cond='data:blog.pageType == "archive"'>
              <!-- breadcrumb for the label archive page and search pages.. -->
              <div class='breadcrumbs'>
              <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
              </div>
              <b:else/>
              <b:if cond='data:blog.pageType == "index"'>
              <div class='breadcrumbs'>
              <b:if cond='data:blog.pageName == ""'>
              <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
              <b:else/>
              <span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
              </b:if>
              </div>
              </b:if>
              </b:if>
              </b:if>
              </b:if>
              </b:if>
              </b:includable>
            6. Save template, selesai.
            7. Jika ingin merubah tampilan breadcrumb, tambahkan isyarat css diatas ]]></b:skin>
            8. .breadcrumbs {
              padding:5px 5px 5px 0px;
              margin: 0px 0px 15px 0px;
              font-size:95%;
              line-height: 1.4em;
              border-bottom:3px double #e6e4e3;}
            9. Silakan ubah sendiri, isyarat css nya sesuai dengan yang kalian inginkan.
            Dari sini, pembuatan breadcrumb sudah selesai. Sekarang mengecek breadcrumb di google. Breadcrumb yang terindeks google, tampilannya akan menyerupai gambar dibawah ini.

            Breadcrumb berkhasiat untuk memudahkan google untuk menelusuri isi dari blog kita Breadcrumb Seo untuk Blogspot

            Cara ceknya:
            1. Kunjungi situs google http://www.google.com/webmasters/tools/richsnippets
            2. Selanjutnya masukan URL dari salah satu artikel di blog kamu.
            3. Klik Pratinjau, Selesai.
            Setelah memasang breadcrumb seo di blog, google akan mengindeksnya dalam beberapa hari di hasil pencarian google. Silakan dibaca juga artikel lainnya perihal seo, ialah perihal Belajar seo untuk blogger pemula Semoga Bermanfaat.
              Share:

              Wednesday, February 14, 2018

              Macam Bentuk Numbered List Dan Bullet List

              Macam Bentuk Numbered List dan Bullet List yang dapat digunakan di blogger. Cara menggunakannya lihat dibawah ini.
              1. Buatlah entri gres atau edit artikel lama
              2. Dan Klik Numbered List 
              3. Lalu klik bab HTML di sebelah Compose.
              4. Terus ganti isyarat <ol> dengan salah satu isyarat dibawah.
              5. Terakhir kembali ke Compose, maka tampilan numbered list akan berubah.
              6. Untuk Bullet list, klik bullet list, kemudian lihat pada bab HTML 
              7. Dan ganti isyarat <ul> dengan salah satu isyarat bentuk bullet list dibawah.
              Macam Bentuk Numbered List
              1. Bentuk Dasar, <ol> Tanpa Edit HTML
              1. Mulai dari angka 8, Ganti isyarat <ol> dengan <ol start="8">
              2. Setelah dienter, maka akan berlanjut ke nomor 9 dan seterusnya, ibarat goresan pena ini.
              1. Dalam Bentuk Huruf Besar, <ol type="A">
              1. Dalam Bentuk Huruf Kecil, <ol type="a">
              1. Dalam Bentuk abjad atau angka romawi, <ol type="I">
              1.  Angka romawi abjad kecil, <ol type="i">
              1. Angka Romawi Besar dimulai dari angka 5, <ol type="I" start="5">
              2. Setelah dienter, maka akan berlanjut ke angka romawi 5 dan seterusnya.
              Macam Bentuk Bullet List
              • Bentuk dasar bullet list, <ul> tanpa edit html
              • Bentuk Bulat sederhana, <ul type="circle">
              •  Bentuk Kotak, <ul type="square">
              Dan yang terakhir, tips meratakan tampilan kiri-kanan Numbered list. Seperti teladan gambar dibawah ini.
               Macam Bentuk Numbered List dan Bullet List yang dapat digunakan di blogger Macam Bentuk Numbered List dan Bullet List
              Contoh gambar
              Dari gambar diatas Tampilan numbered list, rata dengan kalimat yang ditulis ibarat menulis biasa diblog, diatur memakai justify rata kiri kanan kalimat. Standar blogger, tampilannya akan ada spasi jarak sehingga tidak sejajar dengan kalimat yang ditulis biasa tanpa numbered list.
              Berikut sedikit trik cara semoga tampilan numbered list rata dengan goresan pena biasa.
              1. Login ke blogger, dari halaman dasbor, pilih pengaturan template.
              2. Terus edit html, dan cari isyarat ]]></b:skin> kemudian letakan isyarat berikut ini diatasnya.
              3. .post ol {
                padding:0px 24px 0px;
                width:96%;max-width:100%;}
              4. Keterangan kode: padding:0px 24px 0px; Rata Kiri dan width:96%;max-width:100%; Rata Kanan.
              5. Jika belum rata, Ganti 24px dan 96% semoga rata dengan tampilan posting kamu.
              6. Save template, selesai.
              Pada dikala menulis, tampilan numbered list tetap ibarat biasa, tetapi jikalau sudah dipublikasikan, maka tampilannya akan berubah, rata dengan goresan pena biasa. Preview dulu goresan pena untuk melihat hasilnya.
              Itulah sedikit tips trik menulis artikel memakai numbered list dan bullet list di blog, silakan baca juga tips trik menulis artikel di blog memakai numbered list yang disisipkan gambar, atau isyarat script ditengah-tengahnya. Semoga Bermanfaat.
              Share:

              Monday, February 12, 2018

              Fungsi Margin Dan Padding Di Blog

              Margin dan Padding merupakan arahan CSS yang dipakai untuk menciptakan jarak atau spasi. Perbedaanya yaitu margin dipakai pada bagian luar, dan padding pada bagian dalam. Dengan arahan margin kita sanggup merubah posisi dari widget yang kita inginkan, sedangkan padding, kita sanggup menggunakannya untuk bab dalam, menyerupai spasi antar text tulisan, jarak antara text dengan batas garis widget atas-bawah. Untuk lebih jelasnya lihat gambar dibawah ini.

               Margin dan Padding merupakan arahan CSS yang dipakai untuk menciptakan jarak atau spasi Fungsi Margin Dan Padding di Blog

              Adapun kode-kode Css Dari Margin dan Padding yang sanggup kita gunakan diblog yaitu sebagai berikut:
               Margin
              1. margin: 10px;  (10px Spasi atas-kanan-bawah-kiri).
              2. margin: 0px 80px; (0px Spasi atas-bawah) (80px spasi kanan-kiri)
              3. margin: 100px 10px 50px; (100px spasi atas) (10px spasi kanan-kiri) dan (50px spasi bawah)
              4. margin: 90px 50px 20px 0px; (90px spasi atas) (50px spasi kanan) ( 20px spasi bawah) (0px spasi kiri)
              5. Khusus untuk margin dengan arahan 4, sanggup kita tambahkan arahan - untuk merubah posisi dengan arah berlawanan, contoh: margin: margin:-55px -50px 0 0
              Padding
              1. padding: 10px;  (10px Spasi atas-kanan-bawah-kiri).
              2. padding: 0px 80px; (0px Spasi atas-bawah) (80px spasi kanan-kiri)
              3. padding: 100px 10px 50px; (100px spasi atas) (10px spasi kanan-kiri) dan (50px spasi bawah)
              4. padding: 90px 50px 20px 0px; (90px spasi atas) (50px spasi kanan) ( 20px spasi bawah) (0px spasi kiri)
              Dari kode-kode diatas sudah terlihat, yang membedakan Margin dan Padding hanyalah nama awalnya saja sedangkan yang lainnya sama.

              Langsung saja, dibawah ini yaitu teladan penggunaan margin pada bab Header blog. Tampilan awal Header blog pertama.

               Margin dan Padding merupakan arahan CSS yang dipakai untuk menciptakan jarak atau spasi Fungsi Margin Dan Padding di Blog

              1. Susunan elemen dari gambar diatas yaitu menyerupai dibawah ini.
              2.  Margin dan Padding merupakan arahan CSS yang dipakai untuk menciptakan jarak atau spasi Fungsi Margin Dan Padding di Blog
              3. Sekarang ke pengaturan template. Dan klik edit HTML.
              4. Lalu cari satu persatu arahan dari susunan elemen dari langkah 1.
              5.  Margin dan Padding merupakan arahan CSS yang dipakai untuk menciptakan jarak atau spasi Fungsi Margin Dan Padding di Blog
              6. Pertama cari arahan Header, disini yang berjudul Fandra Juani. Gunakan Ctrl F untuk mempermudah pencarian. menyerupai dibawah ini.
              7. Setelah ketemu, copy arahan bertanda merah diatas, kemudian pastekan di notepad, dan lanjutkan mencari arahan Laman Dan HTML/javascipt.
              8. Setelah semuanya ketemu, tambahkan arahan margin untuk merubah posisi yang kita inginkan. menyerupai dibawah ini.
              9. #Header{float:left}
                #HTML1{float:right; margin:-115px -195px 0 0}
                #PageList1{float:right; margin:-55px -50px 0 0}
              10. Letakan arahan diatas ]]></b:skin>
              11. Save template, selesai.
              12. Tampillan Blog sehabis diberi arahan margin.
               Margin dan Padding merupakan arahan CSS yang dipakai untuk menciptakan jarak atau spasi Fungsi Margin Dan Padding di Blog

              Sudah terlihat terperinci perbedaan tampilan blog, dari yg awalnya datar kebawah, kini datar kesamping. Karena ditambahkan arahan margin. kenapa aku beri judul fungsi margin dan padding di blog, alasannya yaitu padding dan margin sanggup dipakai pada semua bagian-bagian blog, jadi tidak hanya menyerupai yang aku contohkan. Yang terpenting yaitu kita cari dulu arahan dari bab yang akan kita edit atau kita ubah posisinya.
              Keterangan arahan float
              float dipakai biar posisi widget menjadi teratur, menyerupai teladan diatas, header float:left berarti header pada posisi kiri, dan laman(Pagelist1) dan HTML1 pada bab kanan. 
              Silahkan berkreasi, maaf kalau tutorial dari aku ini kurang jelas. Jika ada pertanyaan silakan masukan komentar dibawah, semoga bermanfaat.
              Share:

              Sunday, February 11, 2018

              Cara Menciptakan Gambar Tutorial

              Tips dan Trik kali ini ihwal cara menciptakan gambar tutorial. Biasanya dipakai sebagai penambah klarifikasi dari artikel yang kita buat. Gambar dapat kita ambil dari halaman web atau dari layar komputer kita sendiri. Untuk lebih jelasnya ihwal cara gampang mengambil serta memotong gambar yang akan dipakai sebagai gambar tutorial. Ikuti langkah2 dibawah ini.
              1. Bukalah layar yang akan dijadikan gambar.
              2. Selanjutnya tekan Ctrl kemudian tekan Printscreen/PrtscrSysrq yang ada dikeyboard.
              3. Lalu buka jadwal Paint yang ada dikomputer kita.
              4. Di jadwal Paint kita klik edit di hidangan atas, dan pilih Paste.
              5. Setelah itu beri tanda kotak memakai Select pada gambar yang akan diambil, kemudian Cut gambar tersebut.
              6. Langkah selanjutnya, buka New di paint, kemudian Pastekan gambar yang di Cut tadi. 
              7. Lalu Save gambar dengan Save As Type JPG. Seperti gambar dibawah ini.
              8.  Tips dan Trik kali ini ihwal cara menciptakan gambar tutorial Cara Membuat Gambar Tutorial
              9. Selesai.


               Tips dan Trik kali ini ihwal cara menciptakan gambar tutorial Cara Membuat Gambar Tutorial
              Contoh : Gambar Tutorial.
              Jika gambar yang ingin kita gunakan lebih kecil lagi dari gambar diatas. Kita dapat memotong/mengambil gambar memakai jadwal Microsoft Office Windows Manager. Jika dikomputer yang kau gunakan telah terinstal microsoft office, maka jadwal diatas juga niscaya ada. Berikut cara menggunakannya:

              1. Klik Kanan pada gambar yang akan dipotong.
              2. Lalu pilih Open With > Microsoft Office Windows Manager.
              3.  Tips dan Trik kali ini ihwal cara menciptakan gambar tutorial Cara Membuat Gambar Tutorial
              4. Selanjutnya klik Picture pada hidangan atas. Dan klik Crop.
              5. Setelah itu Crop gambar dengan ukuran yang kita inginkan.
              6. Terakhir save. Selesai.

                 Tips dan Trik kali ini ihwal cara menciptakan gambar tutorial Cara Membuat Gambar Tutorial
                Contoh: Gambar Tutorial yang sudah dipotong.
                  Itulah sedikit tips dan trik ihwal cara menciptakan gambar tutorial. Silakan baca juga artikel lainnya yang berafiliasi dengan gambar, menyerupai cara menciptakan icon untuk blog. Semoga Bermanfaat.
                  Share:

                  Saturday, February 10, 2018

                  Cara Menciptakan Icon Untuk Website

                   Icon biasanya digukan untuk memperjelas judul hidangan Cara Membuat Icon Untuk Website
                  Cara buat Icon web atau juga blogger. Icon biasanya digukan untuk memperjelas judul menu, menyerupai home, profil, sitemap dan lain2. Dan letaknya berada disamping kanan atau kiri dari tulisan. Icon berkhasiat biar pengunjung lebih gampang untuk melihat hidangan yang ada diwebsite kita.
                  Disini aku akan beri rujukan gampang menciptakan icon web memakai foto kita sendiri diphotoshop.

                  Untuk lebih jelasnya. Ikuti langkah-langkah dibawah ini.

                   Icon biasanya digukan untuk memperjelas judul hidangan Cara Membuat Icon Untuk Website

                    1. Buka Photoshop.
                    2. Buka Foto yang akan dijadikan Icon.
                    3. Setelah itu klik tanda Crop yang berada disebelah kiri.



                     Icon biasanya digukan untuk memperjelas judul hidangan Cara Membuat Icon Untuk Website
                    4. Dan isi colom width:128 dan height 128. Ini bertujuan biar ukuran tinggi dan lebar crop gambar sama. Dan memudahkan kita nantinya untuk merubah ukuran image ke ukuran yang lebih kecil, tanpa merubah bentuk gambar.

                    5. Selanjutnya Crop gambar, dan ratakan kotak crop untuk gambar yang akan diambil. Seperti gambar dibawah ini. Dan tekan tanda centang hijau diatas bar, untuk menuntaskan crop/pemotongan.


                       Icon biasanya digukan untuk memperjelas judul hidangan Cara Membuat Icon Untuk Website


                        6. Setelah itu klik tanda image yang ada diatas kafe dan klik image size.

                        Maka akan terbuka halaman gres pengaturan Pixel Dimensions dan Document Size.



                         Icon biasanya digukan untuk memperjelas judul hidangan Cara Membuat Icon Untuk Website
                          7. Selanjutnya, ganti ukuran Pixel Dimensions menjadi 32 x 32, ukuran standar Icon yang biasa dipakai untuk website.

                          Document size tidak perlu diganti, alasannya ialah document size mengikuti perubahan dari ukuran pixel dimensions. Perhatikan juga Constrain Proportions tidak perlu dicentang.

                          8. Terakhir Klik Ok, Lalu Save Gambar. Selesai.



                           Icon biasanya digukan untuk memperjelas judul hidangan Cara Membuat Icon Untuk WebsiteContoh icon yang sudah jadi dengan ukuran 32 x 32 Pixels.
                          Gambar tetap sama, hanya saja ukurannya yang berbeda. Saran saya, bila ingin memakai icon di website anda, gunakanlah icon dengan ukuran yang sama, biar blog terlihat lebih rapi. Dibawah ini ialah beberapa ukuran Icon yang biasa dipakai diwebsite.

                          • 16x16
                          • 32x32
                          • 48x48
                          • 64x64
                          • 128x128

                          Setelah menciptakan icon, silakan baca artikel cara menciptakan hidangan dengan gambar dan juga mengganti goresan pena beranda, posting usang baru  dengan gambar atau icon, untuk mulai mencoba memasang icon gambar anda ke hidangan blog. Itulah sedikit tips trik yang sanggup aku bagikan kali ini yaitu perihal cara menciptakan icon untuk website, blogger dan juga web lainnya. Semoga Bermanfaat.
                          Share:

                          Wednesday, February 7, 2018

                          Gambar Dengan Background Transparan

                          Cara menciptakan gambar dengan background transparan memakai photoshop, yang berkhasiat untuk pembuatan icon dan juga penggunaan gambar di halaman blog. Agar gambar yang akan kita gunakan diblog, tetap transaparan, maka format gambar, harus diubah menjadi PNG, sebab bila kita memakai JPG maka background gambar akan menjadi putih. Walaupun gambar sudah kita edit dengan background transparan di photoshop.

                          Untuk lebih jelasnya wacana cara menciptakan gambar dengan background transparan, silakan ikuti langkah-langkah dibawah ini.

                           Cara menciptakan gambar dengan background transparan memakai photoshop Gambar Dengan Background Transparan
                          Gambar.1. Backround Transparan



                          1. Bukalah gambar yang akan diedit backgroundnya. Klik Magic Wand Tool, untuk menyeleksi background yang akan dihapus.
                          Contoh: Gambar dalam format JPG.






                           Cara menciptakan gambar dengan background transparan memakai photoshop Gambar Dengan Background Transparan
                          Gambar 2. kiri(cara dupliacte layer) dan kanan (duplicate gambar)
                          2. Selanjutnya, buat duplicate gambar. Klik Background, kemudian klik kanan, pilih Duplicate Layer.

                          3. Maka tampilannya layernya akan menjadi menyerupai gambar disamping.
                          • Bakcground(gambar asli). 
                          • Background Copy(duplicate gambar).

                          4. Sekarang Klik Background, dan klik delete pada belahan bawah yang diberi tanda lingkaran merah.


                           Cara menciptakan gambar dengan background transparan memakai photoshop Gambar Dengan Background Transparan
                          Gambar 3. Background Copy yang tersisa




                          5. Setelah di delete, maka yang tersisa ialah Background Copy saja, menyerupai gambar disamping.







                           Cara menciptakan gambar dengan background transparan memakai photoshop Gambar Dengan Background Transparan
                          Gambar. 4. delete background gambar


                          6. Setelah itu pribadi ke gambar, delete backgroundnya. Dan save, dalam format PNG. Selesai.

                          Dengan men-save gambar ke PNG, background gambar tetap akan transparant, berbeda bila disave dalam format JPG, maka background gambar akan menjadi putih. 






                           Cara menciptakan gambar dengan background transparan memakai photoshop Gambar Dengan Background Transparan
                          Gambar.5. Cotoh gambar

                          Hasil gambar dengan background Transparant.







                           Cara menciptakan gambar dengan background transparan memakai photoshop Gambar Dengan Background Transparan
                          Gambar.6. Contoh penggunaan gambar transparant di blog.
                          Atau yang satu ini, teladan penggunaan gambar dengan background tranparant yang aku gunakan di blog.


                          Gambar ini letaknya pada belahan header, dan header aku beri warna background biru, sehingga background gambar juga berwarna biru, berbeda bila gambar disave dalam format JPG, backgorundnya gambarnya akan putih, jadi tidak sesuai dengan warna header yang aku gunakan.


                          Itulah sedikit tips dan trik wacana menciptakan gambar dengan background transparan, sanggup kita gunakan juga untuk pembuatan icon di blog dengan background transaparant.


                          Semoga artikel diatas sanggup bermanfaat untuk anda.
                          Share:

                          Tuesday, February 6, 2018

                          Tips Dan Trik Menulis Di Blog

                          Sebelumnya saya sudah memperlihatkan cara menulis blog dengan memasukan gambar dan juga kotak script, ditengah-tengah Numbered list dan Bullet list. Dan kali ini perihal Tips dan trik menulis di blog memakai akar quadrat/pangkat atas, pangkat bawah, keterangan goresan pena ketika disentuh mouse dan juga garis pemisah antar paragraf.

                          Sama ibarat artikel sebelumnya, kita akan menulis blog dengan mengedit kalimat artikel, pada bab HTML nya. Untuk lebih jelasnya, silakan ikuti beberapa cara penggunaan isyarat dibawah ini, untuk menambah pilihan kita dalam menulis blog.

                          Cara menuliskan akar/quadrat atau pangkat diblog, contoh: 42 dan CO2.
                          • Membuat pangkat atas, tulislah dibagian HTML 4<sup>2</sup> maka kesannya akan menjadi ibarat ini. 42.
                          • Untuk Pangkat Bawah, tulislah dibagian HTML  CO<sub>2</sub> kesannya CO2.

                          Cara menciptakan Keterangan goresan pena ketika disentuh Mouse. Contoh: Arahkan mouse ke goresan pena ini, Blogger
                          • Buatlah di bab HTML <abbr title="Tips dan Trik Menulis di Blog ">Blogger </abbr> maka kesannya akan ibarat contoh: Blogger
                          • Atau tulis ibarat ini,  <acronym title="Tips dan Trik Menulis di Blog ">Blogger </acronym> maka kesannya juga akan ibarat teladan Blogger

                          Cara menciptakan garis bawah pemisah antar kalimat. Masukan isyarat <hr /> pada kalimat yang akan dipisah.
                          Contoh Penulisan di HTML:

                          SATU<br />
                          <hr />
                          DUA<br />

                          Maka kesannya akan ibarat ini dibagian Compose.

                          SATU

                          DUA

                            Sebenarnya masih banyak lagi cara yang sanggup kita lakukan dalam menulis blog, tapi disini yang saya tuliskan ialah beberapa teladan yang gampang untuk diingat saja dan mungkin akan sering kita gunakan. Silakan dicoba cara2 diatas, sebagai suplemen pilihan dalam menulis blog anda. Semoga Bermanfaat.
                            Share:

                            Sunday, February 4, 2018

                            Cara Memasang Scroll Di Kotak Komentar Blog

                            Cara Memasang Scroll di Kotak Komentar Blog. Silakan lihat teladan gambar dibawah ini:

                            Cara Memasang Scroll di Kotak Komentar Blog Cara Memasang Scroll di Kotak Komentar Blog

                            Untuk lebih jelasnya ihwal cara memasang scroll di kotak komentar blog. Ikuti langkah-langkah dibawah ini.
                            1. Login Ke Blogger, Dari halaman Dasbor pilih pengaturan Template.
                            2. Klik Edit HTML dan cari arahan <div class='comments' id='comments'>
                            3. Setelah ketemu, ganti arahan tersebut dengan arahan dibawah ini.
                            4. <div class='comments' id='comments' style='max-height:960px;overflow:auto;'>
                            5. Karena arahan <div class='comments' id='comments'> ada 2 ditemplate. Ganti kedua2 nya dengan arahan diatas. 
                            6. Selanjutnya save template, selesai.
                            Keterangan Kode:  max-height:960px untuk mengatur tinggi kotak komentar yang akan ditampilkan. Dan overflow:auto; ini arahan scroll nya,  scroll akan muncul ketika kotak komentar sudah melebihi max-height yang sudah kita atur.
                            Kotak scroll diatas berfungsi untuk mempersingkat tampilan komentar blog. Ketika artikel kita sudah memiliki komentar yang banyak, maka komentar yang akan terlihat pertama kali hanya sebatas dari tinggi kotak yang telah kita atur. Pada dikala discroll kebawah, maka komentar lain akan muncul, dan komentar2 yang pertama akan disembunyikan. Jika di scroll lagi ke atas, maka komentar yang disembunyikan tadi akan muncul kembali, jadi semua komentar tetap ada, hanya tampilannya saja yang kita persingkat.

                            Dengan memasang kotak scroll di kotak komentar blog, maka loading blog akan lebih cepat, bila dibandingkan harus membuka semua komentar2 yang ada pada suatu artikel. Jika artikel kita belum ada komentar, maka scroll pun tidak akan terlihat. Scroll hanya akan muncul ketika komentar di artikel kita sudah banyak, atau sudah melebihi tinggi kotak komentar, menyerupai klarifikasi aku di keterangan kode.

                            Itulah sedikit tips dan trik ihwal cara memasang scroll di kotak komentar blog, silakan baca tips dan trik lainnya yang sanggup kita gunakan diblogspot, menyerupai cara mempercepat loading blog biar lebih gampang untuk dibuka, atau cara menuliskan pangkat di blog menyerupai ini 28 dan artikel lain2nya.  
                            Semoga sanggup bermanfaat untuk anda.
                              Share:

                              Friday, February 2, 2018

                              Cara Upload Dan Ambil Url Gambar

                              Cara Upload Gambar Dan Ambil URL Gambar
                              1. Buatlah Entri Baru. Beri Judul, Dan Jangan dipublikasikan, cukup simpan di Draf Saja.
                              2. Selanjutnya Upload gambar/icon yang kau inginkan.
                              3. Cara Upload Gambar Dan Ambil URL Gambar  Cara upload dan ambil url gambar
                              4. Setelah di Upload, klik kanan gambar tersebut, dan pilih Copy Link Location. Seperti rujukan gambar dibawah ini.
                              5. Cara Upload Gambar Dan Ambil URL Gambar  Cara upload dan ambil url gambar
                              6. Setelah itu gres pastekan di format gambar background:url("Link Url Blog kamu") atau <img src='URL BLOG KAMU'/>. Contoh URL Gambar:
                              7. http://2.bp.blogspot.com/-EKEch0W4JJY/UijYA0jK_pI/AAAAAAAAAq8/GuTXOk_ON6c/s1600/Fandra+Juani.jpg

                              8. Selesai.
                              Dengan memakai cara diatas, kita sanggup upload gambar yang kita buat sendiri ke blog dengan mudah, kemudian mengambil URL nya untuk dipakai di blog. Contoh penggunaan URL gambar di blog.
                              1. Gambar disamping judul posting.
                              2. Icon disetiap judul widget blog.
                              3. Background dihalaman posting.
                              4. Gambar Bentuk Bulat. 
                              5. Menu dengan gambar disampingnya.
                              6. Mengganti judul blog dengan gambar.
                              Itulah sedikit tips dan trik wacana cara upload gambar dan mengambil url dari gambar untuk dipakai di blog. Semoga sanggup Bermanfaat untuk anda.
                              Share:

                              Tuesday, January 30, 2018

                              Cara Mempercepat Loading Blog Lanjutan

                              Untuk mempercepat loading blog pertama kita harus test kecepatan blog kita. Dengan cara mengunjungi situs http://gtmetrix.com/ atau https://developers.google.com/speed/pagespeed/insights dan lihat berapa skor kecepatan blog yang kalian dapatkan dari situs tersebut. Selanjutnya, ikuti langkah2 dibawah ini.
                              Menambahkan attribute width dan height.
                              Untuk bab posting, jikalau mengatur gambar ke small, medium, large atau x- large. Maka otomatis gambar itu sudah ada attribute width dan height. Jika Original attribute width dan height belum ada. Begitu juga dengan gambar yang kita masukan pada bab blog lainnya. Seperti header, sidebar, footer, widget dan lain-lainnya. Contoh penambahan isyarat attribute width dan height:
                              1. Untuk isyarat HTML
                              2. <img src='https://lh5.googleusercontent.com/-LeOgiup3fqM/Ul7UfgCMxSI/AAAAAAAAA9w/pK-pvuyLHtg/s128/fandra-juani.jpg' width='32' height='32' />

                              3. Untuk isyarat CSS width:70px;height:70px;
                                Silakan tambahkan attribute width dan height disetiap gambar yang anda gunakan diblog.
                                  Merubah ukuran orisinil dari sebuah gambar.
                                  Contoh: Ukuran orisinil dari sebuah gambar ialah 400x800. Lalu kita upload ke posting blog, dan kita perkecil gambarnya, dengan pilihan Small, sehingga ukuran gambar menjadi 100x200. Itu berarti ukuran gambar yang kita gunakan hanya 100x200.

                                  Agar loading blog lebih cepat, kita ubah dulu ukuran orisinil gambarnya dikomputer, dari 400x800 menjadi 100x200, sesudah itu gres lah kita upload lagi ke blog, dan gantikan gambar sebelumnya dengan gambar baru. Makara intinya, upload lah gambar dengan ukuran yang seperlunya. Maka loading blog akan jauh lebih cepat.
                                  Mengganti server gambar blogger dengan google.
                                  1. Buatlah entri baru, kemudian masukan gambar ke posting.
                                  2. Selanjutnya buka https://picasaweb.google.com/ di tab baru. Klik goresan pena di sini. Jika ada gambar ibarat dibawah ini.
                                  3.  Untuk mempercepat loading blog pertama kita harus test kecepatan blog kita Cara mempercepat loading blog lanjutan
                                  4. Setelah terbuka, pilih Folder sesuai dengan nama yang anda gunakan di google.
                                  5. Buka folder tersebut dan cari gambar yang sesuai dengan gambar yang gres saja anda masukan ke posting tadi.
                                  6. Lalu klik gambar tersebut, sesudah terbuka. Ambil URL nya, caranya klik kanan digambar, kemudian klik copy image location.  
                                  7. Setelaah itu kembali ke posting blog tadi, dan klik pada bab HTML(disebelah compose).
                                  8. Ganti URL gambar blogspot dengan url gambar dari google. Contoh:
                                  9. <div class="separator" style="clear: both; text-align: center;">
                                    <a href="http://2.bp.blogspot.com/-I9l6jX4G52E/UnH29sEX2uI/AAAAAAAABIU/q8hjMf1927g/s1600/loading.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
                                    <img border="0" src="http://2.bp.blogspot.com/-I9l6jX4G52E/UnH29sEX2uI/AAAAAAAABIU/q8hjMf1927g/s1600/loading.jpg" /></a></div>

                                    URL yang berwarna hitam diatas. Ganti dengan URL dari picasa web google. Contoh:

                                    <div class="separator" style="clear: both; text-align: center;">
                                    <a href="https://lh3.googleusercontent.com/-I9l6jX4G52E/UnH29sEX2uI/AAAAAAAABIY/KSkU5g_QnZE/s300/loading.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
                                    <img border="0" src="https://lh3.googleusercontent.com/-I9l6jX4G52E/UnH29sEX2uI/AAAAAAAABIY/KSkU5g_QnZE/s300/loading.jpg" /></a></div>
                                  10. Selesai.
                                  Setiap gambar yang kita masukan ke posting blog, maka otomatis gambar tersebut juga ada di picasa web album. Kenapa URL dari blogger harus diganti dengan URL gambar dari google. Karena server google lebih cepat dari blogger. Sehingga gambar akan lebih cepat dibuka.
                                    Setelah melaksanakan 3 cara diatas, coba test lagi kecepatan blog anda ke situs http://gtmetrix.com/ atau https://developers.google.com/speed/pagespeed/insights dan lihat berapa perubahan skor kecepatan blog yang kalian dapatkan. Contoh: Score kecepatan loading dari blog aku di situs http://gtmetrix.com/.

                                     Untuk mempercepat loading blog pertama kita harus test kecepatan blog kita Cara mempercepat loading blog lanjutan

                                    Cara mempercepat loading blog ini, merupakan lanjutan dari artikel sebelumnya, yaitu ihwal tips dan trik mempercepat loading blog. Semoga sanggup bermanfaat untuk anda.
                                    Share:

                                    Sunday, January 21, 2018

                                    Cara Menciptakan Icon Sendiri Dengan Mudah

                                    Tutorial kali ini aku akan coba bagikan tips dan trik wacana cara menciptakan icon sendiri dengan mudah, memakai jadwal microsoft office PowerPoint. Icon atau lambang gambar biasanya dipakai untuk logo website atau blog, ada juga untuk icon disebelah goresan pena menu, bahkan dipakai juga sebagai menu.

                                    Contohnya ibarat gambar dibawah ini:

                                     Tutorial kali ini aku akan coba bagikan tips dan trik wacana cara menciptakan icon sendiri  Cara menciptakan icon sendiri dengan mudah
                                     Tutorial kali ini aku akan coba bagikan tips dan trik wacana cara menciptakan icon sendiri  Cara menciptakan icon sendiri dengan mudah
                                     Tutorial kali ini aku akan coba bagikan tips dan trik wacana cara menciptakan icon sendiri  Cara menciptakan icon sendiri dengan mudah






                                    Gambar diatas ialah hasil dari pembuatan icon di PowerPoint, yang disave dalam format PNG, biar background icon tetap transparant. Untuk lebih jelasnya wacana cara pembuatan icon di microsoft PowerPoint. Ikuti langkah - langkah dibawah ini.
                                    1. Silakan buka jadwal PowerPoint. Lalu pilih bab Insert.
                                    2. Selanjutnya pilih goresan pena Shape dan pilih bentuk gambar yang kita inginkan.
                                    3. Setelah gambar nya sudah ada, klik gambar tersebut dan pilih Format dibagian atas kafetaria powerpoint.
                                    4. Lalu edit gambar itu sesuai dengan yang kita inginkan.
                                    5. Untuk menyimpan gambar, klik Kanan gambar tersebut dan pilih Save as picture kemudian save dalam format PNG. Selesai.
                                    Contoh gambar icon yang aku buat. Icon pertama memakai satu gambar awan dan Icon kedua memakai 2 gambar gambar awan dan matahari.

                                     Tutorial kali ini aku akan coba bagikan tips dan trik wacana cara menciptakan icon sendiri  Cara menciptakan icon sendiri dengan mudah

                                     Tutorial kali ini aku akan coba bagikan tips dan trik wacana cara menciptakan icon sendiri  Cara menciptakan icon sendiri dengan mudah




                                    Untuk menciptakan icon dengan 2 gambar, silakan buat 2 gambar di powerpoint, kemudian blok ke 2 gambar sehabis itu gres Save As Picture. Selesai. Jika kau ingin memakai icon dengan ukuran yang sama, kau sanggup gunakan photoshop, caranya sanggup dilihat di artikel cara menciptakan icon untuk website.

                                    Untuk mencoba hasil gambar yang telah kau buat diblog. Kamu sanggup baca artikel mengganti goresan pena beranda posting usang gres yang letaknya dibawah posting dengan gambar. Tapi sebelumnya upload terlebih dahulu gambar kau ke blog dan ambil urlnya, caranya baca di cara upload dan ambil url gambar.

                                    Itulah sedikit tips dan trik dari aku dalam menciptakan icon sendiri dengan gampang memakai jadwal microsoft office PowerPoint yang sanggup dipakai untuk mendesain icon blog atau website anda sendiri. Semoga sanggup bermanfaat untuk anda.

                                    Share:

                                    Friday, January 19, 2018

                                    Cara Menciptakan Tabel Diblog

                                    Cara menciptakan tabel diblog. Akan kita mulai dari Tabel sederhana terlebih dahulu.
                                    Silakan buka entri baru, kemudian klik pada bab HTML disebelah Compose.
                                    Selanjutnya ketikan instruksi berikut ini.
                                    <table>
                                    <tr>
                                    <td>1</td>
                                    <td>2</td>
                                    <td>3</td>
                                    </tr>
                                    </table>
                                    Setelah itu klik bab Compose, Maka kesannya akan menjadi menyerupai ini.
                                    123
                                    Selanjutnya menciptakan tabel 2 baris
                                    <table>
                                    <tr>
                                    <td>1</td>
                                    <td>2</td>
                                    <td>3</td>
                                    </tr>

                                    <tr>
                                    <td>4</td>
                                    <td>5</td>
                                    <td>6</td>
                                    </tr>
                                    </table>
                                    Hasilnya
                                    123
                                    456
                                    Dari tumpuan diatas, kita sanggup melihat bahwa instruksi tr dipakai untuk menciptakan tabel ke bawah, sedangkan instruksi td dipakai untuk tabel kesamping. Kaprikornus jikalau ingin menambahkan jumlah tabel, silakan tambahkan instruksi tr dan instruksi td sesuai dengan keinginan.
                                    Selanjutnya menciptakan Tabel dengan warna background, lebar tabel serta warna goresan pena dengan cara menambahkan instruksi bgcolor="red" border="1" style="color: white; width: 400px;" pada bab <table>. Contoh:
                                    <table bgcolor="red" border="1" style="color:white;width:400px;">
                                    <tr>
                                    <td>1</td>
                                    <td>2</td>
                                    <td>3</td>
                                    </tr>
                                    <tr>
                                    <td>4</td>
                                    <td>5</td>
                                    <td>6</td>
                                    </tr>
                                    </table>
                                    Hasilnya
                                    123
                                    456
                                    Sekarang kita coba memakai tabel dengan judul diatasnya, dan juga mengatur lebar disetiap judul tabel. Tambahkan instruksi <th>Judul</th> Contoh:
                                    <table bgcolor="red" border="1" style="color: white;">
                                    <tbody>
                                    <tr>
                                    <th width="40">No</th>
                                    <th width="400">Nama</th>
                                    <th width="400">Kelas</th>
                                    </tr>
                                    <tr>
                                    <td>1</td>
                                    <td>Fandra Juani</td>
                                    <td>3</td>
                                    </tr>
                                    <tr>
                                    <td>2</td>
                                    <td>Juani Fandra</td>
                                    <td>6</td>
                                    </tr>
                                    </table>
                                    Hasilnya
                                    NoNamaKelas
                                    1Fandra Juani3
                                    2Juani Fandra6
                                    Bisa juga dengan memakai background yang berbeda. Contoh:
                                    <table bgcolor="white" border="1" style="color: black;">
                                    <tr>
                                    <th bgcolor="blue" width="40">No</th>
                                    <th bgcolor="green" width="400">Nama</th>
                                    <th bgcolor="red" width="400">Kelas</th>
                                    </tr>
                                    <tr>
                                    <td>1</td>
                                    <td>Fandra Juani</td>
                                    <td>3</td>
                                    </tr>
                                    <tr>
                                    <td>2</td>
                                    <td>Juani Fandra</td>
                                    <td>6</td>
                                    </tr>
                                    </table>
                                    Hasilnya
                                    NoNamaKelas
                                    1Fandra Juani3
                                    2Juani Fandra6

                                    Untuk mengatur posisi goresan pena kau sanggup gunakan Tool Alignment yang ada dipilihan tool pada ketika kita menulis di entri. Sebenarnya masih banyak instruksi dengan fungsi lain yang sanggup dipakai untuk menciptakan tabel diblog, insyaallah nanti akan aku coba buat diartikel lainnya. Silakan dicoba sendiri dan Semoga sanggup bermanfaat untuk anda.
                                    Share:

                                    Wednesday, January 17, 2018

                                    Cara Menciptakan Link Terbuka Di Tab Baru

                                    Kali ini aku akan coba bagikan isyarat HTML yang berfungsi untuk menciptakan semua link yang ada di blog terbuka ditab gres pada dikala diklik. Dengan begitu pengunjung blog akan lebih gampang untuk membuka link2 yang ada diblog kita, jadi tidak perlu lagi klik kanan open link in new tab.

                                    Link ialah alamat url dari suatu halaman website, misalnya menyerupai ini fandrajuani.blogspot.com. Langsung saja kebagian inti, cara menciptakan link terbuka ditab baru. Ikuti langkah-langkah dibawah ini.
                                    1. Login ke blogger, dari halaman dasbor pilih pengaturan template.
                                    2. Dan klik Edit HTML, kemudian cari isyarat </head> gunakan Ctrl + F untuk memudahkan pencarian.
                                    3. Setelah ketemu, masukan isyarat berikut ini diatasnya.
                                    4. <base target='_blank'/>
                                    5. Terakhir, save template. Selesai.
                                    Mudahkan, dengan menambahkan isyarat <base target='_blank'/>, maka seluruh link yang ada di blog kita akan terbuka dihalaman atau tab gres ketika diklik. Selain untuk memudahkan pengunjung untuk membuka setiap link yang ada di blog, isyarat ini juga akan meningkatkan total tayangan laman dari blog kita. 

                                    Atau bila ingin menciptakan link terbuka ditab baru, tapi tidak disemua link di blog. Kamu dapat tambahkan isyarat target="_blank" atau target='_blank' di isyarat link HTML kamu. Contoh:
                                    <a href="http://fandrajuani.blogspot.com/p/blog-page_25.html" target="_blank" title="Cara menciptakan link terbuka di tab baru">Profil</a>
                                    Hasilnya: Silakan klik link ini Profil

                                    Silakan dibaca juga artikel2 aku yang lainnya seputar seo menyerupai artikel ihwal mencar ilmu seo untuk blogger pemula, tips dan mempercepat loading blog dan juga cara mempercepat loading blog lanjutan. Sedikit info seo kepanjangannya search engine optimization, fungsinya supaya blog kita dapat masuk di halaman google search, jadi ketika ada yang mencari artikel yang berkaitan dengan judul artikel yang telah kita buat. 

                                    Maka blog kita akan muncul, walaupun tidak dihalaman pertama, dapat jadi dihalaman kedua dan seterusnya. Seiring waktu berjalan, bila artikel kita sudah sering dikunjungi. Maka nantinya akan masuk kehalaman pertama dari google search, sesuai dengan kata kunci yang dimasukan orang ke dalam mesin pencari google search. Terima kasih telah berkunjung dan semoga artikel diatas dapat bermanfaat untuk anda.
                                      Share:

                                      Cara Membatasi Jumlah Artikel Di Label

                                      Cara membatasi jumlah artikel di label atau kategori. Membatasi yang berarti akan ada batas jumlah artikel yang akan kita tampilkan. Seperti halnya halaman awal blog, kita sanggup membatasi jumlah posting menjadi 4 atau 5 sesuai dengan yang kita inginkan. Dengan cara mengatur jumlahnya di pengaturan Tata Letak bab Posting.


                                      Bagaimana dengan halaman Label. Normalnya bila kita membuka halaman label, maka semua artikel dengan label yang sama akan terbuka. Tapi dengan menambahkan beberapa arahan di URL dari label atau kategori kita sanggup mengatur tampilan jumlahnya.

                                      Dari link diatas, anda akan melihat artikel2 dengan label desain blog, jumlahnya ada 8, dan dibawahnya ada page navigation yang bertuliskan beranda dan posting lama. Jika posting usang diklik maka akan terbuka artikel2 lainnya yang berlabel desain blog.

                                      Diblog ini jumlah artikel dengan label desain blog sudah mencapai 50an lebih, kalau tampilannya tidak dibatasi, maka artikel yang akan tampil ketika dibuka sekitar 20an, diatur oleh blogger sendiri. Dan niscaya usang membukanya. Contohnya sanggup di klik di link ini Desain blog tanpa pengaturan batas jumlah tampilan. Langsung saja, Cara membatasi jumlah artikel di Label silakan ikuti langkah-langkah dibawah ini.
                                      1. Login ke blogger, kemudian buka halaman blog kamu.
                                      2. Lalu klik salah satu label yang kau miliki. Lalu copi URL di address kafe dan pastekan ke Notepad.
                                      3. Selanjutnya tambahkan arahan ?max-results=8 dibelakangnya. Contoh:
                                      4. http://fandrajuani.blogspot.com/search/label/Desain%20Blog

                                        dan tambahkan arahan ?max-results=8 akhirnya ibarat dibawah ini.

                                        http://fandrajuani.blogspot.com/search/label/Desain%20Blog?max-results=8
                                      5. Sekarang, cara memasangnya di blog. misalnya di sajian laman. Silakan ke pengaturan Laman > Laman Baru > Alamat Web > kemudian masukan Alamat web (URL) dan beri judul sesuai dengan nama label. Save, Selesai.
                                      Ganti Kode 8 dari arahan ?max-results=8 dengan jumlah yang diinginkan, misalkan 5 atau 4. Silakan diatur sendiri sesuai dengan keinginan. Itulah sedikti tips trik wacana Cara membatasi jumlah artikel di Label. Semoga sanggup bermanfaat untuk anda.
                                        Share:

                                        Tuesday, January 16, 2018

                                        Cara Mengatur Spasi Goresan Pena Di Blog

                                        Tips dan Trik kali ini ialah ihwal cara mengatur spasi goresan pena di blog. Spasi atau jarak kosong antara kalimat pada baris atas dan juga baris bawah. Dan juga jarak kosong antara karakter satu dengan yang lainnya. Tujuannya supaya goresan pena diblog terlihat lebih rapi, dan lebih gampang untuk dibaca.

                                        Contoh spasi atau jarak kosong antar baris kalimat:
                                        Contoh jarak spasi antar baris
                                        Terlihat jauh jarak antara goresan pena ini dengan goresan pena atas.
                                        Dan teladan spasi atau jarak kosong antar huruf.
                                        Contoh jarak spasi antar huruf
                                        Jarak antara karakter satu dengan karakter yang lain.

                                        Dari teladan diatas sudah terang kan, perbedaan antara spasi atau jarak kosong antar baris kalimat dan antar huruf. Berikut ini ialah teladan penerapan pengaturan spasi goresan pena pada bab posting blog. Ikuti langkah-langkah dibawah ini.
                                        1. Silakan login ke blogger, kemudian pada halaman dasbor pilih pengaturan Template.
                                        2. Lalu klik edit HTML dan cari instruksi ]]></b:skin> dan masukan instruksi berikut ini diatasnya.
                                        3. .post-body {
                                          line-height:1.8em;
                                          letter-spacing: 0.1px;
                                          }
                                        4. Save template, selesai.
                                        Keterangan instruksi diatas.
                                        • .post-body { untuk mengatur goresan pena di halaman posting blog
                                        • line-height:1.8em; untuk mengatur spasi antar baris kalimat
                                        • letter-spacing: 0.1px; untuk mengatur spasi antar huruf
                                        Silakan diatur sendiri sesuai dengan harapan anda, untuk menambahkan atau mengurangi jarak antar baris ganti  nilai line-height:1.8em; contoh: 2.8em dan untuk spasti antar karakter ganti nilai letter-spacing: 0.1px; contoh: 1px;

                                        Kalau menyerupai teladan diatas. itu instruksi spasi antar barisnya aku atur menjadi 2.8em dan spasti antar hurufnya 5px. Untuk pengaturan keseluruhan goresan pena dari halaman posting artikel blog aku ini. aku atur spasi antar barisnya menjadi line-height:1.6em; dan untuk spasti antar hurufnya letter-spacing: 0.1px;. Menurut aku sudah cukup yummy dilihat goresan pena di blog aku ini dengan pengaturan nilai 1.6em untuk baris kalimat dan 0.1 untuk spasi huruf.

                                        Silakan dibaca juga artikel2 aku yang lainnya, menyerupai menciptakan pangkat atas12 dan bawah90 di artikel tips dan trik menulis di blog. Dan juga artikel aku yang lainnya. Terima kasih telah berkunjung ke blog saya, dan semoga artikel diatas dapat bermanfaat untuk anda.
                                          Share:

                                          Monday, January 15, 2018

                                          Menciptakan Widget Hanya Tampil Dihalaman Tertentu

                                          Tips dan trik kali ini aku akan bagikan artikel wacana cara menciptakan widget hanya tampilan dihalaman tertentu di blog. Ada 4 cara yang akan aku bagikan, pertama menciptakan widget hanya tampil dihalaman awal blog saja. Kedua, menciptakan widget hanya tampil dihalaman posting.

                                          Ketiga, menampilkan widget dihalaman awal blog dan juga dihalaman Label Blog. Dan yang keempat yakni Menampilkan widget hanya tampil pada halaman URL yang ditentukan. Sebenarnya 4 cara tersebut memakai cara yang sama, hanya saja aba-aba yang dipakai yang berbeda. Berikut caranya:
                                           Tips dan trik kali ini aku akan bagikan artikel wacana cara menciptakan widget hanya tampil  Membuat widget hanya tampil dihalaman tertentu
                                          Disini widget yang akan dijadikan pola yakni widget Follow by email.

                                          Pertama: Membuat widget hanya tampil/terlihat dihalaman awal blog saja

                                          1. Silakan login ke blogger, dan pilih pengaturan Template.
                                          2. Klik edit HTML dan cari aba-aba follow by email(gunakan Ctrl+f untuk memudahkan pencarian).
                                          3. <b:widget id='FollowByEmail1' locked='false' title='Follow by Email' type='FollowByEmail'>
                                          4. Setelah ketemu Tambahkan aba-aba <b:if cond='data:blog.url == data:blog.homepageUrl'> dan juga aba-aba </b:if> Contohnya:
                                          5. <b:widget id='FollowByEmail1' locked='false' title='Follow by Email' type='FollowByEmail'>
                                            <b:includable id='main'><b:if cond='data:blog.url == data:blog.homepageUrl'>
                                            <b:if cond='data:title != &quot;&quot;'><h2 class='title'><data:title/></h2></b:if>
                                            <div class='widget-content'>
                                            ...................dan kode2 panjang lainnya..........
                                            <span class='item-control blog-admin'>
                                            <b:include name='quickedit'/>
                                            </span></b:if>
                                            </b:includable>
                                            </b:widget>
                                          6. Dan kode2 panjang lainnya itu maksudnya supaya lebih pendek saja tampilannya di artikel ini. Kode aslinya lebih panjang. Setelah itu save template. Selesai.

                                          Kedua: Nah kini kebalikannya, menciptakan widget hanya tampil dihalaman posting atau artikel blog saja. Sedangkan dihalaman awal homepage blog widget tersebut akan hilang.

                                          1. Sama menyerupai cara yang pertama, hanya mengganti aba-aba <b:if cond='data:blog.url == data:blog.homepageUrl'> dengan aba-aba berikut ini.
                                          2. <b:if cond='data:blog.pageType == "item"'>
                                          3. Save template, selesai.

                                          Ketiga: Menampilkan widget dihalaman awal blog dan juga dihalaman Label Blog.

                                          1. Sama menyerupai cara yang pertama, hanya mengganti aba-aba <b:if cond='data:blog.url == data:blog.homepageUrl'> dengan aba-aba berikut ini.
                                          2. <b:if cond='data:blog.pageType != &quot;item&quot;'>
                                          3. Save template, selesai.

                                          Keempat: Menampilkan widget hanya tampil pada halaman URL yang ditentukan

                                          1. Sama menyerupai cara yang pertama, hanya mengganti aba-aba <b:if cond='data:blog.url == data:blog.homepageUrl'> dengan aba-aba berikut ini.
                                          2. <b:if cond='data:blog.url == "Ganti dengan URL Halaman disini"'>
                                          3. Save template, selesai.
                                          Silakan dicoba keempat cara diatas, dan silakan baca juga artikel aku sebelumnya wacana cara menghilangkan widget dihomepage fungsinya sama dengan cara kedua menyerupai artikel diatas, hanya caranya saja yang berbeda. Dan juga artikel wacana membuat background berbeda dihalaman berbeda diblog. Atau Menghilangkan sidebar pada halaman tertentu. Semoga artikel diatas dapat bermanfaat untuk anda.
                                          Share:

                                          Title Di Setiap Judul Posting Blog

                                          Tips trik seo kali ini saya akan coba bagikan perihal cara menambahkan title atau keterangan di setiap judul posting blog secara otomatis, saat judul posting disentuh oleh mouse. Contohnya menyerupai gambar dibawah ini.

                                           Tips trik seo kali ini saya akan coba bagikan perihal cara menambahkan title atau keteran Title di setiap judul posting blog
                                          Seperti teladan gambar diatas, goresan pena dengan warna background putih itu yaitu title atau keterangan yang akan muncul saat judul disentuh mouse. Cara membuatnya, silakan ikuti langkah-langkah dibawah ini.
                                          1. Login ke blogger, pilih pengaturan template.
                                          2. Klik edit HTML dan cari aba-aba <a expr:href='data:post.link'><data:post.title/></a>
                                          3. Setelah ketemu, tambahkan aba-aba expr:title='data:post.title' kedalamnya. Contoh:
                                          4. <a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
                                          5. Kode ini <a expr:href='data:post.link'><data:post.title/></a> biasanya ada 2 diblog, lakukan hal yang sama menyerupai langkah 3.
                                          Setelah melaksanakan cara diatas, jangan di save template dulu, alasannya yaitu masih ada aba-aba yang harus diedit. Sengaja saya pisah biar lebih gampang mengikutinya.
                                          1. Cari aba-aba <a expr:href='data:post.url'><data:post.title/></a>
                                          2. Setelah itu tambahkan aba-aba expr:title='data:post.title' kedalamnya. Contoh:
                                          3. <a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
                                          4. Kode ini <a expr:href='data:post.link'><data:post.title/></a> biasanya ada 3 diblog, lakukan hal yang sama menyerupai langkah 2.
                                          5. Nah, gres save template. Selesai.
                                          Setelah melaksanakan cara diatas, silakan lihat blog kamu. Jika  melakukannya dengan benar, insyaallah title disetiap judul posting blog akan keluar saat disentuh mouse. Sebenarnya saya juga tidak terlalu mengerti perihal seo, tapi yang saya tau disetiap website2 besar dengan pagerank tinggi menyerupai facebook, memakai title atau goresan pena keterangan di setiap URL dari halaman websitenya.

                                          Tapi banyak juga website yang tidak memakai title di url nya. Seperti google, yahoo, twitter, ya mungkin mereka tidak membutuhkan lagi cara menyerupai diatas, tanpa menambahkan titlle di setiap url nya pun, masih juga rame websitenya.

                                          Bagi saya yang masih awam perihal seo website atau blog. Tidak ada salahnya memakai title disetiap judul posting, namanya juga masih belajar. Seperti keterangan di website check seo http://chkme.com/ menyampaikan (translate:Meskipun tidak penting dan tidak dipakai untuk menghitung skor akhir, kita menganggap bahwa untuk link judul sanggup benar-benar berguna. Mencoba memperbaiki kesalahan, kalau diperlukan).

                                          Demikianlah sedikit tips trik seo dari saya perihal title di setiap judul posting blog. Dan silakan dibaca juga artikel perihal title otomatis pada link label blogger. Fungsinya sama semoga link ada titlenya, tapi pada bab label blogger. Semoga artikel diatas sanggup bermanfaat untuk anda.
                                          Share:

                                          Saturday, January 13, 2018

                                          Penyempurnaan Html Di Google Webmaster

                                          Cara penyempurnaan html blog di google webmaster, mulai dari mengatasi duplikasi deskripsi meta, deskripsi meta panjang dan deskripsi singkat meta. Seperti keterangan yang tertulis diatasnya berbunyi kinerja dan pengalaman pengguna situs anda sanggup terbantu kalau hal berikut di atasi. Seperti rujukan gambar dibawah ini.

                                           Cara penyempurnaan html blog di google webmaster Penyempurnaan html di google webmaster


                                          Mengatasi duplikasi deskripsi meta

                                          1. Silakan login ke blogger, dari halaman dasbor pilih pengaturan Setelan.
                                          2. Lalu pilih Preferensi penelusuran, dan klik edit pada bab Tag tajuk robot khusus. Lalu beri tanda all pada bab beranda, tandai noindex dan noarchive pada bab laman arsip dan penelusuran. Terakhir beri tanda all di default untuk pos dan laman. Seperti gambar dibawah ini.
                                          3.  Cara penyempurnaan html blog di google webmaster Penyempurnaan html di google webmaster
                                          4. Simpan perubahan, selesai.

                                          Mengatasi Deskripsi meta panjang

                                          1. Ke pengaturan Setelan > Preferensi penelusuran > dan klik pada bab deskripsi.
                                          2. Pilih ya pada Aktifkan deskripsi penelusuran, kemudian Kosongkan isi di dalamnya. Lalu klik simpan perubahan.
                                          3.  Cara penyempurnaan html blog di google webmaster Penyempurnaan html di google webmaster
                                          4. Selanjutnya ke pengaturan template, klik edit html dan cari aba-aba <head>
                                          5. Lalu masukan meta deskripsi kau dibawah <head>. Contoh:
                                          6. <head>
                                            <b:if cond='data:blog.url == data:blog.homepageUrl'>
                                            <meta content='Fandra Juani,Desain blog,blogger,blogspot,tutorial,cara,membuat,mengganti,merubah,modifikasi,belajar,Tips,Trik,edit template,css,html' name='keywords'/>
                                            <meta content='Fandra Juani kumpulan tutorial wacana cara desain blog sendiri di blogspot, serta tips dan trik edit template orisinil blogger.' name='description'/>
                                            </b:if>
                                          7. Save template, maka deskripsi meta panjang hanya akan ada di halaman awal blog saja, semoga tidak ada duplikasi desckripsi meta panjang. selesai.

                                          Mengatasi Deskripsi singkat meta

                                          1. Pertama, login ke blogger, kemudian kunjungi situs google webmaster.
                                          2. Dan pilih pada bab tampilan penelusuran > penyempurnaan html > kemudian klik Deskripsi meta. 
                                          3. Setelah itu akan ada halaman2 dari blog kita yang memiliki deskripsi singkat meta. Contohnya.
                                          4.  Cara penyempurnaan html blog di google webmaster Penyempurnaan html di google webmaster
                                          5. Sekarang, kembali ke halaman blogger, kemudian pilih pengaturan Post dan cari artikel yang sesuai dengan URL laman dari google webmaster. Seperti gambar diatas, judulnya cara menghapus akun google analytics.
                                          6. Setelah ketemu artikelnya, edit artikel itu, kemudian klik pada bab Deskripsi Penelusuran. Seperti gambar dibawah ini.
                                          7.  Cara penyempurnaan html blog di google webmaster Penyempurnaan html di google webmaster
                                          8. Nah disitu terlihat goresan pena yang sama dengan yang di google webmaster tadi, rujukan disini yaitu cara menghapus akun google analytics, disitulah masalahnya. Cara mengatasunya tambahkan kata di dalamnya, kira-kira 20 hingga 30 kata dari keseluruhan kalimat di deskripsi penelusuran.Klik selesai. Dan klik perbarui. Selesai.
                                          Setelah melaksanakan cara-cara diatas, untuk melihat alhasil tunggu 4 - 7 hari  atau hingga google memperbarui penyempurnaan html dari blog kita. Setelah diperbarui google, maka tampilan html yang sudah disempurnakan akan ibarat gambar dibawah ini.

                                           Cara penyempurnaan html blog di google webmaster Penyempurnaan html di google webmaster
                                          Itulah sedikit tips trik penyempurnaan html di google webmaster, yaitu dengan cara mengatasi duduk kasus dari ke tiga deskripsi meta. Semoga sanggup bermanfaat untuk anda.
                                          Share: