Rahasia Blog

Cara Membuat Halaman FansPage Facebook Untuk Blog Kita

Cara membuat halaman Fanspage faceebook

Apa itu FansPage Facebook ?

Kadang-kadang disebut sebagai "Fan Page," halaman Facebook adalah satu halaman di mana Kita dapat berbagi , berbicara mengenai topik tertentu yang Kita inginkan: selebriti, blog atau apapun keinginan hati Kita. Anggap saja sebagai tempat pertemuan satu halaman, dengan informasi, link, kotak forum pesan, RSS dan apa pun yang Kita inginkan.

Cara membuat halaman Fanspage faceebook

Ingin mempromosikan blog Kita? Maka Facebook adalah salah satu pilihan terbaik ketika datang tentang Situs Jaringan Sosial. Untuk melihat bagaimana FansPage Facebook terlihat seperti yang diinginkan , silakan kunjungi FansPage Facebook saya .
Membuat FansPage Facebook Untuk Blog Kita.

Langkah 1. Pergi ke Buat Fan Page Link di Facebook dan pilih Merk atau Produk kita.

Cara membuat halaman Fanspage faceebook

Cari "Situs web" dalam daftar drop-down dan memberikan nama Halaman (mis : nama blog Kita) di kotak di samping. Periksa "I agree to Facebook Pages Terms" kotak, kemudian klik pada tombol "Get Started".

Cara membuat halaman Fanspage faceebook

Langkah 2. Kita akan ditransfer ke halaman berikutnya - di sini Kita dapat "Unggah Gambar" untuk Fan Page atau Lewati untuk meng-upload nanti. Browse mengklik gambar Kita pada link "Upload dari komputer":

Cara membuat halaman Fanspage faceebook

Langkah 3. Masukkan situs / deskripsi blog dan alamat url. informasi ini akan muncul di laman Facebook . Setelah selesai, klik "Simpan Info".

Langkah 4. Sekarang Kita akan ditransfer ke Halaman Facebook Fan baru Kita. Untuk "Manage" informasi Kita, klik "Kelola" Tombol di sudut kanan atas halaman.

Dapatkan Shorter URL Facebook Fan Page
Fan Page URL Kita akan terlihat seperti:
https://www.facebook.com/kavt93/

Sekarang, jika Kita memiliki minimal 25 fans, Kita kemungkinan untuk mempersingkat URL facebook Kita, misalnya mengganti nama pengguna jadi nama kita.

Untuk ini, pergi ke https://www.facebook.com/username/ dan klik pada set nama pengguna untuk halaman Kita.

Cara membuat halaman Fanspage faceebook

Di sana Kita dapat memilih nama pengguna untuk halaman FansPage Kita. Hati-hati ketika Kita memilih FansPage Facebook Nama pengguna karena Kita tidak dapat mengubahnya kembali setelah itu.

Menggunakan Aplikasi Twiterfeed Untuk Berbagi Posting Blog Terbaru Kita

Jika Kita ingin secara otomatis menambah posting blog Kita ke Facebook, kita gunakan Twiterfeed Aplikasi.

Tahapannya:

1. Pergi ke http://twitterfeed.com/ : klik pada tombol “Register Now “ jika anda belum mempunyai akun. Isi kotak-kotak register nya.

2. Setelah selesai, buka email yang anda daftarkan tadi untuk mengaktifkan akun twiterfeed anda

3. Setelah itu masukkan naman blog anda dan URL blog anda,dan klik continue step untuk melanjuti tahapan ke 2

4. Selanjutnya pilih media social mana yang ingin anda hubungkan . Setelah terhubung ke media social yang dipilih klik Creat Servive.

5. Setelah proses selesai klik All Done

Kita tidak perlu khawatir jika posting Kita tidak langsung muncul pada FansPage Facebook Wall, mungkin ada beberapa keterlambatan dalam dinding mendapatkan update, seperti twiterfeed memeriksa untuk entri baru pada interval waktu yang teratur.

CSS

Menambahkan Efek Tombol Keyboard Untuk Teks di Blogger dengan CSS

Viral Comment

Bagi banyak dari kita desain dari template adalah yang paling penting, karena membuat pembaca lebih tertarik dan datang kembali ke blog kita. Ada elemen HTML dimaksudkan untuk ditambahkan tombol keyboard bernama <kbd> yang dapat ditata dengan CSS, jadi mengapa kita tidak menggunakannya untuk membuat elemen-elemen tersebut terlihat seperti tombol keyboard?

