Joens Personal Blog

Tagpre Keren Season II

2015-01-20T15:40:00.001+07:00

Sahabat J-PB Setelah sekian lama saya absen dari update blog Alhamdulillah akhirnya saya punya sedikit waktu untuk menulis senbuah artikel lagi dan kembali bersilaturahmi dengan sahabat Blogger. Tulisan ini adalaha artikel pertama saya di tahun 2015.

Adapun Artikel kali ini saya kasih judul "Membuat Tagpre Keren Season II" mengapa ada Season II....?
Itu karena dalam postingan terdahulu saya pernah sekali membuat artikel tentang "Membuat Tagpre Keren" dan trik kali ini sedikit lebih simple, Untuk tutorialnya sebagai berikut :

LIHAT DEMONYA INTRUKSI PEMASANGAN KODE

 <pre>...........</pre>

"Masukan kode yang mau sobat posting diantara titik-titik diatas"


@import url(http://fonts.googleapis.com/css?family=Lato:400,700);
@import url(http://fonts.googleapis.com/css?family=Linden+Hill);
@import url(http://fonts.googleapis.com/css?family=VT323);

code, pre {
  font-family: 'VT323', 'Courier New', Courier, monospace;
  font-size: 110%;
  font-weight: normal;
  color: rgba(255, 176, 0, 0.6);
  background-color: #333;
  background-image: linear-gradient(to bottom, #222, #222 50%, #000 50%, #000);
  background-size: 100% 2px;
  padding: .05em .5em;
  text-shadow: rgba(185,128,0,.2) .5em 0 .2em;
}

pre {
  border: .07em solid #222;
  box-sizing: border-box;
  padding: .5em 1em;
  overflow: auto;
  box-shadow: inset 0 0 4em rgba(0,0,0,.5);
  border-radius: 1em;
  background-image: linear-gradient(to bottom, rgba(255,255,255,.05), rgba(255,255,255,.15) .5em, rgba(255,255,255,.05) 2em, rgba(255,255,255,.05) 2em, rgba(255,255,255,0)),
    /*linear-gradient(to left, rgba(255,255,255,.2), rgba(255,255,255,.05) 1em, rgba(255,255,255,.05) 1em, rgba(255,255,255,0)),*/
    linear-gradient(to bottom, #222, #222 50%, #000 50%, #000);
  background-size: /*100% 100%,*/ 100% 100%, 100% 2px;
}

code {
  box-decoration-break: clone;
}

Demikian artikel tentang "Membuat Tagpre Keren Season II" semoga artikel sederhana ini dapat bermanfaat bagi sobat blogger pada khususnya.....!!!

Jika ada hal yang kurang dimengerti jangan sungkan untuk berkomentar, dan marilah kita sama-sama belajar.

Cara Merampingkan Alexa Rank Dengan Cepat

2014-10-08T11:39:00.003+07:00

Alexa.Com.....???
Alexa.Com adalah anak dari perusahann besar Amazon, Situs ini bertujuan untuk memberikan informas yang detail tentang traffic sebuah blog atau website, dengan mengunjungi situs tersebut dan memasukan data dari Blog atau website kita maka kita akan mengetahui informasi traffic Blog atau Website kita.

Memiliki Blog atau Website dengan Ratting alexa yang sangat besar mungkin akan membuat sedikit minder, namun sebagai mana pepatah mengatakan "Banyak Jalan Menuju Roma" Pengalaman seperti ini adalah apa yang saya rasakan akhir-akhir ini, karena lama tidak melakukan Update serta jarangnya Blogwalking ke Blog-blog teman maka dampaknya sangat terlihat jelas Alexa rank blog J-PB yang tadinya berkisar antara 350.xxx, sekarang menjadi melonjak sangat besar, ini dapat dilihat dari widget alexa itu sendiri:

Kemudian Bagamana Cara Merampingkan Alexa Rank Dengan Cepat
1. Pertama Silakan sobat baca beberapa tutorial yang sudah ditulis oleh rekan-rekan kita, menuju artikel tersebutsilakan sobat klik link dibawah :
Cara Merampingkan Alexa Rank Dengan Cepat
2. Kedua Jika kurang jelas dengan tutorial dan masih belum faham coba Tonton Video Tutorial Cara Merampingkan Alexa Rank Dengan Cepat dan perhatikan dengan seksama, berikut videonya :
Buatan "Wahyu Eka Prasetiyarini" Admin Blog "cara-ririn.com"

Buatan "Tips Internet" Admin User "www.youtube.com/user/TipsInternetYutub"

3. Jangan lupa SEO juga lumayan penting buat mendukung Cara Merampingkan Alexa Rank Dengan Cepat lalu bagai mana cara membuat blog menjadi Seo Friendly Silakan Baca Tutorialnya :
Cara Membuat Blog Menjadi SEO Friendly

4. Jangan Lupa Pasang Alexa Toolbar Pada Web Browser sobat, saya rasa hal ini sangat penting sekali karena lumayan membantu Cara Merampingkan Alexa Rank Dengan Cepat, Adapun Teknik memasang Alexa Toolbar pada Browser terbilang tidak terlalu sulit, namun jika sobat masih memerlukan panduan dalam hal pemasangan Alexa toolbar jangan khawatir Kang Ricky Pratama sudah membuat tutorialnya sobat tinggal meluncur aja ke TKP-NYA :
Cara Memasang Alexa Toolbar

Adapaun Beberapa tekhnik lain yang juga harus diperhatikan adalah :

Melakukan claim Terhadap Alexa.Com
Memasang Widget Alexa
Melakukan Update Blog Dengan Teratur
Melakukan Blogwalking Atau Berkunjung Ke Blog Teman dan Jangan Lupa Tinggalkan Komentar
Mencari Backlink berkualitas
Membuat Artikel Content Yang Berkualitas
Lakukan PING BLOG Dengan Teratur
Share Postingan Di Situs Jejaring Sosial

Demikian Tekhnik atau Cara Merampingkan Alexa Rank Dengan Cepat, Tekhnik ini dulu pernah saya praktekan dan hasilnya cukup memuaskan, namun karena blog ini kurang terurus dan kurang berolahraga makanya jadi gemuk lagi, ingat semua teknik diatas efeknya tidak akan seperti kita memakan garam langsung terasa asinnya namun dengan kesabaran dan ulet semunya tidak ada yang tidak mungkin.

Salam silaturahmi.

Kemarau 2014 Ujian Ataukah Adzab

2014-09-19T13:11:00.001+07:00

Hujan merupakan nikmat yang besar dari Allah Ta'ala. Semua makhluk membutuhkannya, tidak terkecuali manusia. Nikmat ini, sebagaimana yang diterangkan Allah- menjadi sumber kehidupan semua makhluk.

Sebagai muslim, kita meyakini dengan benar bahwa segala sesuatu tidak akan terjadi kecuali dengan perintah Allah Subhanahu wa Ta'ala. Di antaranya hujan, ia tidak akan turun kecuali dengan perintah Allah Ta'ala. Jadi, turun dan tidaknya hujan itu dengan kehendak dan perintah Allah 'Azza wa Jalla. Dia berfirman,

أَمْ مَنْ خَلَقَ السَّمَاوَاتِ وَالْأَرْضَ وَأَنْزَلَ لَكُمْ مِنَ السَّمَاءِ مَاءً فَأَنْبَتْنَا بِهِ حَدَائِقَ ذَاتَ بَهْجَةٍ مَا كَانَ لَكُمْ أَنْ تُنْبِتُوا شَجَرَهَا أَئِلَهٌ مَعَ اللَّهِ

"Atau siapakah yang telah menciptakan langit dan bumi dan yang menurunkan air untukmu dari langit, lalu Kami tumbuhkan dengan air itu kebun-kebun yang berpemandangan indah, yang kamu sekali-kali tidak mampu menumbuhkan pohon-pohonnya? Apakah di samping Allah ada tuhan (yang lain)?" (QS. Al-Naml: 60)

Akhir-akhir ini kita mungkin sering melihat atau mendengar baik itu dari media masa atau dari media elektronik, tentang kemarau yang melanda negara kita tercinta Indonesia, disadari atau tidak segala sesuatu yang terjadi terhadap diri kita ataupun lingkungan sekitar adalah kehendak Allah Azza wazalla, namun kita dituntut untuk berfikir dan merenung segala kejadian tersebut apakah Ujian Ataukah Adzah dari Sang Khaliq.

Kemarau ini telah menyisakan seribu cerita dari saudara-saudara kita ada yang mengalami kebakaran hutan, gagal panen, kekurangan air bersih dan masih banyak lagi cerita lainnya. kita sebagai manusia yang diberi akal dan fikiran selayaknya bertafakur tentang hal ini, "Karena tuhan tidak akan merubah nasib suatu kaum kecuali kaum itu sendiri yang merubahnya". dalam postingan kali ini sengaja saya mengambil tema Kemarau 2014 Ujian Ataukah Adzab...?,

Mari kita sedikit telaah. Firman Allah swt :

مَّا أَصَابَكَ مِنْ حَسَنَةٍ فَمِنَ اللّهِ وَمَا أَصَابَكَ مِن سَيِّئَةٍ فَمِن نَّفْسِكَ

“Artinya : “Apa saja nikmat yang kamu peroleh adalah dari Allah, dan apa saja bencana yang menimpamu, maka dari (kesalahan) dirimu sendiri.” (QS. An Nisaa : 79)”

Ibnu Katsir mengatakan bahwa makna “Apa saja nikmat yang kamu peroleh adalah dari Allah” adalah dari karunia dan kasih sayang Allah swt. Sedangkan makna “dan apa saja bencana yang menimpamu, maka dari (kesalahan) dirimu sendiri.” Berarti dari dirimu sendiri dan dari perbuatanmu sendiri, sebagaimana firman-Nya :

وَمَا أَصَابَكُم مِّن مُّصِيبَةٍ فَبِمَا كَسَبَتْ أَيْدِيكُمْ وَيَعْفُو عَن كَثِيرٍ

“Dan apa saja musibah yang menimpa kamu maka adalah disebabkan oleh perbuatan tanganmu sendiri, dan Allah memaafkan sebagian besar (dari kesalahan-kesalahanmu).” (QS. Asy Syura : 30)

Berdasarkan keterangan tersebut diatas mungkin diantara saudara-saudara sudah dapat menyimpulkan sendiri jawaban dari tema postingan saya diatas.

“Akhir kata:
“Segala sesuatu datangnya dari Allah Swt. dan hanya kepada-Nya lah semuanya dikembalikan”

Chrome 64 Bit untuk Mac

2014-09-16T11:38:00.001+07:00

In late August we released Chrome 64-bit for Windows, which brought benefits in speed, security and stability. We’re now bringing these benefits to OS X with Chrome 64-bit for Mac, version 39, due to be released in Nov 2014. Unlike on Windows, where Chrome is available in both 32-bit and 64-bit, on Mac, Chrome will only be available in 64-bit with version 39 and after. As a result, 32-bit NPAPI plugins will not work on Chrome on Mac version 39 onwards.

Akhirnya setelah beberapa saat belum ada update akhirnya Google merilis browser Chrome 64-bit untuk sistem operasi OS X bulan lalu. Namun, versi tersebut baru tersedia untuk para pengembang (developer) atau belum tersedia untuk publik.

Rencananya, browser Google Chrome 64-bit versi publiknya akan mulai tersedia untuk semua pengguna OS X pada November mendatang. hal tersebut dikonfirmasi melalui postingan di blog resmi Google pada Jumat (12/9/2014). Google mengatakan, versi Chrome 39 yang stabil untuk Mac akan mulai tersedia untuk semua pengguna pada bulan November 2014, tanpa menyebut tanggal pastinya.

Pengguna baru bisa mengunduhnya melalui fitur Chrome Update. Sementara pengguna lama tidak perlu melakukan apa-apa karena Chrome menganut mekanisme auto-update.

Chrome versi 64-bit diklaim Google memberikan pengalaman kecepatan, keamanan, dan stabilitas yang lebih tinggi.

Dengan beralih ke versi 64-bit, maka plugin Netscape Plugin API (NPAPI) 32-bit tidak akan lagi didukung dalam browser Chrome 39 ke atas di Mac. Berbeda dengan versi Mac, Chrome 39 untuk versi Windows tersedia dalam pilihan 32-bit dan 64-bit.

Priacy Policy Joens Personal Blog

2013-12-28T15:50:00.002+07:00

If you require any more information or have any questions about our privacy policy, please feel free to contact us by email at Privacy.

At www.alexjoen.web.id we consider the privacy of our visitors to be extremely important. This privacy policy document describes in detail the types of personal information is collected and recorded by www.alexjoen.web.id and how we use it.

Log Files
Like many other Web sites, www.alexjoen.web.id makes use of log files. These files merely logs visitors to the site - usually a standard procedure for hosting companies and a part of hosting services's analytics. The information inside the log files includes internet protocol (IP) addresses, browser type, Internet Service Provider (ISP), date/time stamp, referring/exit pages, and possibly the number of clicks. This information is used to analyze trends, administer the site, track user's movement around the site, and gather demographic information. IP addresses, and other such information are not linked to any information that is personally identifiable.

Cookies and Web Beacons
www.alexjoen.web.id uses cookies to store information about visitors' preferences, to record user-specific information on which pages the site visitor accesses or visits, and to personalize or customize our web page content based upon visitors' browser type or other information that the visitor sends via their browser.

DoubleClick DART Cookie
→ Google, as a third party vendor, uses cookies to serve ads on www.alexjoen.web.id.
→ Google's use of the DART cookie enables it to serve ads to our site's visitors based upon their visit to www.alexjoen.web.id and other sites on the Internet.
→ Users may opt out of the use of the DART cookie by visiting the Google ad and content network privacy policy at the following URL - http://www.google.com/privacy_ads.html

Our Advertising Partners
Some of our advertising partners may use cookies and web beacons on our site. Our advertising partners include .......

Adversal, Bidvertiser

While each of these advertising partners has their own Privacy Policy for their site, an updated and hyperlinked resource is maintained here: Privacy Policies.
You may consult this listing to find the privacy policy for each of the advertising partners of www.alexjoen.web.id.

These third-party ad servers or ad networks use technology in their respective advertisements and links that appear on www.alexjoen.web.id and which are sent directly to your browser. They automatically receive your IP address when this occurs. Other technologies (such as cookies, JavaScript, or Web Beacons) may also be used by our site's third-party ad networks to measure the effectiveness of their advertising campaigns and/or to personalize the advertising content that you see on the site.

www.alexjoen.web.id has no access to or control over these cookies that are used by third-party advertisers.

Third Party Privacy Policies
You should consult the respective privacy policies of these third-party ad servers for more detailed information on their practices as well as for instructions about how to opt-out of certain practices. www.alexjoen.web.id's privacy policy does not apply to, and we cannot control the activities of, such other advertisers or web sites. You may find a comprehensive listing of these privacy policies and their links here: Privacy Policy Links.

If you wish to disable cookies, you may do so through your individual browser options. More detailed information about cookie management with specific web browsers can be found at the browsers' respective websites. What Are Cookies?

Children's Information
We believe it is important to provide added protection for children online. We encourage parents and guardians to spend time online with their children to observe, participate in and/or monitor and guide their online activity. www.alexjoen.web.id does not knowingly collect any personally identifiable information from children under the age of 13. If a parent or guardian believes that www.alexjoen.web.id has in its database the personally-identifiable information of a child under the age of 13, please contact us immediately (using the contact in the first paragraph) and we will use our best efforts to promptly remove such information from our records.

Online Privacy Policy Only
This privacy policy applies only to our online activities and is valid for visitors to our website and regarding information shared and/or collected there. This policy does not apply to any information collected offline or via channels other than this website.

Consent
By using our website, you hereby consent to our privacy policy and agree to its terms.

Kisah Sukses Pendiri Google

2013-12-26T11:42:00.000+07:00

Google Adalah mesin pencari paling terkemuka di dunia. Google dikunjungi lebih dari 300 juta orang per hari. Diterjemahkan dalam 88 bahasa dengan nilai saham mencapai lebih dari 500 dolas AS per lembar. Cerita Sukses Pendiri Google Sergey dan Larry, Rasanya kalau kita bicara 2 Pendiri Google ini kayak nya penuh dengan Cerita Sukses yang fenomenal, bayangkan Hanya dalam waktu 10 tahun lebih, mereka berhasil menempati posisi 5 besar warga terkaya di AS. dan menjadi TOP 30 Orang Terkaya Didunia, Gimana gak kaya mereka aja bisa membayar Ratusan Ribu Orang didunia dari Program Google Adsense Publisher newbie digit $ perbulan, 10 web terbaik versi alexa (data versi oktober 2008) 3 web adalah milik google : youtube, google.com dan blosgpot.

Google berasal dari kata googol yang diplesetkan. Di situs milik majalah Moment, Mark Malseed menyebutkan dua orang ini bersahaja, pria baik-baik, dan tak terlena oleh kemewahan. Sergey (34) tak pernah bisa melihat makanan tersisa di piring. Demikian pula Larry (34), ia tak silau dengan atribut kemewahan, walau mereka kini memiliki pesawat pribadi Boeing 767 yang disulap menjadi rumah mewah untuk perjalanan mereka. Google Inc berkantor di Googleplex, di selatan San Fransisco Bay. Majalah Fortune pernah menjuluki Googleplex sebagai tempat bekerja terbaik di AS pada tahun 2007.

Suasana kekeluargaan, makanan gratis tiga kali sehari, lokasi perawatan bayi bagi ibu muda, serta kursi pijat elektronis pun tersedia. Kedua orang ini bertemu ketika sama-sama belajar teknik komputer di Stanford University tahun 1995. Pertemuan itu ditandai dengan perdebatan, tetapi mereka tetap menjalin kontak dan terus saling beradu argumentasi.

Terlepas dari kekayaan meraka, ada beberapa hal yang patut dicontoh dari kesuksesan mereka. Menurut Sergey Brin, yang menjabat sebagai presiden Teknoliogi google. Kunci utama dalam menjalankan bisnis ialah kekuatan dari kesederhanaan. Menurutnya simplecity web adalah hal yang disukai para penjelajah internet. Dan, google berhasil karena menggunakan filosofi tersebut, menghadirkan web yang bukan saja memudahkan untuk mencari informasi, namun juga mneyenangkan orang.

Kunci sukses mereka yang kedua ialah integritas mereka dalam mewujudkan apa yang mereka yakini benar. Mereka rela drop out dari program doktor mereka di Stanford University untuk mengembangkan google. Pada awalnya mereka tidak berniat mencari keuntungan dari proyek tersebut. Malah, mereka berangkat dari sebuah ide sederhana, yaitu bagaimana membantu banyak orang untuk mempermudah mencari informasi dan data di dunia maya. Mereka meyakini, ide mereka akan sangat berguna bagi banyak orang untuk mempermudah mencari informasi data apa saja di internet.

Kunci sukses lainnya yaitu tidak melupakan jasa orang-orang yang mendukung kesuksesan mereka. Larry dan Segrey sangat memperhatikan kesejahteraan SDM di Gooleplex (kantor google). Gooleplex dinobatkan sebagai tempat bekerja terbaik di Amerika tahun 2007 oleh majalah fortune. Di sana suasananya sangat kekeluargaan, ada makanan gratis tiga kali sehari, ada tempat perawatan bagi bayi ibu muda, bahkan sampai kursi pijat elktronik pun tersedia. Mereka sadar, di balik sukses inovasi yang dilakukan google, ada banyak doktor matematika dan lulusan terbaik dari berbagai universitas yang membantu mereka.

Sebuah niat mulia dan berangkat dari apa yang mereka yakini, meski sesederhana apa pun, jika dilandasi jika dilandasi kerja keras dan integritas tinggi, maka ia akan menghasilkan sesuatu yang istemewa dan bermanfaat. Google yang mereka dirikan terbukti telah membantu banyak orang untuk mendapatkan apa saja dari internet. Kini, mereka pun mendapat imbalan yang terus mengalir, meski mereka tidak melakukan apa-apa. Kesuksesan sejati memang akan terasa saat kita berbagi.

BIODATA Nama: Lawrence (Larry) Page
Lahir: Lansing, Michigan, AS, 26 Maret 1973
Status: Pendiri dan menjabat sebagai Presiden Produk-produk GoogleInc
Kekayaan bersih: 18,5 miliar dollar AS (2007), nomor lima terkaya diAS bersama Sergey berdasarkan majalah Forbes, Maret 2007
istri : Lucy Southworth
Sekolah: SD, SMP Montessori, Lansing, Michigan. SMA dari EastLansing. Sarjana Muda dari University of Michigan bidang teknikkomputer, gelar master dari Stanford University Penghargaan: Global Leader for Tomorrow dari The World EconomicForum.

BIODATA Nama: Sergey Brin
Lahir: Moskwa, Rusia, 21 Agustus 1973.
Pada 1979 keluarganya bermigrasi ke Maryland, AS
Sekolah: SD, SMP di Paint Branch Montessori School, Adelphi, Maryland. SMA di Eleanor Roosevelt, gelar master dari University ofMaryland, bidang matematika. Dia mendapat beasiswa dari NationalScience Foundation untuk belajar di Stanford University, bidang komputer.
Sama seperti Larry, ia meninggalkan program doktor untuk mendalami Google
Penghargaan: Januari 2005 ia bersama Larry Page dinominasikan sebagai Young Global Leaders oleh World Economic Forum.

Dimana Ada Kemauan Disitu Ada Jalan, Kita Pasti Bisa ...!

Cara Paling Cepat Mendapatkan Pagerank

2013-12-07T10:37:00.001+07:00

Cara Paling Cepat Mendapatkan Pagerank - Trik mudah mendapatkan Pagerank, mungkin banyak diantara sobat blogger yang bertanya-tanya tentang postingan ini, dan mungkin ada sedikit perasaan aneh dan tidak percaya dengan postingan ini, Ya jelaslah secara logika bagaimana mungkin blog yang hanya mempunya PR:0 memposting Sebuah Trik Bagaimana Mendapatkan Pagerank Dengan Cepat......!!!

Sekarang sobat blogger jangan berpikir macam-macam dulu, langkahnya tarik nafas dalam-dalam melalui hidung dan keluarkan perlahan melalui mulut, jangan lupa secangkir kopi hangat juga punya peranan penting dalam mempersiapkan sebuah Trik SEO Super ini.

Pagerank.....???

Mungkin dari segelintir Blogger Newbie seperti ane belum faham benar apa itu pagerank....!!!, jujur ane sendiri kurang faham dengan mahluk yang satu ini, tapi terkadang banyak pandangan bahwa blog atau website yang keren, dan berkualitas itu memiliki Pagerank Tinggi, bagi saya pribadi tidak terlalu ambil pusing dengan hal ini, dan menurut saya banyak blog yang menyajikan artikel-artikel hebat serta banyak diperlukan orang tapi pada kenyataanya PR nya masih nol, dan sebaliknya ada juga blog yang memiliki PR namun artikel yang disajikan biasa-biasa aja, jadi jelas menurut hemat saya bahwa Trik Mendapatkan Pagerank Dengan Cepat masih sebuah misteri yang hanya Google sendiri yang tau dan mungkin beberapa pakar SEO yang sudah memahaminya.

Menurut salah satu Pakar SEO kebanggaan Indonesia dan salah satu orang yang saya kagumi, Mas "Ricky Pratama" dalam blognya http://trikmudahseo.blogspot.com beliau mengatakan bahwa :

Pagerank adalah sebuah istilah SEO untuk sistem penilaian yang memberikan poin-poin pada setiap halaman web di dunia maya yang dimiliki oleh Google. Poin yang diperoleh masing-masing halaman akan diikutsertakan dalam penilaian akhir untuk posisi di halaman pencarian. Semakin besar poinnya, maka semakin besar juga "bantuan" yang diberikan untuk posisi anda. Tapi perlu diperhatikan, bahwa porsi yang diberikan kepada pagerank saat ini sudah tidak sebesar dulu. Jadi hanya karena anda mempunyai PR3 belum tentu anda bisa mengalahkan PR0, jika PR0 ini unggul di poin-poin lainnya

Nah sekarang kita sudah mulai ada sedikit gambaran tentang pengertian Pagerank, kemudian mungkin timbul lagi sebuah pertanyaan dibenak sobat blogger, lalu apa dan bagaimana trik Cara Paling Cepat Mendapatkan Pagerank seperti pada judul artikel ini......???

Eits jangan marah dulu coba sobat blogger bayangkan blog ini aja PR nya cuman n/a atau Nol, mana mungkin ane punya Trik Mendapatkan Pagerank Dengan Cepat, hehhehheh.....

Tapi yang jelas bagi ane soal Pagerank gak jadi hambatan atau masalah buat terus ngeblog mau dapat PR atau tidak yang penting ane bisa sedikit berbagi walaupun hanya sebatas coretan yang tidak mempunyai arti, dengan ngeblog ane bisa mendapatkan pengalam serta ilmu-ilmu baru dari sobat blogger dan satu hal yang tidak kalah penting Silaturahmi. mungkin hanya ini artikel yang dapat ane sajikan dihari menjelang akhir pekan ini harapan saya semoga ada salah satu master SEO yang sudi berbagi tentang rahasia Cara Paling Cepat Mendapatkan Pagerank, Trik mudah mendapatkan Pagerank, Trik Bagaimana Mendapatkan Pagerank Dengan Cepat, Akhirkata selamat berakhir pekan buat sobat Blogger semuanya.

Geeklines Responsive Blogger Template

2013-12-06T10:23:00.000+07:00

GeekLines Blogger Template - Merupakan sebuah template blogger 100% gratis, yang di desain dengan HTML5 dan sepenuhnya divalidasi. Template ini sangat cocok untuk untuk website, blog aplikasi, dll.

Fitur Template :

Desain By : Ayuda Bloggers
Url : www.ayuda-bloggers.info
Dibuat dengan konsep HTML5
Easy Slider 1.7, yang dapat dikonfigurasi dari feed.
Berisi struktur unik dalam entri indeks
Sistem komentar Disqus
Tidak menyertakan link atribusi, sehingga Anda dapat menggunakan dan memodifikasi secara bebas.
Semua pengkodean berjalan dengan relevan

Panduan konfigurasi Template :
Validasi Template : Temukan kode dibawah ini :


<html lang='es' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Kemudian ganti dengan kode dibawah ini :


<html lang='es'>

Langkah ini diperlukan setiap kali Editor HTML dimulai dan perubahan disimpan.

Sertakan informasi di Meta tags: Anda perlu mencari baris berikut untuk mengkonfigurasi secara terpisah sesuai dengan preferensi Anda:


<meta content='DESCRIPCIÓN DE TU BLOG' property='og:description'/>

Atur slider: slider ini didasarkan pada Easy Slider 1.7, Anda dapat memodifikasi parameter berikut dalam script:


<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
 $("#slider").easySlider({
auto: true,
speed: 750,
pause: 4000,
continuous: true
 
 });
});
//]]>
</script>

Anda harus mengganti nilai berikut:
auto: true (perubahan palsu untuk membuat slider pergi ke manual).
speed: 750 (kecepatan transisi)
pause: 4000 (waktu antara gambar)
continuous: true (Pada akhirnya menghabiskan semua entri, kembali lagi ke pertama)

Untuk script mendeteksi tag tertentu, memodifikasi baris berikut:


<script src='/feeds/posts/default/-/Smartphones?orderby=published&amp;amp;alt=json-in-script&amp;amp;callback=showgalleryposts&amp;amp;max-results=20'/>

Ganti kata "Smartphone" sesuai label yang sobat ingin tampilkan.
sobat juga harus mencari kode:


<div id='latest-posts-title'>Últimos Artículos en Smartphones</div>

Kemudian ganti judul tersebut sesuai keinginan sobat.

Mengatur menu atas: Sobat harus mengatasi setiap elemen dari menu untuk URL yang sesuai, bersama dengan teks yang ingin sobat sertakan. kemudian cari kode seperti dibawah ini dan silakan sesuaikan sendiri :


<header id='bar-outer'>
      <nav id='topbar' role='navigation'>
        <a href='/' id='blog-logo'>
          <data:blog.title/>
        </a>
        <a href=''>
          Android
        </a>
        <a href=''>
          Aplicaciones
        </a>
        <a href=''>
          Windows Phone
        </a>
        <a href=''>
          iOS
        </a>
        <a href=''>
          Redes Sociales
        </a>
        <a href=''>
          Login
        </a>
      </nav>
    </header>

Contoh :


<header id='bar-outer'>
<nav id='topbar' role='navigation'>
<a href='/' id='blog-logo'>
<data:blog.title/></a>
<a href='http://alexjoen.web.id/search/label/Tutorial Blog'>Tutorial Blog</a>

<a href='http://alexjoen.web.id/search/label/CSS'>CSS</a>

<a href='http://alexjoen.web.id/search/label/SEO'>SEO</a>

<a href='http://alexjoen.web.id/search/label/Tutorial Komputer'>Tutorial Komputer</a>

<a href='http://alexjoen.web.id/search/label/Blogazine'>Blogazine</a>

<a href='https://accounts.google.com/ServiceLogin?service=blogger'>Login</a>
      </nav>
    </header>

Memodifikasi biografi penulis: Jika blog sobat hanya memiliki satu penulis, maka akan terlihat sebagai berikut:


<aside id='post-author'>
 
         <div id='author-about'>
 
           <img class='left' expr:alt='data:post.author' id='author-image' src='https://lh6.googleusercontent.com/-cQU2h9jqgiw/AAAAAAAAAAI/AAAAAAAAAAA/Gw3x4qIKr3M/s100-c/photo.jpg'/>
           <div id='author-name'>Escrito por <a expr:href='data:post.authorProfileUrl' rel='author' title='Perfil del autor'>
             <data:post.author/></a></div>
 
           Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</div>
       <div class='clearfix'/>
 
     </aside>

Sobat harus mengubah URL dari gambar dan beberapa teks.

Pembaharuan: Jika blog sobat memiliki 2 atau lebih penulis, maka sobat harus menggunakan kondisional:


<b:if cond='data:post.author == &quot;Tu nombre&quot;'><!-- Tu mini-biografía -->
      <aside id='post-author'>
 
         <div id='author-about'>
 
           <img class='left' expr:alt='data:post.author' id='author-image' src='https://lh6.googleusercontent.com/-cQU2h9jqgiw/AAAAAAAAAAI/AAAAAAAAAAA/Gw3x4qIKr3M/s100-c/photo.jpg'/>
           <div id='author-name'>Escrito por <a expr:href='data:post.authorProfileUrl' rel='author' title='Perfil del autor'>
             <data:post.author/></a></div>
 
           Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</div>
       <div class='clearfix'/>
 
     </aside>
</b:if>
 
<b:if cond='data:post.author == &quot;Nombre de otro autor&quot;'> <!-- La biografía de otro autor-->
      <aside id='post-author'>
 
         <div id='author-about'>
 
           <img class='left' expr:alt='data:post.author' id='author-image' src='https://lh6.googleusercontent.com/-cQU2h9jqgiw/AAAAAAAAAAI/AAAAAAAAAAA/Gw3x4qIKr3M/s100-c/photo.jpg'/>
           <div id='author-name'>Escrito por <a expr:href='data:post.authorProfileUrl' rel='author' title='Perfil del autor'>
             <data:post.author/></a></div>
 
           Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</div>
       <div class='clearfix'/>
 
     </aside>
</b:if>

Ganti dengan nama yang sesuai, tergantung pada jumlah penulis.

Konfigurasi sistem komentar: Default komentar dari template ini menggunakan Disqus, tetapi Anda dapat memilih untuk sistem lain seperti IntenseDebate, Livefyre Google atau komentar hack blogger dan yang lainnya.
Konfigurasi Disqus: langkah pertama yang harus sobat lakukan adalah membuat akun di Disqus silakan klik DISINI untuk sign-up setelah itu sobat akan medapatkan link disqus sobat seperti punya ane http://disqus.com/kolomtutorial/ langkah selanjutnya cari kode dibawah ini :


var disqus_shortname = &#39;kolomtutorial&#39;; // required: replace example with your forum shortname

Ganti tulisan "kolomtutorial" dengan url name disqus sobat.

Konfigurasi kotak komentar dengan sistem lain: Dalam hal ini ane akan mencontohkan penggantian sistem komentar Disqus dengan Google+, langkahnya cari kode seperti ini :


<div id='comments'>          
    <div id='disqus_thread'/>
    <script type='text/javascript'>
        /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
        var disqus_shortname = &#39;demoblogayudabloggers&#39;; // required: replace example with your forum shortname
 
        /* * * DON&#39;T EDIT BELOW THIS LINE * * */
        (function() {
            var dsq = document.createElement(&#39;script&#39;); dsq.type = &#39;text/javascript&#39;; dsq.async = true;
            dsq.src = &#39;//&#39; + disqus_shortname + &#39;.disqus.com/embed.js&#39;;
            (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(dsq);
        })();
    </script>

</div>

Kemudian sobat hapus antara kode <div id='comments'> sampai kode </div> hingga menjadi kosong seperti contoh dibawah ( tanpa titik )


<div id='comments'>          
    ..............................
    ..............................
        .........................................................................
        .........................................................................
        .........................................................................
        .........................................................................
        .........................................................................
        .........................................................................
        .........................................................................
        .........................................................................
    ...........

</div>

Kemudian masukan script kode komentar Google + :


<script type='text/javascript'>
//<![CDATA[
 window.___gcfg = {lang: 'es'};
 (function() {
   var crearjsplus = document.createElement('script'); crearjsplus.type = 'text/javascript'; crearjsplus.async = true;
   crearjsplus.src = 'https://apis.google.com/js/plusone.js';
   var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(crearjsplus, s);
 })();
//]]>
</script><div class="g-comments" expr:data-href="data:post.url" data-first_party_property="BLOGGER" data-view_type="FILTERED_POSTMOD" />

Mengatur sidebar dalam setiap entry: Hal ini penting untuk mengetahui bahwa sidebar kanan muncul dalam entri dan halaman statis dan harus ditulis secara manual.
Untuk menyertakan gadget, Sobat harus melakukannya dengan menggunakan kode berikut:


<div class='sidebar-widget'> 
 <div class='sidebar-title'>Título del gadget</div>
     <div class='sidebar-widget-content'>
      Texto o código dentro del gadget.
     </div>
     </div>

Catatan:
Sobat dapat membuat blok tambahan tanpa ruang internal untuk mengambil keuntungan 100% dari gadget. dan langkahnya menggunakan kode berikut ini sebagai gantinya:


<div class='sidebar-widget non-padding'> 
    <div class='sidebar-widget-content'>
       Texto o código dentro del gadget.
    </div>
</div>

Mengubah semua link jaringan sosial: Sobat harus mengkonfigurasi secara manual, cari kode dibawah ini dan sesuaikan dengan jejaring sosial sobat :


<div id='subscription'>
         <aside id='twitter-subs'>
         <a class='twitter-follow-button' data-lang='es' data-show-count='false' href='https://twitter.com/ayudabloggers'>Seguir a @ayudabloggers</a>
         </aside>
         
         <aside id='facebook-sub'>
           <div class='fb-like' data-href='http://www.facebook.com/cloudx18admin' data-send='false' data-show-faces='false' data-width='245'/>
         </aside>
         
         <aside id='gplus-sub'>
           <div class='g-plus' data-height='131' data-href='https://plus.google.com/117852954383455114075' data-width='265'/>
         </aside>
        </div>

Untuk link yang bearada di bawah atau footer silakan di edit:


<aside id='about-info'>
        &#169; 2013 <data:blog.title/> Todos los derechos reservados.  <span class='right-text right'><a href='http://www.twitter.com/ayudabloggers'>Twitter</a> | <a href='http://www.facebook.com/cloudx18admin'>Facebook</a> | <a href='https://plus.google.com/u/0/112020346592923778561'>Google+</a></span>
         
        <div class='clearfix'/>
      </aside>

Konfigurasi link di akhir template/footer paling bawah: silakan sobat cari kode dibawah ini kemudian silakan untuk disesuaikan dengan keperluan sobat.


<footer id='sub-footer'>
        <a href='/'>Inicio</a>
        <a href='/'>Publicidad</a>
        <a href='/'>Política de privacidad</a>
        <a href='/'>Términos de uso</a>
        <a href='/'>Mapa del sitio</a>
        <a href='/'>Patrocinadores</a>
        <a href='/'>Colaborar</a>
        <a href='/'>Acerca de</a>
        <a href='/'>Contacto</a>
      </footer>

Demikian teknis pemasangan dari Geeklines Responsive Blogger Template, semoga dapat membantu dan terimaksih banyak kunjungannya

Source : http://www.ayuda-bloggers.info

Alasan Jarang Update Blog

2013-12-04T21:40:00.001+07:00

Alasan Jarang Update Blog - Blogging bagi saya adalah salah satu hobby yang saya gemari, dengan blogging saya dapat menemukan sesuatu yang baru dan saya banyak mendapat teman yang selalau berbagi pengalaman serta ilmu, namun sekalipun saya sangat hobby ada kalanya blog yang saya kelola terbengkalai kurang terawat, ini semata karena berbenturan dengan kegiatan saya di dunia nyata yang tidak bisa ditunda, dan hal ini pun mungkin menimpa terhadap sebagian sobat blogger lainnya. Itu mungkin baru alasan saya saja tapi dibawah ini juga ada beberapa alasan mengapa saya jarang update blog :

1. Malas

Salah satu sifat dasar manusia diantaranya "Taghoyur" atau berubah-ubah, contohnya kadang kita rajin, giat, tapi bukan tidak mungkin sutu saat merasa malas tentunya dalam hal apapun termasuk blogging atau update blog, padahal kita semua sudah tau Malas adalah suatu penyakit berbahaya yang harus dihindari, karena tidak ada manusia sukses yang pemalas (Kata Orang).

2. Bosan

Seperti yang saya bilang pada poin nomor 2 Kadang kala persaan Bosan merasuki pada diri setiap manusia baik itu dalam rutinitas ataupun ngeblog, tentunya karena kita hanya manusia biasa yang selalu ada pasang surutnya, begitupun dengan blogging, namun manakala kita mendapatkan sesuatu yang sifatnya menyenangkan pasti hal ini tidak akan terjadi. Jadi intinya butlah apapun rutinitas kita menjadi menyenangkan.

3. Bingung

Mungkin poin nomor 2 dan nomor kita bisa kita atasi, tapi lain halnya dengan sifat yang satu ini, diantara alasan jarang update blog yang kadang saya rasakan adalah Bingung, Bingung nentuin artikel apa yang mau ditulis, karena udah banyak di SE Google, nah dsinilah kreativitas kita tetunya dituntut harus bekerja exstra, kuncinya rajin membaca dan terus dan terus belajar.

Alasan Jarang Update Blog - Beberapa alasan diatas itu hanyalah pengalam pribadi saya, tapi bukan tidak mungkin ada sebagian diantara sobat blogger yang merasakan seperti apa yang saya rasakan, dari beberapa point diatas mungkin menjadi sebuah pelajaran berharga khusus buat saya dan rekan-rekan blogger, ternyata dari ketiga point tersebut tidak ada satupun yang menguntungkan buat kita, namun kita tidak hanya mesti berpangku tangan dengan hal tersebut, kuncinya : Belajar, Belajar dan Belajar

Semoga artikel ini bisa menjadi media pembelajaran khusus bagi saya serta rekan-rekan blogger

Cara Super Cepat Terindex Di Google

2013-11-16T14:24:00.000+07:00

Cara Super Cepat Terindex Di Google - Mempunyai sebuah blog/web yang dapat cepat terindex oleh Google adalah impian setiap blogger tentunya, namun ternyata hal ini sangat sulit untuk dilakukan apalagi dengan kemampuan SEO yang Nol Seperti ane, namun keterbatasan akan ilmu SEO tidak menjadi halangan bagi ane untuk terus belajar dan belajar, dibawah ini adalah langkah-langkah yang biasa ane lakukan terhadap blog kesayangan ane, Jujur dari segi kepuasan ane belum sepenuhnya merasa puas dengan hasil yang sekarang, namun berusaha dan belajar insya Allah akan menjadi obat sekaligus cambuk untuk terus mencari ilmu.

Bagi sobat blogger yang membutuhkan trik ini semoga dapat membantu dan bagi para master blog saya sangat mengharapkan untuk berbagi pula tekhnik SEO nya, karena jujur saya katan dari awal mula ngeblog sampai sekarang ane masih belum memahami apa itu SEo dan bagaimana sistemnya.

Cara Super Cepat Terindex Di Google:

1. Melakukan Submit Site Map Blog
Site Map Blog, adalah sebuah susunan atau daftar isi yang terkandung di dalam web/blog, Site Map Blog yang kita bicarakan ini tentunya buak sebuah Daftar isi yang layaknya tersimpan dalam sebuah postingan atau halam pada sebuah blog/web namun ini sipatnya sitemap yang berupa XML, dan apa itu XML cari jaja di mbah Google, hehheheee

Untuk memasukan Site Map Blog tentunya ada beberapa cara diantaranya dengan memasukan beberap linknya seperti dibawah ini, dan silakan sobat blogger submit kebeberapa submitter terkanal seperti, Google Webmaster Tools, Bing Webmaster Tools, yahoo, dan yang lainnya. ini dia link XML sitemapnya :

http://NAMA-BLOG-SOBAT.DOMAIN.COM/sitemap.xml
http://NAMA-BLOG-SOBAT.DOMAIN.COM/atom.xml?redirect=false&start-index=1&max-results=500
http://NAMA-BLOG-SOBAT.DOMAIN.COM/feeds/posts/default?orderby=updated

2. Ping Blog Sobat

Melakukan ping secara berkala baik itu link homepage atau halama artikel dan sebagai contoh dibawah ini beberapa situs yang biasa ane pergunakan untung ngeping blog :

dan tentunya masih banyak lagi tempat ngeping blog

3. Komentar
Lah ko komentar...... ya iya lah bang,,,,,,,
Komentar disini maksudnya sering-seringlah berkomentar pada sebuah blog/web yang mempunyai ratting serta pengunjung yang banyak, dan pastikan bahwa sobat menggunakan halaman url yang ingin terindek, artinya tidak hanya mesti halaman url homepage saja, simplenya begini, ketika kita bertamu kerumah teman kita maka bukan tidak mungkin teman yang kita kunjungi akan berbalik mengunjungi kita juga dan atau setidaknya kita sudah menaruh link di teman kita. atau dengan kata lain sering-seringlah Blogwalking.

4. Membuat konten atau artikel yang uptodate
Membuat konten atau artikel yang uptodate disini artinya sering-sering lah menulis artikel dan yang paling efisien secara berkala, dan tentunya artikel tersebuat yang di butuhkan audiens atau setidaknya mbakalan ada yang mencari artikel tersebut, jangan kaya ane nulis artikel se-enae dewe, mengenai postingan dan isi artikel yang penting ada. ( Perhatian Jangan Ditiru Karena akan Menyebabkan Kanker, Impotensi, Gangguan Kehamilan dan Janin wkwkkwk )

5. Sosbok - Alias Sosial Bookmark Ingat Jangan di Lupakan
Ingat trik ini juga sangat membantu, Share artikel kita ke Sosbok, terserah mau sosbok apa aja lebih banyak tentunya akan lebih baik, tapi satu yang harus sobat blogger perhatikan seperti pada artikel ane sebelumnya, jangan lakukan share ke sosbok jika artikel sobat belum tercium sama Mbah Google. Karena menurut pakar kesehatan setempat hal ini dapat menyebabkabkan umur artike di serp tidak akan lama alias cepet Ngalepot hihihihi.......

6. Melakukan Link Building
Bingung dengan maksud poin no enam ini kalau begitu sama, Sebagai contoh cara ana membangun link building dengan cara berkomentar di blog/webnya teman dengan menanamkan link halaman tekniknya "Berkomentar Menggunakan Comment as : Name/Url, Kolom Name Isi dengan Judul Artikel Kita ( Boleh/apa aja) pada kolom Url, Ane isi dengan url postingan terbaru ane, begono yang biasa ane lakukan ya sekalipun tidak semudah menggunakan akun Google+ tentunya tapi hasilnya lumayan masbro.

Demikian Artikel tentang Cara Super Cepat Terindex Di Google berdasarkan pengalaman dan yang telah ane praktekin semoga dapat sedikit membantu sobat Blogger pemula Seperti ane.

Membuat Border Dengan Ribbon

2013-11-12T09:09:00.000+07:00

Membuat Border Dengan Ribbon - Dalam pencarian SE Google banyak sekali teknik pembuatan border baik itu untuk gambar, text ataupun yang lainnya, pada kesempatan ini J-PB akan berbagi sebuah teknik penggabungan Border dengan Ribbon, adapun ahsil akhir dari tek nik ini dapat sobat lihat dalam gambar dibawah ataupun dalam kolom demo.

LIHAT DEMONYA INTRUKSI PEMASANGAN KODE

<div class="jpb-ribbon">
  <h1 class="ribbonnya">Judul Headernya</h1>
  <p>Isi kontennya disini.... </p>
<p>Isi kontennya disini.... </p>
</div>

@import url(http://fonts.googleapis.com/css?family=Open+Sans);

.jpb-ribbon {
  width: 400px;
  margin: 2em auto;
  background: white;
  border-color: #2980b9;
  border-width: 0 10px 10px 10px;
  border-style: solid;
  padding: 0 0 0em 0;
}
.jpb-ribbon p {
  padding: 0 30px;
}
.ribbonnya {
  background-color: #1ab315;
  color: white;
  position: relative;
  z-index: 1;
  padding: 0.5em 1em 0;
  margin: 0 0 1.5em;
  text-align: center;
}
.ribbonnya:before,
.ribbonnya:after {
  position: absolute;
  content: '';
  z-index: -1;
}
.ribbonnya:before {
  background: linear-gradient(to bottom, #34495e, #3498db);
  left: -10px;
  height: 100%;
  width: 105%;
  top: 0;
}
.ribbonnya:after {
  top: 100%;
  left: -10px;
  width: 0;
  height: 0;
  border-width: 40px 210px 40px 210px;
  border-style: solid;
  border-color: #3498db transparent transparent transparent;
}

Demikian artikel tentang "Membuat Border Dengan Ribbon" ini J-PB sajikan semoga artikel sederhana ini dapat bermanfaat bagi sobat blogger khususnya.....!!!

Membuat Tag Pre Keren

2013-10-26T08:07:00.000+07:00

Membuat Tagpre Keren - Sebuah blog atau web tutorial tidak akan pernah lepas dari hal yang satu ini, pada pencarian Google banyak sekali jenis tagpre yang disajikan secara lengkap dengan cara pemasangannya oleh blogger-blogger Indonesia maupun Mancanegara, Pembuatan Tagpre itu sendiri mungkin ditujukan agar pembaca atau audiens sebuah blog dapat lebih cepat memahami serta membedakan antar kode yang disajikan baik itu CSS, HTML, jQuery dan yang lainnya.
Penggunaan Tagpre juga akan sedikit memperindah tampilan tempat sebuah kode disimpan, bentuk dari tagpre yang akan saya sajikan berikut ini adalah bukan hasil karya pribadi saya sepenuhnya, sumber kode tersebut saya ambil dari mas Taufik Nurrohman dalam blognya www.dte.web.id dalam artikelnya "Tema Vanila untuk Tag PRE" kemudia saya edit sedikit warnanya dan lagi-lagi saya menambah kode penomoran otomatis juga hasil karya Mas Taupik Nurrohman.
Dan jika sobat ingin mengetahui lebih jauh apa itu tagpre dan apa aja unsur-unsur didalamnya silakan sobat blogger kunjungi blognya Kang Ismet pada artikel tentang "Mengenal Tag Pre "

LIHAT DEMONYA

INTRUKSI PEMASANGAN KODE

 <pre data-codetype="HTML"> ... </pre>
<pre data-codetype="CSS"> ... </pre>
<pre data-codetype="JavaScript"> ... </pre>
<pre data-codetype="JQuery"> ... </pre>

 pre {
    background-color:#233948;
    font:bold 12px/15px "Inconsolata","Monaco","Consolas","Andale Mono","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
    color:#333;
    border:1px solid #f1c40f;
    position:relative;
    padding:0 7px;
    margin:10px 0;
    overflow:auto;
    word-wrap:normal;
    white-space:pre;
    box-shadow:0 1px 2px rgba(0,0,0,0.2);
    position:relative;
}

pre[data-codetype] {
    padding:23px 1em 7px 1em;
}

pre[data-codetype]:before {
    content:attr(data-codetype);
    display:block;
    position:absolute;
    top:0;
    right:0;
    left:0;
    background-color:#95a5a6;
    padding:0 7px;
    font:bold 12px/20px Arial,Sans-Serif;
    color:white;
}

pre[data-codetype="HTML"]       {border-color:#27ae60;color:#8FE6B3;}
pre[data-codetype="CSS"]        {border-color:#16a085;color:#7DDECA;}
pre[data-codetype="JavaScript"] {border-color:#2980b9;color:#91C8ED;}
pre[data-codetype="JQuery"]     {border-color:#34495e;color:#889CAF;}


pre[data-codetype="HTML"]:before          {background-color:#27ae60;}
pre[data-codetype="CSS"]:before           {background-color:#16a085;}
pre[data-codetype="JavaScript"]:before    {background-color:#2980b9;}
pre[data-codetype="JQuery"]:before        {background-color:#34495e;}


pre code,
pre .line-number {
  display:block;
  font:normal normal 12px/15px "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace !important;
  color:#006699;
}

pre .line-number {
  float:left;
  margin:0 1em 0 -1em;
  color:#ecf0f1;
  background-color:#243342;
  border-right:2px solid #3E5770;
  text-align:right;
  min-width:2.5em;
}

pre .line-number span {
  display:block;
  padding:0 .5em 0 1em;
}

pre .line-number span:nth-child(even) {background-color:#243342}

pre .cl {
  display:block;
  clear:both;
}

 <script type='text/javascript'>
(function() {
    var pre = document.getElementsByTagName('pre'),
        pl = pre.length;
    for (var i = 0; i < pl; i++) {
        pre[i].innerHTML = '<span class="line-number"></span>' + pre[i].innerHTML + '<span class="cl"></span>';
        var num = pre[i].innerHTML.split(/\n/).length;
        for (var j = 0; j < num; j++) {
            var line_num = pre[i].getElementsByTagName('span')[0];
            line_num.innerHTML += '<span>' + (j+1) + '</span>';
        }
    }
})();
</script>

Demikian artikel tentang pembuatan tagpre keren, dan semoga artikel ini bermanfaat.

Membuat kotak Breaking News Blogger

2013-10-22T11:46:00.001+07:00

Membuat kotak Breaking News - Alhamdulillah setelah sebelumnya J-PB update tentang upgrade blog dari blogspot ke web.id, sekarang update lagi tentang pemasangan widget Breaking News yan dewasa ini hampir setiap template blog memiliki hal tersebut, namun bagi sobat blogger yang dalam templatenya belum terdapat widget ini gak usah khawatir karena padakesempata ini J-PB akan mengulasnya secara singkat tentang pembuatan widget tersebut.

Untuk penampakan dari hasil koding dibawah kurang lebih seperti pada gambar ini :

LIHAT DEMONYA

INTRUKSI PEMASANGAN KODE

UNTUK KODE HTML NYA

<section>
<div class="J-PB"></div>
</section>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

UNTUK KODE CSS NYA

.csTicker {
  width:700px; /*untuk menentukan lebar dari kotak breaking newsnya*/
  font-size: 14px; /*untuk menentukan ukuran hurup*/
  background: #fafcfa;/*untuk menentukan warna backgroundnya*/
  border-radius: 3px;
  overflow: hidden;
  height: 35px;
  position: relative;
}
.csTicker a {
  font-family:'Opensans';
  color: #1A86D6;
  text-decoration: none;
  cursor: pointer;
}
.csTicker ul {
  position: absolute;
}
.csTicker ul, .csTicker li {
  list-style: none;
  padding: 0;
  margin: 0;
}

.csTicker .csTicker__title {
  padding-top: 1em;
  padding-left: 1em;
  padding-right: 1em;
  padding-bottom: 1em;
  background: #5ac9b2;
  color: white;
  font-weight: bold;
  font-size: 1.5em;
  text-align: center;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 100;
  border-bottom: 5px solid rgba(0, 0, 0, 0.1);
}

@media (min-width: 720px) {
  .csTicker li {
    padding: 1em;
  }
}
@media (min-width: 1200px) {
  .csTicker li {
    padding: 1em;
  }
}
.csTicker li:before, .csTicker li:after {
  content: " ";
  display: table;
}
.csTicker li:after {
  clear: both;
}
.csTicker li:first-child {
  border-top: none;
}
.csTicker li > .col {
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.csTicker li > .col:first-child {
  width: 25%;
}
.csTicker li > .col:last-child {
  width: 75%;
  padding-left: 1em;
}
@media (min-width: 720px) {
  .csTicker li > .col:last-child {
    padding-left: 1em;
  }
}
@media (min-width: 1200px) {
  .csTicker li > .col:last-child {
    padding-left: 1em;
  }
}
.csTicker img {
  width: 100%;
  height: auto;
  border-radius: 3px;
}
.csTicker p {
  margin: 0;
  font-size: 1em;
  line-height: 1.4em;
}
.csTicker p.h3 {
  margin-top: 0;
  margin-bottom: 0.5em;
  font-size: 1.3em;
  color: #333333;
  font-weight: bold;
}
@media (min-width: 720px) {
  .csTicker p.h3 {
    margin-bottom: 0.5em;
  }
}
@media (min-width: 1200px) {
  .csTicker p.h3 {
    margin-bottom: 0.5em;
  }
}
.csTicker p.small {
  font-size: 0.875em;
  margin-top: 0.5em;
  color: #5ac9b2;
}
@media (min-width: 720px) {
  .csTicker p.small {
    margin-top: 0.5em;
  }
}
@media (min-width: 1200px) {
  .csTicker p.small {
    margin-top: 0.5em;
  }
}
.csTicker li.featured p.h3, .csTicker li.featured p.small {
  color: #DC0066;
}

@media (max-width: 799px) {
  .csTicker .csTicker__title {
    font-size: 1.2em;
    overflow: hidden;
    padding: 1.3em 6em 0.8em 1em;
    text-align: left !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.csTicker__buttons {
  height: 4em;
  position: absolute;
  right: 0;
  top: 0;
  width: 7em;
  z-index: 200;
}
.csTicker__buttons > div {
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  opacity: 0.6;
}
.csTicker__buttons > div:hover {
  opacity: 1;
}
.buttons__prev-button {
  background: url("../img/arrow_up.png") no-repeat scroll center center rgba(0, 0, 0, 0);
  cursor: pointer;
  float: left;
  height: 4em;
  width: 3em;
}
.buttons__next-button {
  background: url("../img/arrow_down.png") no-repeat scroll center center rgba(0, 0, 0, 0);
  cursor: pointer;
  float: left;
  height: 4em;
  width: 3em;
}
.csTicker.csTicker--mini .csTicker__buttons {
  background: #e8e8e8;
  height: 3em;
  position: absolute;
  right: 0;
  top: 0;
  width: 6em;
  z-index: 200;
}
.csTicker.csTicker--mini .buttons__prev-button {
  height: 3em;
  background: url("../img/arrow_left.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.csTicker.csTicker--mini .buttons__next-button {
  height: 3em;
  background: url("../img/arrow_right.png") no-repeat scroll center center rgba(0, 0, 0, 0);
}
.csTicker.csTicker--horizontal {
  height: auto;
  padding-bottom: 1em;
}
@media (min-width: 720px) {
  .csTicker.csTicker--horizontal {
    padding-bottom: 1em;
  }
}
@media (min-width: 1200px) {
  .csTicker.csTicker--horizontal {
    padding-bottom: 1em;
  }
}
.csTicker.csTicker--horizontal ul > li > .col:last-child {
  min-width: 75%;
}
.csTicker.csTicker--horizontal .buttons__prev-button {
  background: url(../img/arrow_left.png) no-repeat center;
}
.csTicker.csTicker--horizontal .buttons__next-button {
  background: url(../img/arrow_right.png) no-repeat center;
}
.csTicker.csTicker--horizontal ul {
  width: 100000px;
  height: 100%;
}
.csTicker.csTicker--horizontal ul > li {
  float: left;
  display: inline;
  border-bottom: 0;
  width: auto;
}
.csTicker.csTicker--mini {
  height: 3em;
}
.csTicker.csTicker--mini ul > li > .col:first-child {
  display: none;
}
.csTicker li{
  padding-top: 0.8em !important
}
.csTicker.csTicker--mini ul > li > .col:last-child {
  width: 100%;
  padding: 0;
}
.csTicker.csTicker--mini .csTicker__title {
  border-bottom: 0 none;
  display: block;
  float: left;
  font-size: 1em;
  height: auto;
  padding-bottom: 1em;
  padding-right: 1em;
  padding-top: 1em;
}
.csTicker.csTicker--mini ul {
  width: 100000px;
}
.csTicker.csTicker--mini ul > li {
  float: left;
  display: inline;
  width: auto;
}
.csTicker.csTicker--mini li > .col > p.h3, .csTicker.csTicker--mini li > p.h3 {
  display: block;
  font-size: 1em;
  color: #5c5c5c;
  font-weight: normal;
}
.csTicker__title {
  font-family:'Opensans';
  background:#1A86D6 !important;
}

UNTUK KODE JAVASCRIPT NYA

<script type="text/javascript">(function(e){e.fn.csTicker=function(t){function f(t){e(t).find("li").css("width",e(t).outerWidth()-e(t).find(".csTicker__title").outerWidth());e(t).find("ul").css("left",e(t).find(".csTicker__title").outerWidth());e(t).find(".wrapper").css("height",e(t).find("li").outerHeight());e(window).resize(function(){var n=e(t).find(".csTicker__title").outerWidth();e(t).find("li").css("width",e(t).outerWidth()-n);var r=e(t).find("ul").children("li").eq(s).position().left;var i=r-n;e(t).find("ul").css("left",-i);e(t).find(".wrapper").css("height",e(t).find("li").outerHeight())})}function l(n){titleWidth=e(n).find(".csTicker__title").outerWidth();buttonWidth=e(n).find(".csTicker__buttons").outerWidth();var r=e(n).parent().innerWidth();var i;if(r>768){i=3}else if(r>480){i=2}else{i=1}e(n).find("li").css("width",e(n).outerWidth()/i);var o=e(n).find("li").map(function(){return e(this).height()}).get();e(n).find(".wrapper").css("height",Math.max.apply(null,o)+20);e(n).find("ul").animate({left:"-"+e(n).find("ul").children("li").eq(s).position().left},t.speed,"swing");e(window).resize(function(){var r;var i=e(n).parent().innerWidth();if(i>768){r=3}else if(i>480){r=2}else{r=1}e(n).find("li").css("width",e(n).outerWidth()/r);var o=e(n).find("li").map(function(){return e(this).height()}).get();e(n).find(".wrapper").css("height",Math.max.apply(null,o)+20);e(n).find("ul").animate({left:"-"+e(n).find("ul").children("li").eq(s).position().left},t.speed,"swing")})}function c(e){setInterval(function(){h("next",e)},t.delay)}function h(n,r){if(!o){switch(n){case"next":if(s<e(r).find("li").length-1){switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(s+1).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(s+1).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(s+1).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s++}else{switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(0).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(0).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(0).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s=0}break;case"prev":if(s>0){switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(s-1).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(s-1).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(s-1).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s--}else{switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(e(r).find("ul").children("li").length-1).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(e(r).find("ul").children("li").length-1).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(e(r).find("ul").children("li").length-1).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s=0}break}}}var n={tickerMode:"vertical",customCSS:false,delay:5e3,speed:300,autoAnimate:true,buttons:true,highlightFeatured:true,stickyFeature:false,tickerTitle:false,contentFeed:false,feedCount:10,truncateAt:100,linkTarget:"_blank",addEllipsis:false,pauseOnHover:true,backgroundColour:false,titleColour:false,titleTextColour:false};var t=e.extend({},n,t);var r;var i=e(this).attr("id");var s=0;var o=false;if(t.customCSS){e("<link/>",{rel:"stylesheet",type:"text/css",href:customCSS}).appendTo("head")}var u=this;if(t.contentFeed){var a;e.ajax({type:"GET",url:document.location.protocol+"//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q="+encodeURIComponent(t.contentFeed),dataType:"json",error:function(){},success:function(n){a=n.responseData.feed.entries;var r="<ul>";e(a).each(function(){var n=e(this).html();r+="<li>";if(e(this).data("img")){r+='<div class="col"><img src="'+e(this).attr("img")+'"/>';r+='</div><div class="col">'}r+='<p class="h3"><a target="'+t.linkTarget+'" href="'+e(this).attr("link")+'">'+e(this).attr("title")+"</a></p>";if(t.truncateAt){var i=e(this).attr("contentSnippet").substr(0,t.truncateAt);i=i.substr(0,Math.min(i).length,i.lastIndexOf(" "))}else{var i=e(this).attr("contentSnippet")}if(t.addEllipsis){i+="..."}r+="<p>"+i+"</p>";r+='<p class="small">'+e(this).attr("author")+" - "+e(this).attr("publishedDate")+"</p>";if(e(this).data("img")){r+="</div>"}r+="</li>"});e(u).append(r+"</ul>").find(".csTicker__spinner").remove();f(u)}});e(this).append('<div class="csTicker__spinner"><img src="img/spinner.gif" /></div>')}if(t.tickerTitle){e(this).prepend('<div class="csTicker__title">'+t.tickerTitle+"</div>")}e(this).find("ul").wrap('<div class="wrapper"></div>');if(t.buttons){e(this).prepend('<div class="csTicker__buttons"><div class="buttons__prev-button"></div><div class="buttons__next-button"></div></div>')}if(!t.contentFeed){e(this).find("li").each(function(){var n=e(this).html();if(t.highlightFeatured&&e(this).data("featured")==true){e(this).addClass("featured")}var r="";if(e(this).data("img")){r+='<div class="col">';r+='<img src="'+e(this).data("img")+'"/>';r+='</div><div class="col">'}if(e(this).data("title")){r+='<p class="h3"><a target="'+t.linkTarget+'" href="'+e(this).data("link")+'">'+e(this).data("title")+"</a></p>"}if(t.truncateAt){var i=n.substr(0,t.truncateAt);i=i.substr(0,Math.min(i).length,i.lastIndexOf(" "))}else{var i=n}if(t.addEllipsis){i+="..."}r+="<p>"+i+"</p>";if(e(this).data("meta")){r+='<p class="small">'+e(this).data("meta")+"</p>"}if(e(this).data("img")){r+="</div>"}e(this).empty().append(r)})}e(this).addClass("csTicker");switch(t.tickerMode){case"horizontal":e(this).addClass("csTicker--horizontal");l(this);break;case"mini":e(this).addClass("csTicker--mini");f(this);break;case"grid":e(this).addClass("csTicker--grid");break;default:break}if(t.backgroundColour){e(this).css("background",t.backgroundColour)}if(t.titleColour){e(this).find(".csTicker__title").css("background",t.titleColour)}if(t.titleTextColour){e(this).find(".csTicker__title").css("color",t.titleTextColour)}if(t.pauseOnHover){e(u).find("ul").mouseenter(function(){o=true}).mouseleave(function(){o=false})}return this.each(function(){var n=e(this);if(t.autoAnimate){c(n)}if(t.buttons){e(this).find(".buttons__prev-button").click(function(){h("prev",n)});e(this).find(".buttons__next-button").click(function(){h("next",n)})}})}})(jQuery);(function(e){e.fn.csTicker=function(t){function f(t){e(t).find("li").css("width",e(t).outerWidth()-e(t).find(".csTicker__title").outerWidth());e(t).find("ul").css("left",e(t).find(".csTicker__title").outerWidth());e(t).find(".wrapper").css("height",e(t).find("li").outerHeight());e(window).resize(function(){var n=e(t).find(".csTicker__title").outerWidth();e(t).find("li").css("width",e(t).outerWidth()-n);var r=e(t).find("ul").children("li").eq(s).position().left;var i=r-n;e(t).find("ul").css("left",-i);e(t).find(".wrapper").css("height",e(t).find("li").outerHeight())})}function l(n){titleWidth=e(n).find(".csTicker__title").outerWidth();buttonWidth=e(n).find(".csTicker__buttons").outerWidth();var r=e(n).parent().innerWidth();var i;if(r>768){i=3}else if(r>480){i=2}else{i=1}e(n).find("li").css("width",e(n).outerWidth()/i);var o=e(n).find("li").map(function(){return e(this).height()}).get();e(n).find(".wrapper").css("height",Math.max.apply(null,o)+20);e(n).find("ul").animate({left:"-"+e(n).find("ul").children("li").eq(s).position().left},t.speed,"swing");e(window).resize(function(){var r;var i=e(n).parent().innerWidth();if(i>768){r=3}else if(i>480){r=2}else{r=1}e(n).find("li").css("width",e(n).outerWidth()/r);var o=e(n).find("li").map(function(){return e(this).height()}).get();e(n).find(".wrapper").css("height",Math.max.apply(null,o)+20);e(n).find("ul").animate({left:"-"+e(n).find("ul").children("li").eq(s).position().left},t.speed,"swing")})}function c(e){setInterval(function(){h("next",e)},t.delay)}function h(n,r){if(!o){switch(n){case"next":if(s<e(r).find("li").length-1){switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(s+1).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(s+1).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(s+1).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s++}else{switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(0).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(0).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(0).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s=0}break;case"prev":if(s>0){switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(s-1).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(s-1).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(s-1).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s--}else{switch(t.tickerMode){case"mini":e(r).find("ul").animate({left:"-"+(e(r).find("ul").children("li").eq(e(r).find("ul").children("li").length-1).position().left-e(r).find(".csTicker__title").outerWidth())},t.speed,"swing");break;case"horizontal":e(r).find("ul").animate({left:"-"+e(r).find("ul").children("li").eq(e(r).find("ul").children("li").length-1).position().left},t.speed,"swing");break;default:e(r).find("ul").animate({top:"-"+(e(r).find("ul").children("li").eq(e(r).find("ul").children("li").length-1).position().top-e(r).find(".csTicker__title").outerHeight())},t.speed,"swing");break}s=0}break}}}var n={tickerMode:"vertical",customCSS:false,delay:5e3,speed:300,autoAnimate:true,buttons:true,highlightFeatured:true,stickyFeature:false,tickerTitle:false,contentFeed:false,feedCount:10,truncateAt:100,linkTarget:"_blank",addEllipsis:false,pauseOnHover:true,backgroundColour:false,titleColour:false,titleTextColour:false};var t=e.extend({},n,t);var r;var i=e(this).attr("id");var s=0;var o=false;if(t.customCSS){e("<link/>",{rel:"stylesheet",type:"text/css",href:customCSS}).appendTo("head")}var u=this;if(t.contentFeed){var a;e.ajax({type:"GET",url:document.location.protocol+"//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q="+encodeURIComponent(t.contentFeed),dataType:"json",error:function(){},success:function(n){a=n.responseData.feed.entries;var r="<ul>";e(a).each(function(){var n=e(this).html();r+="<li>";if(e(this).data("img")){r+='<div class="col"><img src="'+e(this).attr("img")+'"/>';r+='</div><div class="col">'}r+='<p class="h3"><a target="'+t.linkTarget+'" href="'+e(this).attr("link")+'">'+e(this).attr("title")+"</a></p>";if(t.truncateAt){var i=e(this).attr("contentSnippet").substr(0,t.truncateAt);i=i.substr(0,Math.min(i).length,i.lastIndexOf(" "))}else{var i=e(this).attr("contentSnippet")}if(t.addEllipsis){i+="..."}r+="<p>"+i+"</p>";r+='<p class="small">'+e(this).attr("author")+" - "+e(this).attr("publishedDate")+"</p>";if(e(this).data("img")){r+="</div>"}r+="</li>"});e(u).append(r+"</ul>").find(".csTicker__spinner").remove();f(u)}});e(this).append('<div class="csTicker__spinner"><img src="img/spinner.gif" /></div>')}if(t.tickerTitle){e(this).prepend('<div class="csTicker__title">'+t.tickerTitle+"</div>")}e(this).find("ul").wrap('<div class="wrapper"></div>');if(t.buttons){e(this).prepend('<div class="csTicker__buttons"><div class="buttons__prev-button"></div><div class="buttons__next-button"></div></div>')}if(!t.contentFeed){e(this).find("li").each(function(){var n=e(this).html();if(t.highlightFeatured&&e(this).data("featured")==true){e(this).addClass("featured")}var r="";if(e(this).data("img")){r+='<div class="col">';r+='<img src="'+e(this).data("img")+'"/>';r+='</div><div class="col">'}if(e(this).data("title")){r+='<p class="h3"><a target="'+t.linkTarget+'" href="'+e(this).data("link")+'">'+e(this).data("title")+"</a></p>"}if(t.truncateAt){var i=n.substr(0,t.truncateAt);i=i.substr(0,Math.min(i).length,i.lastIndexOf(" "))}else{var i=n}if(t.addEllipsis){i+="..."}r+="<p>"+i+"</p>";if(e(this).data("meta")){r+='<p class="small">'+e(this).data("meta")+"</p>"}if(e(this).data("img")){r+="</div>"}e(this).empty().append(r)})}e(this).addClass("csTicker");switch(t.tickerMode){case"horizontal":e(this).addClass("csTicker--horizontal");l(this);break;case"mini":e(this).addClass("csTicker--mini");f(this);break;case"grid":e(this).addClass("csTicker--grid");break;default:break}if(t.backgroundColour){e(this).css("background",t.backgroundColour)}if(t.titleColour){e(this).find(".csTicker__title").css("background",t.titleColour)}if(t.titleTextColour){e(this).find(".csTicker__title").css("color",t.titleTextColour)}if(t.pauseOnHover){e(u).find("ul").mouseenter(function(){o=true}).mouseleave(function(){o=false})}return this.each(function(){var n=e(this);if(t.autoAnimate){c(n)}if(t.buttons){e(this).find(".buttons__prev-button").click(function(){h("prev",n)});e(this).find(".buttons__next-button").click(function(){h("next",n)})}})}})(jQuery);  $('.J-PB').csTicker({
				contentFeed:'http://www.alexjoen.web.id/feeds/posts/default', 
        tickerTitle: 'News and Updates', 
				tickerMode: 'mini', 
				buttons: false, 
				speed: 1200
			});</script>

Catatan :
Silakan ganti link : http://www.alexjoen.web.id Dengan alamat blog sobat, terimaksih

J-PB Go To web.id

2013-10-18T15:36:00.000+07:00

Alhamdulillah
Puji syukur kehadirat Allah Swt.

Setelah menyimak beberapa saran dari sobat blogger pada komentar di artikel High Quality Premium Blogger Template tentang pemilihan template serta domain yang cocok buat J-PB, Akirnya pada hari Kamis, 17 Oktober 2013 J-PB berganti domain dari blogspot ke web.id. dengan menggunakan jasa Rajawebhost.

Maksud dan Tujuan :

Maksud dari penggantian template serta domain ini didasarkan karena hoby saya terhadap dunia blogging yang tidak pernah surut serta karena dukungan sahabat blogger mungkin dengan tampilan B-PRESS blog J-PB kecipratan Presh dalam menyuguhkan artikel kepada sobat-sobat ane tercinta. selain itu maksud dan tujuan ane merubah domain serta template diantaranya :

1. Web.id adalah salah satu domain ciri khas indonesia

2. Ingin adanya sedikit perubahan ( meskipun blog ini hanya menyajikan hal-hal yang sipatnya biasa )

3. Dengan gantinya domain serta template dapat menjadi motivasi untuk tetap blogging.

4. Web.id memiliki harga yang sangat murah Rp. 55.000/tahunnya.

Mungkin hanya itu alasan serta tujuan beralihnya J-PB dari domain Blogspot, ke Web. Id. nah dalam kesempatan ini karena saya sangat senang dapat berganti domain saya akan sedikit berbagi kepada sahabat blogger, mungkin di antara sobat blogger ada yang pernah membaca artikel saya tentang High Quality Premium Blogger Template untuk itu pada kesempatan ini saya berniat memberikan template premium secara cuma-cuma namun hanya kepada 5 orang saja template yang akan saya berikan hanya satu dan selain B-PRESS, bagi yang berminat silakan pilih templatenya di artikel High Quality Premium Blogger Template dan PM ane dengan format :

Nama      : ....................
Url Blob    : ....................
Nama Template : ....................
Email            : ....................

Demikian artikel ini semoga dapat menjadi motivasi bagi sahabat blogger......!!!

High Quality Premium Blogger Template

2013-10-12T10:38:00.000+07:00

High Quality Premium Blogger Template - Entah kenapa pada artikel kali ini saya menulis judul seperti ini namun pada kesempatan ini saya tidak akan menshare kepada sobat seperti pada judul artikel ini, melainkan saya agak kebingungan dengan pilihan template.

Jadi maksudnya begini tiba-tiba aja dalam benak saya ada niatan untuk mengganti template yang sekarang ini melekat namun bingung harus pilih template yang kaya gimana, setelah browsing nyari-nyari template yang pas, saya sempet terpikat dengan beberapa template keren namun PREMIUM, tapi demi sebuah kepuasan apalah artinya sedikit rupiah, maksud ditulisnya artikel ini mungkin sobat blogger bisa membantu saya dalam memilih template yang pas dengan Blog J-PB.

Dibawah ini ada beberapa template Premium yang salah satunya insya allah akan saya terapkan nantinya, namun saya mohon bantuan sobat blogger untuk memberikan masukan tentang kekurangan serta kelebihan template-template dibawah ini.

1. Maxxiz - Live Previev - Demo Template

2. Sevida - Live Preview - Demo Template

3. Rifkiy - Live Preview- Demo Template

4. Cody - Live Preview - Demo Template

5. Flat News - Live preview - Demo Template

Demikian sobat blogger beberapa template pilihan, mohon bantuan kepada sobat blogger untuk memberikan masukan tentang kekurangan serta kelebihan dari template-template di atas terimaksih.

And satu lagi yang ketinggalan, ane juga ada rencana ubah domain ke web.id kira-kira ada saran penyedia domain yang bagus...???

Membuat Image Conten Overlay

2013-10-09T12:43:00.002+07:00

INFO

Kau Selalu Dihatiku

Rasanya baru kemarin kita bersatu
Berjanji seia sekata di depan penghulu
Kaupun tertunduk malu tanda setuju
Mereka pun yang hadir ikut berseru.

Maafkan aku bila belum membahagiakanmu Maafkan aku bila belum menunaikan janjiku Namun percayalah, kebahagiaan itu sederhana Sangat sederhana, asalkan kita mau menerima.

Image Conten Overlay - Mengandung arti kurang lebih sebuah gambar yang memiliki penjelasan atau deskripsi namun konten dari deskripsi tersebut dibuat secara tersembunyi dan barulah ketika sebuah kursor diarahkan ke gambar tersebut akan terbuka deskripsi atau penjelasannya.

Nah Kali ini J-PB setelah sekian lama tidah menulis artikel tentang tutorial maka pada kesempatan ini ane akan menyajikan kepada sobat blogger tentang cara Membuat Image Conten Overlay hanya dengan CSS dan HTML, untuk lebih jelasnya silakan disimak, dan untuk demo dari tutorial ini silaka dilihat pada gambar di atas dan arahkan pointer sobat pada tulisan "INFO" yang ada pada gambar diatas.

UNTUK KODE HTML NYA


<div class="contentnya">
  <div class="overlaynya"></div>
  <div class="corner-overlay-content">INFO</div>
  <div class="overlay-content">
    <h2>Judul Kalimat</h2>
    <p>Isi Kalimat</p>
  </div>
</div>

UNTUK KODE CSS NYA


p {
  margin: 0;
  padding: 0;
}
.contentnya{
  background: url(http://2.bp.blogspot.com/-4iHait6IwyU/UX3TbhB_eiI/AAAAAAAAGFk/dVEmWb8iZWE/s400/Cewek+Cantik+Berjilbab2.jpg);
  border : 2px solid #333;
  height: 350px;/* Tinggi gambar dan konten */
  margin: 20px auto;
  overflow: hidden;
  position: relative;
  width: 350px;/* kebar gambar dan konten */
}
.contentnya .overlaynya {
  border-bottom: 100px solid #e8c63d;
  border-left: 100px solid transparent;
  bottom: 0;
  height: 0;
  opacity: .95;
  position: absolute;
  right: 0;
  text-indent: -9999px;
  transition: all 0.5s ease-out;
  width: 0;
}
.contentnya:hover .overlaynya {
  border-bottom: 800px solid #e8c63d;
  border-left: 800px solid transparent;
  transition: all 0.5s ease-out;
}
.contentnya .corner-overlay-content {
  bottom: 15px;
  color: #333;
  position: absolute;
  right: 15px;
  transition: all 0.5s ease-out;
}
.contentnya:hover .corner-overlay-content {
  opacity: 0;
  transition: all 0.5s ease-out;
}
.contentnya .overlay-content {
  bottom: 0;
  color: #333;
  left: 0;
  opacity: 0;
  padding: 30px;
  position: absolute;
  right: 0;
  top: 0;
  transition: all 0.3s ease-out;
}
.contentnya .overlay-content h2 {
  border-bottom: 1px solid #333;
  padding: 0 0 12px;
}
.contentnya:hover .overlay-content {
  opacity: 1;
  transition: all 0.3s ease-out;
  transition-delay: 0.3s;
}

Untuk url gambar :

( Silakan disesuaikan dengan gambar sobat ).

About Me

2013-10-03T10:46:00.003+07:00

About Me

Muhammad Alex Junaedi ( Alex )

Memberikan sebuah nama terhadap seseorang yang lahir kedunia adalah kewajiban setiap orang tua, dan Muhammad Alex Junaedi adalah sebuah pemberian yang luar biasa bagi saya dari orang tua tercinta, Saya sangat bersyukur kepada Allah Swt. karena kedua orang tua telah memberikan nama tersebut, dari nama asli saya diatas kemudian timbul perpecahan diantara sobat dan kerabat ada yang memanggil dengan sebutan "Alex" ada juga yang memanggil "Jun" bagi saya panggilan tersebut tidak menjadi suatu masalah yang penting enak aja. Saya terlahir dari tiga bersaudara dan saya kebetulan anak pertama yang hidup di sebuah pedesaan kecil bernama "Kalapanunggal" di daerah Kabupaten Sukabumi.
Back To Home

My Contact

Bagi sobat blogger yang ingin berinteraksi langsung atau berteman lebih silakan kontak saya di :

Ngeblog....!!!

Kapan awal mula saya ngeblog saya sendiri gak terlalu ingat dengan jelas namun waktu itu sebagai media online saya menggunakan sebuah HP Sony Ericson K310 sebagai modem dengan pulsa GPRS harga Rp. 5.000,- dengan kuota 4 jam hehhehe.

Kegiatan Sekarang

Kegiatan saya setiap hari adalah kerja pada sebuah perusahaan swasta yang bergerak dibidang Exspedisi dan tradding Company di daerah saya tinggal. dan jika ada waktu senggang baru tuh ane ngeblog.
Tempat Kerja Ane

Status....!!!

Status ane udah Nikah dan alhamdulillah udah punya seorang anak perempuan yang cantik bernama "Meisya Putri Pratami" kami hidup dalam sebuah keluarga keci yang bahagia disebuah pedesaan kecil yang terletak di bawah kaki Gunung Salak - Sukabumi.

Back To Home

Algoritma Update To Google’s Hummingbird

2013-10-02T12:51:00.003+07:00

Algoritma Update To Google’s Hummingbird - Google menandai ulang tahun kelima belas pada hari Kamis dengan revisi algoritma mesin pencari yang disebut "Hummingbird" atau tepatnya Sabtu, 28 September 2013 Google telah melakukan perubahan algoritma terhadap pola cara membaca kata kunci yang ditulis pada browser dengan keberadaan kata kunci tersebut pada situs yang relevan. Dengan update ini banyak yang bertanya-tanya :

Apakah traffikku akan anjlok....?
Apakah ranking situs-situsku akan berjatuhan....?
Apakah earningku akan ikut terjun bebas juga....?
Dan Apakah Para Master atau Mastah Juga Cemas....?

Mungkin dengan mendengar Update Aloritma ke Hummingbirdpertanyaan-pertanyaan di atas timbul dengan sendirinya dibenak sobat blogger begitupun yang terjadi dengan saya pribadi. Perubahan algoritma yang dijuluki update Hummingbird , kurang lebih dibuat dalam upaya lain oleh Google untuk lebih melayani kebutuhan pengguna mereka. Dengan perangkat mobile dan tablet yang menawarkan kemampuan untuk pencarian verbal.

Algoritma Update To Google’s Hummingbird - Jika dalam 12 tahun terakhir ini Google lebih menekankan pada Kesesuaian Kata Kunci maka terhitung sejak september kemarin Google Algoritma lebih menekankan kepada "Hati atau Persaan" jadi artinya kali ini Google lebih sensitif dalam menelusuri sebuah blog atau situs-situs yang akan disuguhkan kepada audien, Dalam dunia seo, keyword (kata kunci) dapat diperlihatkan secara jelas pada sebuah artikel. Misalnya, kata kunci selalu ada pada judul, deskripsi maupun isi artikel dengan pengulangan keyword pada setiap paragraf. Pola peletakan yang jelas seperti ini memang sangat di sukai search engine selama 12 tahun. Tetapi di akhir September 2013, pola yang jelas itu malah mulai ditinggalkan. Search engine raksasa ini lebih menyukai keyword yang tersamar (latent keyword).

Menurut Danny Sullivan, " Google Hummingbird digunakan sekitar sebulan yang lalu, namun baru hari kamis yang lalu Google mengumumkan perubahan ini . "

Kemudian dengan Update ini sobat mungkin bertanya lagi "Apa dampaknya bagi SEO.....???

Eitttsss tunggu dulu untuk melepas ketegangan akibat update ini sebaiknya sobat rilex dulu, deampak jelas pasti ada namun sobat blogger tidak mesti terlalu tegang karena update kali ini tidak seperti pada Update Panda dan Penguin jadi Enjoyyy aja. Namun antisipasi harus kita lakukan dibawah ini adalah tips sederhana untuk menghadapi Update Google’s Hummingbird :

Cara terbaik saat ini adalah membuat konten yang relevan untuk blog/situs sobat, hindari spaming, situs yang memiliki pembahasan spesifik akan lebih disukai oleh google hummingbird daripada blog/web dengan tema campur aduk, perkaya konten dengan fitur seperti konten multi media, pikirkan juga kemungkinan pengunjung yang datang dari perangkat seperti tablet, smartphone android, iphone, dan sebagainya. Selain itu, algoritma hummingbird lebih menyukai konten penuh interaksi antara pembuat konten dan pengunjung/pembaca konten, blog/web memiliki fitur chat, tanya jawab, forum, dan yang lainnya lebih disukai google.

Demikian artikel kali ini semoga artikel ini dapat sedikit lebih memberi gambaran tentang Update Google’s Hummingbird.

On the History of Blogger

2013-09-07T10:07:00.000+07:00

On the History of Blogger

sejarah

Kali ini ane gak posting Tutorial atau trik dalam dunia blogger hanya tes sebuah postingan dalam konsep yang berbeda namun untuk mengisi pos saya ini agar terkesan tidak hanya nulis ane share Sejarah Singkat Mengenai blogger moga aja postingan ini bermanfaat untuk sobat blogger.

Pada 23 Agustus 1999, Blogger diluncurkan oleh Pyra Labs. Sebagai salah satu perangkat publikasi blog pertama di dunia, Blogger berperan dalam mempopulerkan format blog di dunia. Pada Februari 2003, Pyra Labs diakusisi oleh Google, membuat sejumlah fitur premium Blogger yang sebelumnya dikomersialkan Pyra Labs menjadi layanan yang sepenuhnya gratis. Pada Oktober 2004, salah satu pendiri Pyra Labs, Evan Williams, mengundurkan diri dari Google.

Pada tahun 2004, Google membeli Picasa, dan mengintegrasikannya dengan Blogger sehingga pengguna Picasa dapat mempublikasikan koleksi foto miliknya ke situs blognya.

Pada 9 Mei 2004, Blogger memperkenalkan beberapa perubahan besar pada sistem publikasi blognya, menambahkan fitur seperti templat yang memenuhi standar web, halaman arsip individual untuk masing-masing posting dan komentar, serta fitur posting melalui email.

Pada 14 Agustus 2006, Blogger meluncurkan versi terbarunya dalam tahap beta, yang diberi nama kode "Invader". Versi terbaru ini memigrasikan pengguna Blogger ke server milik Google dan menambahkan beberapa fitur baru. Pada Desember 2006, versi baru ini keluar dari tahap beta. Mei 2007, Blogger selesai memigrasikan semua data penggunanya ke server Google.

Desain Ulang

Sebagai bagian dari desain ulang Blogger di tahun 2006, semua blog yang ada di Blogger dimigrasikan ke server Google. Blogger mengklaim bahwa dengan migrasi tersebut, layanan mereka lebih stabil karena kualitas server yang dimiliki Google lebih baik dari sebelumnya.

Seiring dengan migrasi layanan Blogger ke server Google ini, beberapa fitur baru diperkenalkan, meliputi manajemen label, antarmuka penataan layout template dengan cara geser-dan-letakkan (drag-and-drop), izin pembacaan blog (untuk membuat blog-blog pribadi) dan opsi web feed yang baru. Lebih lanjut, kini setiap blog diperbaharui secara dinamis, berbeda dengan sebelumnya di mana setiap posting atau komentar baru diperlakukan dengan menulis ulang file HTML.

Pada September 2009, Google memperkenalkan fitur baru sebagai bagian dari perayaan ulang tahunnya yang kesepuluh. Fitur tersebut meliputi tampilan baru untuk menulis post, penyempurnaan penanganan gambar, dan implementasi berbasis Google Docs lainnya, seperti:

Menambahkan lokasi penulisan di post.
Penanggalan tulisan ditentukan pada saat publikasi, bukan saat pembuatan.
Pengubahan tautan di mode penulisan (Compose mode).
Layanan penuh bagi Safari 3.
Tampilan pratayang yang menampilkan post dengan perkiraan lebar tulisan dan ukuran font ketika tulisan tersebut dipublikasikan.
Toolbar yang baru dengan tampilan khas Google, waktu pemuatan yang lebih cepat, dan tombol Undo serta Redo.

Pada tahun 2010, Blogger memperkenalkan template baru dan melakukan desain ulang situsnya.
Pada tahun 2013, Blogger mengupdate fitur fiturnya salah satunya fitur komentar dan integrasi pada google+, ada beberapa fitur baru diantaranya :

Design Antar Muka yang diperbaharui pada tahun 2012
Integrasi langsung dengan google adsense, tahun 2012
Integrasi dengan google+ pada kotak komentar dan posting, tahun 2013
Fitur mobile template yang mana kita bisa mendesign atau memilih design yang telah disediakan sehingga pengguna dapat melihat blog pada Handphone atau Gadget mereka dengan design yang tersesuaikan ( responsive ).

s e k i a n

Sumber : http://id.wikipedia.org

Cara Meningkatkan Traffic Google Organik

2013-09-02T13:06:00.000+07:00

Seperti halnya pada postingan yang telah lampau yang ane tulis tentang 5 Cara Efektif untuk Membangun Backlinks Organik dan postingan kali ini pun masih terkait dengan hal tersebut.

Lalu lintas yang dilakukan Google mencakup semua kunjungan ke blog sobat, baik yang berasal dari pencarian kata kunci di mesin pencari Google . Website dan pemilik blog yang ingin membangun audiens, mereka sangat tertarik dalam meningkatkan peringkat bahwa konten kita berada dalam pencarian kata kunci Google . Sebagai contoh, bukannya hasil ke-50 untuk pencarian kata kunci yang relevan , namun yang kita inginkan menjadi #1 atau menjadi 10 besar di pencarian google.

Dalam hal ini tentunya ada banyak trik optimasi mesin pencari yang dapat sobat blogger gunakan untuk meningkatkan peringkat pencarian Google, untuk kata kunci yang berhubungan dengan blog sobat misalnya . Banyak blogger dan pemilik situs web mencoba untuk menghindari algoritma Google dengan membayar untuk link ke situs mereka dan kegiatan lainnya yang dapat membantu meningkatkan peringkat pencarian mereka dalam jangka pendek tapi bisa melanggar kebijakan Google dan menyakiti blog mereka dalam jangka tertentu.

Cara yang lebih baik untuk meningkatkan lalu lintas Google ke blog sobat adalah organik . Dengan berkonsentrasi membangun sebuah blog yang besar dan tentunya orang ingin membaca, berbicara tentang, dan berbagi , peringkat pencarian sobat akan tumbuh secara alami . Dan Jenis pertumbuhan merupakan hal yang sangat kuat dan menyebabkan benjolan lalu lintas yang akan berlangsung untuk waktu yang sangat lama..

Berikut 5 cara untuk meningkatkan lalu lintas organik Google ke blog sobat :

1 . Kualitas Konten untuk Pembaca Sobat, Bukan untuk Mesin Pencari
Salah satu faktor yang paling penting bahwa Google dan mesin pencari lainnya berat ketika harus menentukan hasil pencarian peringkat adalah kualitas website dan blog . Itu berarti konten sobat harus difokuskan pada niche topik blog sobat , sehingga audiens sobat terus mendapatkan konten yang bermanfaat dan segar untuk dibaca. Google harus mengidentifikasi blog sobat sebagai tujuan untuk konten yang spesifik , yang hanya dapat membantu peringkat pencarian sobat dan lalu lintas Google, bukan seperti blog ini yang nulis pos asal-asalan dan update artikel gak karuan, hehheheh.

2 . Membuat sesuatu yang berbeda supaya audiens betah di blog kita.
Google juga mempertimbangkan berapa lama orang bertahan di blog sobat dalam algoritma pencarian . Ketika orang bertahan dan mengunjungi beberapa halaman dan posting di blog sobat dalam satu kunjungan , yang memberitahu Google bahwa konten sobat relevan dan berguna atau menarik . Dengan itu dalam pikiran, meluangkan waktu untuk membuat navigasi yang user -friendly yang membawa pengunjung ke konten yang terkait, topik yang hangat, dan konten lain di blog sobat yang bisa membuat mereka tertarik untuk sedikit lebih lama bertamu mungkin artikel terkait sangat penting diterapkan, low ana malas aja pasangnya. D:

3 . Memastikan Pengalaman Pengguna Selalu Baik
Memastikan bahwa pengalaman pengguna di blog sobat selalu baik memainkan peran penting dalam meningkatkan lalu lintas Google organik . Ingat, karena Google menganggap jumlah orang menghabiskan waktu di blog sobat dalam algoritma pencarian, pengalaman pengguna yang buruk yang dapat membuat pengunjung bisa membuat cacat lalu lintas Google sobat. Oleh karena itu, pastikan sobat memiliki web hosting yang handal, merapikan navigasi sobat, menghilangkan kekacauan pada halaman blog sobat, dan membuat link ke konten yang relevan dan menarik agar mudah untuk menemukan link terkait dengan postingan sobat.

Web hosting yang baik juga penting karena Google melihat pada kecepatan load halaman untuk halaman di blog sobat dan situs peringkat dengan beban halaman lebih lebih tinggi daripada situs dengan halaman kecepatan rendah atau lambat . Pastikan akun hosting sobat memberikan blog sobat yang terbaik mungkin kecepatan load halamannya.

4 . Gunakan Link Internal tapi Jangan Berlebihan Internal Link
Pasang internal link dalam posting blog sobat yang mengarah ke konten terbaik Sobat, konten tambahan yang berguna, dan konten terkait dapat membantu untuk meningkatkan lalu lintas organik Google sobat. Dengan menggambar memperhatikan konten terbaik dan paling berguna, orang akan menghargai blog sobat lebih dan lebih mungkin untuk membaca posting tambahan, berbagi posting dengan jaringan sosial mereka, dan kembali ke blog sobat lagi.

Semua kegiatan ini membantu untuk meningkatkan lalu lintas pencarian organik, sehingga termasuk link internal dalam posting blog sobat. Hanya berhati-hatilah untuk tidak membuatl link internal ke dalam posting sobat secara berlebihan karena bisa terlihat seperti spammer. karena hal tersebut akan menimbulkan pandangan yang negatif dari google.

5 . Hindari Trik SEO Jangka Pendek yang bisa mendevaluasi Blog sobat
Seperti contoh sobat membayar beberapa link masuk untuk meningkatkan otoritas blog sobat di algoritma Google, yang seharusnya meningkatkan lalu lintas Google ke blog sobat.

Gunakan taktik jangka pendek etis mesin pencari optimasi untuk meningkatkan upaya-upaya sobat untuk menulis banyak konten berkualitas. Saya menyebutnya " shareworthy " konten ( Sumber : " 30 - Menit Social Media Marketing , " McGraw -Hill , 2010) , dan itu hal yang paling berharga yang dapat sobat buat untuk meningkatkan SEO, lalu lintas Google organik dan pertumbuhan blog sobat.

Demikian artikel tentang Cara Meningkatkan Traffic Google Organik dan silakan di lihat juga 5 Cara Efektif untuk Membangun Backlinks Organik

Sejarah Singkat Google Search

2013-08-13T11:08:00.000+07:00

Sebelumnya J-PB mengucapkan Minal Aidzin Walfaidzin Mohon Maaf Lahir dan Bathin.

Ketika seorang Blogger, Develover ataupun Web Designer mengolah Web/Blog takan terlepas dari yang namanya Search Engine dan ketika seseorang berbicara Search Engine pasti yang pertama muncl dalam benak kita adalah Google, Namun tak banyak orang yang tau sejarah perkembangan Search Engine Google ini, untuk itu kali ini J-PB akan menuliskan sedikit tentang sejarah perkembangan Search Engin Google darimasa kemasa.

Google Inc. (NASDAQ: GOOG) didirikan pada 7 September 1998 di ruang garasi rumah teman mereka di Menlo Park, California. Pada Februari 1999, perusahaan tersebut pindah ke kantor di 165 University Ave., Palo Alto, California sebelum akhirnya pindah ke “Googleplex” pada akhir tahun tersebut.

Januari 1996: Revolusi Dimulai

Januari 1996, banyak yang tidak menyadari perubahan dunia internet akan bermula dari sini. Di suatu tempat di kantor Alta Vista dengan seorang eksekutif yang berpikiran cerdas.

September 1998: Google Show Time
Setelah mendaftarkan nama tahun sebelumnya, Google didirikan pada September 1998.sebuah mesin pencari segar yang akan mengambil alih dunia.

September 2002: Kemitraan Google dengan Arthur Murray
Shuffle besar pertama hasil pencarian diluncurkan pada set profesional SEO.

Februari-Juli 2003: Gratis Bulanan
Dimulai dengan update Boston, dan berjalan melalui Cassandra, Dominic, Esmerelda dan update Fritz, Google terus proses mereka menjaga SEO profesional yang sehat.

September 2003: Supplementally Berbicara
Google membagi indeks keluar, membuang semua halaman-halaman demi mengembangkan SEO profesional.

November 2003: Florida - Semuanya Perubahan
Ini adalah masalah besar, Google menindak segala macam taktik yang buruk, Seperti yang di harapkan SEO profesional bereaksi dengan baik terhadap perubahan ini.

Agustus 2004: IPO Google - Banyak Uang di Hasilkan
Beberapa tahun setelah gelembung teknologi meledak Google go public. Ada banyak sukacita dari orang-orang profesional SEO yang menyadari bahwa Google memang tuan baru di dunia maya.

Mei 2007: Google Membawa pada Semesta
Tentu ada update lain dan hal-hal yang terjadi antara IPO dan pembaruan Universal Search, tapi judul tidak termasuk kata 'singkat', jadi kami melewatkan beberapa bit.

Mei 2007 melihat peluncuran Universal Search, tiba-tiba tidak ada lagi 10 link biru, Anda bisa melihat video dari George Formby, gambar Neil Gaiman, dan berita baru, segera menjadi hit, "Bionic Woman" remake dibintangi Michelle Ryan langsung dalam hasil pencarian Anda. SERPs baru yang hidup dan segar, dan membuka jalan baru bagi para profesional SEO.

Mei 2007-Mei 2010: Nothing to See
dalam kurun waktu ini tidak begitu terlihat perubahan yang nampak dari Search Engine Google.

Juni 2010: Hasil berkafein
Google meluncurkan pembaruan infrastruktur Kafein baru mereka setelah memberikan profesional SEO sekitar 7 bulan untuk bermain dengan itu dan memberikan umpan balik. Hal ini meningkatkan kecepatan dan juga menghasilkan indeks yang lebih segar.

Desember 2010: Pertemuan Sosial
Google, dan Bing (keduanya mesion pencari yang handal menurut ane), mengumumkan bahwa mereka memang melihat data sosial dan menggunakannya untuk mempengaruhi peringkat. Mereka yang sebelumnya telah meramalkan hal ini dan telah membuat pindah ke sosial mulai bernyanyi tentang kegembiraan mereka di panci Google emas di ujung pelangi ganda mereka wkkwkkwkwk...........

Februari 2011 (dan setiap beberapa minggu setelah itu): Kung Fu Panda ambil peranan
Update Panda pertama kali diluncurkan, memukul ke bawah situs berkualitas rendah. Mereka yang dioperasikan dalam Pedoman Webmaster, memiliki situs berkualitas baik hanya duduk kembali dan menyaksikan situs mereka naik di SERPs mendapatkan lalu lintas situs lain yang hilang terkena amukan si panda

Juni 2011: Search Engine yang Licik
Schema.org diumumkan oleh Google dan dua mesin pencari utama lainnya pada waktu itu. Ini berarti Anda bisa menyediakan data Anda dalam standar.

Oktober 2011: Anda Tidak Benar-benar Perlu Data Anda, ???
Dalam kepentingan privasi, dan melindungi pengguna, Google master kami memutuskan bahwa pemilik situs tidak benar-benar perlu untuk melihat semua data mereka dalam analisis mereka, dan mereka hanya akan menjentikkan jari mereka dan "tidak menyediakan" sebagian kecil kata kunci anyway ... (persentase kecil tampaknya didefinisikan sebagai sesuatu yang kurang dari 100 persen).

April 2012: Attack of the Penguins
Update besar berikutnya Google (ada banyak orang lain di antara dan setelah) adalah Penguin. Ini serangkaian update (keempat yang membingungkan bernama Penguin 2.0) berfokus pada konten spam, dan sekali lagi terbukti menjadi hit besar lalu lintas untuk situs yang tidak melakukan hal-hal "cara Google".

Januari 2013: Ambil Gambar, Itu akan Tetap di SERPs Lagi
Google membuat perubahan ke SERPs gambar. Tidak ada lagi mengklik pada gambar membawa Anda ke halaman sumber, melainkan mengembang di SERP. Google menjelaskan ini sebagai perbaikan sebagai studi mereka menunjukkan tingkat konversi untuk situs naik .

Juli 2013: Panda sudah Getting Better
Google meluncurkan pembaruan Panda yang diduga telah melunak beberapa hukuman Panda sebelumnya pada situs. Mengingat bahwa ini diluncurkan pada sekitar waktu yang sama seperti Apple iOS edisi 6 Data rujukan itu tetap, kebahagiaan diamati di lima penjuru SEO land.

Kembali ke Masa Depan
Sepertinya Google terus mendominasi seluruh dunia dari dunia pencarian.

Demikian sekilas tentang sejarah perkembangan Search Engin Google dari masa kemasa, meskipun hal ini mungkin tidak terlalu penting bagi sobat blogger namun untuk mengisi ruang tak ada salahnya ane posting, arikel ini tidak murni dari J-PB namun disadur dari beberapa sumber.

Source By : Google.com and thank to Google.co.id

Akun Google Adsense Kena Banned

2013-07-20T09:54:00.000+07:00

Seperti biasanya sebelum memulai pekerjaan saya selalau melihat blog kesayangan terlebih dahulu meskipun cuma beberapa menit saja, Namun pagi ini saya dikejutkan dengan tidak munculnya Iklan GA yang telah nangkring di blog beberapa bulan ini, padahal untuk mendapatkan aprove dari GA ini tidak gratis alias perlu kesabaran, saya pun langsung menuju Email alhasil saya mendapatkan informasi ini :

Hello Alex joenaedi,

While going through our records recently, we found that your AdSense
account has posed a significant risk to our AdWords advertisers. Since
keeping your account in our publisher network may financially damage
our advertisers in the future, we've decided to disable your account.

Please understand that we consider this a necessary step to protect the
interests of both our advertisers and our other AdSense publishers. We
realize the inconvenience this may cause you, and we thank you in
advance for your understanding and cooperation.

If you have any questions about your account or the actions we've
taken, please do not reply to this email. You can find more information
by visiting
https://www.google.com/adsense/support/bin/answer.py?answer=57153&hl=en_US.

Sincerely,
The Google AdSense Team

Entah kesalahan apa yang telah saya lakukan sampai akun GA kena Banned, namun yang pasti saya telah melanggar kebijakan Google Adsense meskipun saya sendiri tidak menyadari dimana letak kesalahan yang telah saya perbuat.

Sayapun mengajukan klaim Banding ke GA tentang Banned ini, dan respon dari mereka bahwa saya harus menunggu selambat-lambatnya satu minggu untuk mendapatkan informasi lebih lanjut dari Team-GA. Nah bagi sobat Blogger yan kebetulan mengalami hal sama dengan apa yang saya alami saat ini, jika ingin melakukan Klaim Banding Akun Google Adsense yang kena Banned Sobat Blogger Bisa mengklik link yang ada dibawah ini :

https://support.google.com/adsense/bin/request.py?hl=en&contact_type=appeal_form&rd=2

sobat akan dibawa ke halaman seperti pada gambar dibawah ini :

Selanjutkan silakan sobat isi form yang tersedia dan team-GA akan langsung mengirim email pemberitahuan kepada sobat blogger, nah selanjutnya sambil menunggu silakan sobat berdo'a saja sukur2 akun GA kita balik lagi kepangkuan kita, dan sobat blogger mesti ingat bahwa mengais rezeki tidak hanya dari akun GA bagi sobat Blogger yang kena Banned juga ingatlah :

"Bahwa hidup selalu ada pasang surut harapan yg terkadang menimbulkan ketidakpastian, tugas kita hanya memantaskan diri dihadapan Sang Khaliq Yang Maha Agung."

Sekian artikel kali ini semoga dapat menjadi pembelajaran yang berharga khusus bagi saya serta sobat blogger semuanya, sebelumnya saya mengucapkan Selamat Menjalankan Ibadah Puasa 1434h semoga Ridho, Rahmat dan Maghfirah Allah Swt. Allah anugrahkan kepda kita semua amiiinnnnn.........!!!

CSS Business Card

2013-07-15T13:41:00.001+07:00

CSS Business Card - Sebelumnya selamat melaksanakan ibadah puasa bagi teman2 yang menjalankannya, dan mohon maaf lahir bathin.

Setelah sebelumnya cukup lumayan lama gak update sebuah postingan kali ini JPB akan mengawali dengan pembuatan sebuah kartunama atau business name card, yang tentunya dalam hal ini membuat bukan dengan sebenarnya melainkan dengan CSS dan HTML, nah untuk freview hasil jadi kurang lebih tampilannya seperti pada gambar dibawah ini :

LIHAT DEMONYA

Nah untuk cara pembuatannya sobat hanya perlu merangkai kode CSS dan HTML dan mengemasnya hehhehhe,
Untuk panduan pemasangan widget silakan klik DISINI

UNTUK KODE HTML NYA

 <div id="efect_warna"></div>
<div id="kartu">
  <img src="DIISI DENGAN LINK GAMBAR SOBAT"/>
  <h2>NAMA SOBAT MUNGKIN</h2>
  <p>JUDUL CONTEN SOBAT</p> 
  <p>CONTEN SOBAT</p>
  <p>CONTEN SOBAT ;)</p>
  <span class="left bottom">+62-8572394-XXXX </span>
  <span class="right bottom">Adress: Sukabumi - Jabar.</span>
</div>

UNTUK KODE CSS NYA

 .left {
  left: 25px;
}

.right {
  right: 25px;
}

.center {
  text-align: center;
}

.bottom {
  position: absolute;
  bottom: 18px;
}

#efect_warna {
  background: #999955;
  background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0.2, #DAB046), color-stop(0.2, #D73B25), color-stop(0.4, #D73B25), color-stop(0.4, #C71B25), color-stop(0.6, #C71B25), color-stop(0.6, #961A39), color-stop(0.8, #961A39), color-stop(0.8, #601035));
  background-image: -webkit-linear-gradient(#DAB046 20%, #D73B25 20%, #D73B25 40%, #C71B25 40%, #C71B25 60%, #961A39 60%, #961A39 80%, #601035 80%);
  background-image: -moz-linear-gradient(#DAB046 20%, #D73B25 20%, #D73B25 40%, #C71B25 40%, #C71B25 60%, #961A39 60%, #961A39 80%, #601035 80%);
  background-image: -o-linear-gradient(#DAB046 20%, #D73B25 20%, #D73B25 40%, #C71B25 40%, #C71B25 60%, #961A39 60%, #961A39 80%, #601035 80%);
  background-image: linear-gradient(#DAB046 20%, #D73B25 20%, #D73B25 40%, #C71B25 40%, #C71B25 60%, #961A39 60%, #961A39 80%, #601035 80%);
  margin: 0 auto;
  margin-top: 100px;
  width: 100%;
  height: 150px;
}

#efect_warna:after {
  content: "";
  position: absolute;
  background: #E9E2D0;
  left: 50%;
  margin-top: -67.5px;
  margin-left: -270px;
  padding-left: 20px;
  border-radius: 5px;
  width: 520px;
  height: 275px;
  z-index: -1;
}

#kartu {
  position: absolute;
  width: 450px;
  height: 225px;
  padding: 25px;
  padding-top: 0;
  padding-bottom: 0;
  left: 50%;
  top: 67.5px;
  margin-left: -250px;
  background: #E9E2D0;
  box-shadow: 0 0 5px black;
  box-shadow: -20px 0 35px -25px black, 20px 0 35px -25px black;
  z-index: 5;
}

#kartu img {
  width: 150px;
  float: left;
  padding: 5px;
  border-radius: 5px;
  margin-right: 20px;
  -webkit-filter: sepia(1);
  -moz-filter: sepia(1);
  filter: sepia(1);
}

#kartu h2 {
  font-family: courier;
  color: #333;
  margin: 0 auto;
  padding: 5px;
  font-size: 15pt;
}

#kartu p {
  font-family: courier;
  color: #555;
  font-size: 13px;
}

#kartu span {
  font-family: courier;
}

Joen's Personal Blog Reinkarnasi dari Kolom Tutorial™

2013-07-08T13:59:00.000+07:00

Joen's Personal Blog Reinkarnasi dari Kolom Tutorial™ - Sebelum memulai artikel kali ini perkenankan saya sebagai admin blog ini mengucapkan "Marhaban Yaa Ramadhan Ahlan Waa Syahlan Bulan Yang Penuh Berkah".

Setelah sebelumnya Blog ini menggunakan sebuah template bernama Johny Super Prett yang luar biasa ( menurut saya ) karya dari seorang pakar yang sangat saya kagumi Maskolis, seiring mulai masuknya bulan seribu berkah blog inipun tidak mau ketinggalan untuk memakai baju baru menyambut datangnya Bulan Ramadhan yang Agung, setelah berselancar memilah milih template yang pas, akhirnya pilihan jatuh kepada sebuah template mungil dan cantik karya Mas Abdul Rohman yang bernama Dark Light Faster Responsive.

Berhubung saya sangat menyukai warna hijau dan hitam maka dengan sedikit modifikasi pada tampilan warna akhirnya selesai juga perombakan template sekaligus berganti nama dari Kolom Tutorial™ Menjadi Joen's Personal Blog, semoga dengan tampilan baru ini Joen's Personal Blog dapat lebih SEO Friendly dan Google Friendly.

Adapun salah satu kelebihan dari template ini adalah sebagai berikut :

» Responsive
» Emoticon pada komentar dan posting (script dari MKR)
» Ajax Navigasi (script dari DTE)
» Optimasi Seo
» Social Network
» Quick Search (script dari DTE)
» Related Post responsive ( script dari MKR)
» CSS pada Thread comments

Dan bagi sobat blogger yang ingin memiliki template ini silakan menuju blognya Mas Abdul rohman silakan klik DISINI

Membuat Blog Google Friendly

2013-06-29T10:47:00.001+07:00

Membuat Blog Google Friendly - Adalah sebuah hal yang tidak mudah, selain harus full memenuhi kebijakan si Mbah juga harus siap besaing dengan para developer lain. Google search memberikan preferensi ke situs-situs yang mengikuti kebijakan google webmaster. Kebijakan atau pedoman webmaster Google adalah seperangkat aturan dan yang menceritakan bagaimana sobat harus membuat blog/website sobat sehingga memberikan pengalaman terbaik bagi pengguna, dan juga pencarian crawler friendly.

Mungkin beberapa poin dibawah ini akan membantu sobat blogger untuk menciptakan sebuah Blog Yang Google Friendly. meskipun dalam hal ini penulis belum mampu mempraktekannya secara maksimal namun dengan berbagi, siapa tau hal akan menjadi sebuah pembelajaran bagi ane dan juga sobat blogger yang masih newbie seperti ane. Adapun poin-poin tersebut kurang lebih sebagai berikut :

1. Selalu membuat sebuah kontent yang unik, jika sobat blogger belum mampu membuat 100% keunikan dari konten sobat, minimal diawal paragrap rada-rada unik lah hehheheh.

2. Membuat blog kita lebih Freshhh, ( segarrrr,,, segarrrrr segarrrrr,,,,,) artinya selalu update dengan artikel-artikel yang unik atau jarang di posting oleh yang lain, ( jangan kaya ane update blog semaunya alias banyak blooooongnya )

3. Ketika membuat postingan yang mengharuskan upload file / image post , usahakan nama file sebelum di upload di perbaiki EX : (keyword-niche-namephoto.jpg) .

4. Terakhir berikan backlink yang relevan dan usahakan dofollow backlink.

5. Satu lagi ni jangan sampe lupa Sharing postingan ke SB (Social Bookmark), Tapi Inga..... Inga........ Strukturnya kaya gini ni : Lakukan Sharing postingan ketika Mbah Google sudah mengindex postingan kita, jangan melakukan hal yang sebaliknya alias sharing duluan semisal ke SB-FB padahal konten tersebut belum tercium oleh Mbah Google.Nah ketika hal ini sobat lakukan maka Trafick ke blog sobat tidak akan bertahan lama alias Cepet Loyooooooo Mas Brooooooo........!!!

Nah itu semua menurut Free Ask SEO

Sedangkan kalau menurut Yogyogi Seorang admin di DIVINE-SOFT sebagai berikut :

Poin-poin berikut akan menjelaskan hal-hal yang Anda harus diingat ketika merancang sebuah blog/website yang Google Friendly.

1) Konten adalah raja
Konten adalah selalu hal yang paling penting. Konten sobat harus sedemikian rupa sehingga pengguna dapat dengan mudah memahami blog/website sobat.

2) Ada isian kata kunci

Tidak terlalu banyak kata kunci dalam "meta tag kata kunci" atau memasukkan satu kata kunci di banyak tempat di halaman web Anda. Misalnya jika Anda menargetkan kata kunci "dijual" maka jangan memasukkan kata kunci ini lebih dari 15 kali per 100 kata. Juga jika ada lebih dari satu kata kunci maka harus memiliki semua kata kunci yang dalam konten halaman Anda. Juga jangan menempatkan kata kunci yang kurang penting dalam tag kata kunci meta Anda.

3) Halaman Judul
Judul halaman Sobat dapat harus memberitahu para pembaca tentang maksuddan tujuannya. Sebagai contoh jika halaman blog/web sobat adalah tentang merancang website maka judul halaman sobat harus sesuai dengan Judul Halaman tadi seperti "Merancang website dengan biaya terjangkau", "Merancang website dari para profesional", dll seharusnya tidak seperti "halaman default", "halaman pengujian abc" , dll karena Google spider akan mencari judul halaman tersebut. Juga membuat judul halaman sobat paling banyak 65 karakter. Hal ini karena google hanya membaca 65 karakter dalam judul halaman.

4) Tidak lebih dari 3 tingkatan :
Website Anda tidak boleh lebih dari 3 level. Ini berarti semua halaman di situs Anda harus diakses dengan tidak lebih dari 3 klik dari halaman utama (halaman index atau halaman awal, misalnya halaman awal dari situs Kolom Tutorial™ adalah http://joens-tutorial.blogspot.com/. Lebih dari 3 tingkat yang tidak disukai oleh google spider. Juga semua halaman harus terhubung ke setidaknya pada halaman situs Web Anda.

5) Tidak boleh lebih 100 link per halaman
Tidak boleh ada lebih dari 100 link di halaman. Juga sangat mungkin bahwa google tidak akan mengindeks halaman ini.

6) Peta Situs
Submit blog/website sobat ke google, bing, yahoo dan mesin pencari lainnya. Hal ini dilakukan dengan membuat sitemap xml. Xml peta situs berisi semua halaman blog/website sobat.

Demikian artikel tentang Membuat Blog Google Friendly semoga artikel ini dapat menjadi sebuah inspirasi khusus buat ane serta sobat blogger - Haturnuhun.