Dengan demikian, dalam tutorial ini, saya akan Menunjukkan Cara Untuk Membuat Efek Tombol Keyboard Dengan CSS. Tidak dibutuhkan gambar sehingga blog Anda akan memuat lebih cepat.

Bagaimana Menambahkan Tombol Keyboard ke Blogger

Langkah 1. Dari Blogger Dashboard , pilih blog Anda dan pergi ke Template> Edit HTML

Langkah 2. Klik di mana saja di dalam area kode, tekan tombol Ctrl + F dan cari potongan kode ini:

]]></b:skin>

Screenshot

Langkah 3: Tepat di atas ]]> </ b: skin> sisipkan gaya CSS ini:

kbd{
border:1px solid gray;
font-size:1.2em;
box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:2px 3px;
padding:1px 5px;
}

Langkah 4. Untuk menyimpan perubahan, tekan tombol perubahan Simpan.

Terakhir, kita perlu menambahkan html <kbd> tag untuk teks yang kita ingin untuk menerapkan tombol bergaya keyboard .From dashboard blogger Anda, pergi untuk membuat New Post , tulis teks yang kamu ingin

<kbd>Ctrl</kbd> + <kbd>F</kbd>

Screenshot

Ini akan membuatnya terlihat seperti ini:

Postingan Blog

Cara Membuat Tampilan Bergaris di Blogger Dengan Auto Read More

Viral Comment

tampilan bergaris beralih di bloger

Daftar postingan dalam tampilan bergaris atau tampilan daftar memberikan definisikan dengan blogger atau pemilik website dapat digunakan sebagai panduan dalam menciptakan konten. Konsep ini telah diberikan untuk pengunjung, di mana mereka dapat memiliki kontrol pada apakah atau tidak mereka ingin melihat posting dalam daftar atau tampilan bergaris. Sementara kode modifikasi kustom dibagi oleh beberapa situs blogging, dan yang lain tidak. Beberapa yang dibagikan, bagaimanapun, dapat menjadi kompleks bahkan untuk blogger sendiri, seperti JQuery.

Kabar baiknya adalah ada kode ini tersedia, Baca Auto Read More di Blogger . Melalui itu, seorang blogger dapat menambahkan dua tombol yang akan memungkinkan pengunjung untuk beralih antara tampilan kisi-kisi dan tampilan daftar, tergantung pada apa yang mereka sukai. Tombol-tombol ini, hanya terlihat pada halaman terbatas (homepage), halaman label dan halaman arsip. Meskipun demikian, itu lebih baik daripada tidak memiliki fitur ini khusus sama sekali.

Tidak seperti JQuery, Auto Read More menggunakan HTML, CSS dan JavaScript. Untuk melihat posting di tampilan daftar, dua set kode CSS ditambahkan sebagai salah satu. set ditambahkan untuk melihat posting di tampilan grid. Kombinasi lainnya dari kode yang digunakan untuk mengaktifkan dengan mudah antara tampilan, terutama di klik tombolnya.

tampilan bergaris beralih di bloger

Cara Menambahkan Tampilan Bergaris Yang Beralih di Blogger

Langkah 1. Masuk ke dashboard Blogger Anda dan pilih blog Anda, kemudian pergi ke "Template"> tekan "Edit HTML" tombol.

Langkah 2. Klik di mana saja di dalam area kode dan tekan tombol CTRL + F untuk membuka kotak pencarian. Ketik tag di bawah ini dalam kotak dan tekan Enter untuk menemukannya:

</head>

Langkah 3. Tepat di atas </ head> tag, copy dan paste gaya CSS berikut dan script:

<script type='text/javascript'>
function list_view(){
if(document.getElementsByClassName("post")) {elementArray = document.getElementsByClassName("post"); while (elementArray.length) {elementArray[0].className = "post-grid-view";}}
if(document.getElementsByClassName("post-title")) {elementArray = document.getElementsByClassName("post-title"); while (elementArray.length) {elementArray[0].className = "post-title-grid";}}
}
function grid_view(){
if(document.getElementsByClassName("post-grid-view")) {elementArray = document.getElementsByClassName("post-grid-view"); while (elementArray.length) {elementArray[0].className = "post";}}
if(document.getElementsByClassName("post-title-grid")) {elementArray = document.getElementsByClassName("post-title-grid"); while (elementArray.length) {elementArray[0].className = "post-title";}}
}
</script>
<script type='text/javascript'>
posts_no_thumb_sum = 100;
posts_thumb_sum = 350;
</script>

<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID, pURL, pTITLE){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left; margin-right: 10px;"><a href="'+ pURL +'"><img src="'+img[0].src+'" /></a></span>';
summ = posts_thumb_sum;
}

else {
imgtag = '<span class="posts-thumb" style="float:left; margin-right: 10px;"><a href="'+ pURL +'" title="'+ pTITLE+'"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv0OkwhYnZrK-C-b7IkqRiIykQy7UKDl50DTuuvU0Xa8kxE4OWTI8caDtYtRr3sBVqHxd18ozpl1N2yQev0skm4UcyTHuj4DPVae7EBW4eClmxTpMEziGsWnoPYlxkH7U0U7nfiDv9hGkR/s1600/sorry-image-not-available.png" style="margin-top: -30px;" /></a></span>';
summ = posts_thumb_sum;
}

var summary = imgtag + '<a href="'+ pURL +'"><div class="post-summary-text">' + removeHtmlTag(div.innerHTML,summ) + '</div></a>';
div.innerHTML = summary;
}
//]]>
</script>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType!= "item"'>
<style>
#list-view-button {font-family: Verdana; text-align:left;cursor:pointer;font-size: 14px;border-bottom: 5px solid #eaeaea;text-decoration: none;}
#list-view-button a{text-decoration: none; color: #666;}
.grid-view-button {background-color:#efefef;color:#666;padding:5px 10px;border-radius: 5px;font-size: 12px;}
.list-view-button {background-color:#efefef;color:#000;padding:5px 10px;border-radius: 5px;font-size: 12px;}
.post-grid-view {width:100%;height:250px;overflow: hidden;float:left;margin:0px 0px 20px !important;position:relative;display: block; -webkit-transition:all 0.5s ease 0s; -moz-transition:all 0.5s ease 0s; -o-transition:all 0.5s ease 0s; transition:all 0.5s ease 0s; }
.post-grid-view .posts-thumb {width:40% !important;height:250px !important;float:left;margin:0px;position:relative;border-top: 0px solid transparent !important;overflow: hidden;}
.post-grid-view .post-header {display: none;}
.post-grid-view .post-body img {min-width: 300px !important; min-height: 250px !important;display:block;width:100%!important;height:auto!important;max-width:800px!important;max-height:400px!important;border:none;outline:none;position:relative;margin: 0px;padding:0;}
.post-grid-view .post-summary-text {opacity: 1; background: none; width: 58%;font-size: 120% !important;clear: none !important; display: inline-block !important; padding: 80px 0px !important; color: #666 !important; text-shadow: none !important; float: right !important; text-align: left; position: relative !important; font-family: 'Open Sans Condensed', sans-serif;}
.post-grid-view .post-body {height: 250px;background:#f5f5f5; box-shadow: none !important;}
.post-title-grid a { font-size:170%;color: #777;font-family: 'Open Sans Condensed', sans-serif;}
.post-title-grid { position: absolute; left: 42%; top: 5%; z-index: 1;}
.post-grid-view .post-footer {left: 41%; display:block;position: absolute; bottom: 2%;font-size: 120%; background: transparent !important; border: 0px solid transparent !important;font-family: 'Open Sans Condensed', sans-serif;}
.post-grid-view .post-footer a{color: #128EC9;}
.post-grid-view a.comment-bubble {display: none;}
.main-inner .column-center-inner .section {margin: 0px !important;}
.post { -webkit-transition:all 0.5s ease 0s; -moz-transition:all 0.5s ease 0s; -o-transition:all 0.5s ease 0s; transition:all 0.5s ease 0s;}

#blog-pager {clear:both;}
.post {height:auto;width:32.2%;display:inline-block;text-decoration:none;float:left;margin:0 1% 1% 0%;overflow: hidden;padding:0!important;}
.date-header {display: none;}
h3.post-title a {font-size:90%;font-family: 'Open Sans Condensed', sans-serif;text-transform:uppercase;color:#fff;text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1);font-weight: bold;}
h3.post-title {text-align: center; position:absolute;top:0;width:100%;overflow:hidden;margin:0px !important;padding-top: 30%; background-color: rgba(50, 126, 213, 0.8);transform: scale(1);opacity: 0;z-index: 10;height: 100%;transition: all 300ms ease-out 0s;}
h3.post-title:hover {opacity: 1;}
.posts-thumb {width:100%!important;height:200px!important;overflow:hidden;clear:both;}
.post-body {border-radius:2px;box-shadow:0 5px 4px 1px rgba(0,0,0,0.1);position:relative;overflow: hidden;}
.post-body a {text-decoration: none;}
.post-body img {display:block;width:100%!important;height:auto!important;max-width:800px!important;max-height:400px!important;min-width:200px!important;min-height:200px!important;border:none;outline:none;position:relative;margin: 0px;padding:0;}
.post-summary-text {display: none;}
a.comment-bubble {color:#fff;text-decoration:none;font-size:100%;width: 100%;text-align: center;position:absolute;top:175px;left: 0px;text-shadow:1px 2px 1px #333;font-family: 'Pacifico', cursive;z-index: 122;}
a.comment-bubble:before { content: "Comments: " url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoFWvsybdNOl4LYxlzpVAl_yFHj4dWJ6InG2QzfzSPS0rOln_oMQRrZg8bgo-JKMv-Q95s2OHOdyQ8kjq5RbuUFrYeBc9MJGTum0rKfRB7XpCtZzon3e9MYDnZFiQw0VyMcZ_yHZHjaVio/s1600/heart-active.png);}
.post-header,.post-footer {display:none;}
</style></b:if></b:if>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'/>

Langkah 4. Selanjutnya, cari baris berikut:

<b:section class='main' id='main' name='Main' showaddelement='no'>

... Jika anda tidak dapat menemukannya, mencari satu ini sebagai gantinya:

<b:section class='main' id='main' name='Main' showaddelement='yes'>

Langkah 5. Tepat di atas garis ini, tambahkan kode berikut:

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType!= "item"'>
<div id='list-view-button'><a class='grid-view-button' onclick='grid_view()'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaU8gLFkJ-SglzJlm5EWSzZW-uSAEmS6AvtoDWwyXw0DP_1_YU9c4pi5FcMlOhqvBYFyM61zA4UfIyvJKtlzB_Q2Aa9klEkRaASi9fVZzqmBB0RVjvMC0skWXIMRQvmNtuXdlxMOYRzxdb/s1600/search-grid-icon.png' style='margin: -8px 1px -3px -6px;width: 16px;'/> Grid View</a> <a class='list-view-button' onclick='list_view()'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidUGVJnrgPnhGL_8XKSIkOnLQdIEqafyc2ozVtcECtcS0w-RRNageTNoeskSgTS12pxKtEf6OmpuD07dxv9IaKLqZv7oG8gXU_d5Iv-B0BjC4rhkYWP8MxyFRbLegNrsJGAWU4FMIdM6iH/s1600/icon-list-view.png' style='margin: -8px 1px -3px -6px;width: 16px;'/> List View</a></div>
</b:if></b:if>

Langkah 6. Sekarang, cari kode di bawah ini:

<data:post.body/>

Langkah 7. Anda akan menemukan 3 kejadian kode ini, ganti hanya yang kedua dan ketiga dengan satu di bawah ini:

<b:if cond='data:blog.pageType != "static_page"'>
    <b:if cond='data:blog.pageType != "item"'>
        <div expr:id='"summary" + data:post.id'>
            <data:post.body/>
        </div>
        <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>","<data:post.url/>");</script>
        <b:if cond='data:post.allowComments'>
            <a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
                <data:post.numComments/>
            </a>
        </b:if>
    </b:if>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
    <data:post.body/>
</b:if>
<b:if cond='data:blog.pageType == "static_page"'>
    <data:post.body/>
</b:if>

Penting: jika Anda sudah menambahkan auto read more dalam naskah, menghapus sebelumnya untuk membuat karya ini.

Langkah 8. Terakhir, klik "Preview" untuk melihat apakah semuanya terlihat baik dan tekan tombol 'Save Template' untuk menyimpan perubahan ...

Itu dia! Menambahkan pandangan switcher dinamis pada sebuah blog akan membuat konten melihat jauh lebih mudah bagi pengunjung. Apakah menggunakan daftar atau grid tampilan, daftar yang lebih dikompresi posting akan menghilangkan kebutuhan untuk mengklik halaman berikutnya, yang bisa memakan waktu jika memuat perlu waktu untuk menyelesaikan. Untuk arsip blog, menggunakan Auto Baca kode Lainnya di Blogger pasti akan membuat pengalaman menonton semua orang sangat nyaman.

Mengingat kemudahan yang kode dapat disesuaikan, membangun daftar / tampilan bergaris yang beralih ke bloger akan selesai dalam waktu singkat.

Halaman Blog

Cara Mengatur Custom Pengalihan di Blogger

Viral Comment

Cara Mengatur Custom Pengalihan di Blogger

Seiring waktu, kebanyakan blog akan melalui banyak perubahan, seperti tulisan yang ditambahkan atau dihapus. Dalam beberapa kesempatan, Kita tidak ingin orang-orang Mendapat Pesan 404 Not Found )ketika mereka surfing ke posting atau halaman yang tidak ada di blog Kita dan sebaliknya, membuat semua permintaan untuk link khusus untuk diarahkan ke yang lain halaman. Salah satu cara terbaik untuk menghindari link yang rusak dan menjaga lalu lintas mengalir ke arah yang benar adalah pengaturan kustom pengalihan melalui alat Blogger Kustom Pengalihan.

Dalam posting ini, kita akan melihat bagaimana untuk mengatur kustom pengalihan untuk Blogger posting dan mengarahkan URL lama ke URL baru. Tapi sebelum mengarahkan URL apapun, Kita harus tahu bahwa ada dua jenis pengalihan:

Sebuah Pengalihan302 berarti bahwa halaman telah pindah sementara. Pengalihan ini tidak lulus nilai URL ke lokasi baru dan sebaliknya, itu akan membawa pengunjung ke lokasi yang sesuai sehingga Kita tidak menunjukkan mereka halaman 404 tidak ditemukan, atau halaman kesalahan. Kita dapat menggunakan 302 pengalihan untuk segera hadir kehalaman kita.

Sebuah pengalihan 301 berarti bahwa halaman telah pindah secara permanen ke lokasi baru. Gunakan pengalihan 301 ketika Kita menghapushapus atau mengubah URL dari posting Kita. Dalam kebanyakan kasus, 301 selalu dianjurkan untuk SEO karena mereka akan melewati (power Peringkat) hanya jika link halaman diarahkan dan pengunjung juga akan mendapatkan keuntungan dari ini. Namun, 301 tidak cocok ketika Kita mengubah kebiasaan-domain Kita, karena hanya mendukung pengalihan dalam blog yang sama, tidak URL eksternal.

Sekarang kita sudah didirikan yang mana, mari kita lihat bagaimana untuk mengatur kustom pengalihan untuk Blogger posting.

Cara pengalihan URL lama ke URL baru di Blogger

Langkah 1. Login ke Kita akun Blogger dengan email dan password.

Langkah 2. Klik pada blog Kita ,pergi ke Settings \ Cari Preferences dan klik "Edit" di samping "Custom Pengalihan."

dashboard bloger

Langkah 3. Masukkan URL tua di "Dari" lapangan, dan URL baru di bidang "Kepada" termasuk garis miring "/" (lihat gambar di bawah).

dashboard bloger

Catatan: Jangan masukkan URL lengkap di bidang ini. Hanya menghilangkan alamat blog Kita dan ketik hanya sisa link. Sekali lagi, ini hanya bekerja jika Kita ingin mengarahkan dalam blog blogger Kita dan tidak ada link eksternal.

Langkah 4.Click "Simpan" link (1) dan "Simpan perubahan" tombol (2), dan Kita selesai!

dashboard bloger

Jika Kita ingin mengarahkan lebih banyak halaman, cukup klik tombol "pengalihan Baru".

Design Blog

Cara Menghilangkan / Menghapus Label Dari Posting Blogger

Viral Comment

Cara Menghilangkan / Menghapus Label Dari Posting Blogger

Banyak blogger mungkin menemukan label di bawah posting (atau judul posting) yang tidak perlu, selama mereka sudah di sidebar blog anda. Jadi, tutorial ini akan menunjukkan cara untuk menghapus secara manual dari HTML Template . Untuk menyembunyikan label dari blogger pos footer (atau di bawah judul posting), kita hanya bisa hapus centang pada "Label" pilihannya; Namun, pengaturan ini mungkin tidak bekerja dengan baik di beberapa template biasa dan kemudian, kita harus menghapus kodenya dari template kita.

Bagaimana Kita Akan Melakukan Ini?

Sembunyikan Label di Blogger Posts Menggunakan CSS

Langkah 1. Masuk ke akun kepala Blogger Anda ke tab 'Template' menekan tombol 'Edit HTML':

Dashbor

Langkah 2. Klik di mana saja di dalam area kode dan pencarian dengan menggunakan tombol CTRL + F tag di bawah ini (tekan Enter untuk menemukannya):