membuat-pinterest-pin-it-button-untuk-wordpress

Cara Mudah Membuat Button Pin It Pinterest untuk WordPress Post

Blog kamu punya banyak foto menarik? pastinya sayang kalau tidak bisa di-share ke pinterest. Begini cara mudah membuat button share pinterest, tapi cara ini untuk yang blognya memakai wordpress yah.

Sudah ada yang bisa menebak solusinya? Yap, saya menemukan satu plugin yang cukup berguna untuk membuat button pint it pinterest. Untuk yang mempunyai kemampuan coding pas-pasan seperti saya, solusi plugin adalah yang paling mudah dan cepat. (Jangan sembarangan menginstall plugin juga)

Dari beberapa plugin button pinterest share yang saya coba, plugin ini cukup efisien melakukannya: Pinterest Pin It Button For Images. Dalam keadaan aktif, plugin ini akan menambahkan button pin it pinterest secara overlay pada setiap image didalam post saja. Plugin ini juga memiliki halaman setting sederhana.

Pada saat post ini ditulis, WP yang kompatibel adalah 3.8.1.
Button default agak besar, yang sudah menemukan cara mengganti buttonnya dengan yang lebih kecil atau custom button, kasih tahu saya yah :)

Semoga informasi ini bermanfaat.

Bagikan info ini ke teman-teman kamu

  • Facebook
  • Twitter
  • LinkedIn
  • StumbleUpon
  • Blogger
  • Google Plus
worpress-admin-ajax-php-internal-server-error-500

Pesan Error: WordPress admin-ajax.php Internal Server Error 500

Ada yang sudah pernah mengalami pesan error 500 diatas? Saya baru saja mengupdate WordPress ke versi baru. Dan beberapa keanehan di Dashboard WordPress saya mulai terjadi.

Keanehan terjadi ketika saya tidak bisa memasukkan image kedalam post. Kemudian saya melihat pesan errornya melalui browser. Ternyata admin-ajax.php yang mengeluarkan error 500. Saya coba cek error log dari cpanel / apache, tidak tercatat disana. Apakah mungkin proses upgrade yang kurang sempurna?

Jika di error log cpanel saja tidak ada pesan kesalahannya, lalu dimana saya harus mencari? WordPress memiliki fitur yang berguna disaat kita sedang mengembangkan website, yaitu WP DEBUG. Dengan men-set WP DEBUG menjadi TRUE, itu artinya semua pesan kesalahan akan ditampilkan oleh wordpress. Dan saya akhirnya menyalakan fitur WP DEBUG.

wordpress-admin-ajax-error-solution

 

 

 

Kemudian saya refresh halamannya, tidak ada pesan error apa-apa. Browser juga tidak lagi menampilkan pesan error, halaman kembali bekerja seperti semula. Sepertinya sudah normal, dan saya tidak lupa men-disable kembali WP DEBUG.

Hal-hal aneh seperti Internal Server Error 500 ini kadang terjadi, dan kadang solusinya juga sederhana saja. Ada yang bisa menjelaskan kenapa?

Internal Server Error 500 bisa disebabkan banyak hal, dari modul php5 yang belum diinstall, folder permission, sampai pada fungsi WP DEBUG seperti saya ini. Semoga solusi diatas dapat membantu teman-teman yang mengalami hal yang sama.

Bagikan info ini ke teman-teman kamu

  • Facebook
  • Twitter
  • LinkedIn
  • StumbleUpon
  • Blogger
  • Google Plus
panduan lengkap css untuk mendesign newsletter

Panduan Lengkap Kompatibilitas CSS Newsletter Di Semua Jenis Email Agent

Mendesign Newsletter bisa menjadi sangat membuat frustasi, apabila design newsletter tergolong kompleks dan banyak menggunakan style-style khusus. Meskipun sekarang sudah banyak penyedia layanan newsletter yang menyediakan interface yang intuitif untuk pengguna pemula sekalipun. Tidak ada salahnya kita melihat daftar kompatibilitas (compatibility list) CSS terhadap beberapa email agent yang populer, untuk mengurangi perbedaan tampilan newsletter.

Langsung saja lihat tabel panduan kompatibilitas CSS pada bermacam-macam email agent berikut ini:

Style Element Outlook 2007/10/13 + Outlook 03/Express/Mail iPhone iOS 7/iPad Outlook.com Apple Mail 6.5 Yahoo! Mail Google Gmail Android 4 (Gmail) +

Responsive

Responsive No No Yes No Yes No No No

Style Element

<style> in <head> Yes Yes Yes Yes Yes Yes No Yes
<style> in <body> Yes Yes Yes Yes Yes Yes No Yes

Link Element

<link> in <head> Yes Yes Yes No Yes No No Yes
<link> in <body> Yes Yes Yes No Yes No No Yes

Selectors

* No Yes Yes No Yes No Yes Yes
E Yes Yes Yes Yes Yes Yes No Yes
E[foo] No Yes Yes Yes Yes No Yes Yes
E[foo="bar"] No Yes Yes Yes Yes No Yes Yes
E[foo~="bar"] No Yes Yes No Yes No Yes Yes
E[foo^="bar"] No Yes Yes No Yes No Yes Yes
E[foo$="bar"] No Yes Yes No Yes No Yes Yes
E[foo*="bar"] No Yes Yes No Yes No Yes Yes
E:nth-child(n) No No Yes Yes Yes No No Yes
E:nth-last-child(n) No No Yes Yes Yes No No Yes
E:nth-of-type(n) No No Yes Yes Yes No No Yes
E:nth-last-of-type(n) No No Yes Yes Yes No No Yes
E:first-child No Yes Yes Yes Yes No No Yes
E:last-child No No Yes Yes Yes No No Yes
E:first-of-type No No Yes Yes Yes No No Yes
E:last-of-type No No Yes Yes Yes No No Yes
E:empty No No Yes Yes Yes No No Yes
E:link Yes Yes Yes No Yes No No Yes
E:visited Yes No Yes No No Yes No Yes
E:active No Yes No Yes Yes Yes No No
E:hover No Yes No Yes Yes Yes No No
E:focus No No Yes Yes Yes Yes No No
E:target No No No Yes No No No No
E::first-line No Yes Yes Yes Yes Yes No Yes
E::first-letter No Yes Yes Yes Yes Yes No Yes
E::before No No Yes No Yes No No Yes
E::after No No Yes No Yes No No Yes
E.classname Yes Yes Yes Yes Yes Yes No Yes
E#id Yes Yes Yes No Yes Yes No Yes
E:not(s) No No Yes No Yes No No Yes
E F Yes Yes Yes Yes Yes Yes No Yes
E > F No Yes Yes Yes Yes Yes Yes Yes
E + F No Yes Yes Yes Yes Yes No Yes
E ~ F No Yes Yes Yes Yes No No Yes
Text & Fonts
@font-face No No Yes No Yes No No No
direction No Yes Yes Yes Yes Yes Yes Yes
font Yes Yes Yes Yes Yes Yes Yes Yes
font-family Yes Yes Yes Yes Yes Yes Yes Yes
font-style Yes Yes Yes Yes Yes Yes Yes Yes
font-variant Yes Yes Yes Yes Yes Yes Yes Yes
font-size Yes Yes Info Yes Yes Yes Yes Yes
font-weight Yes Yes Yes Yes Yes Yes Yes Yes
letter-spacing Yes Yes Yes Yes Yes Yes Yes Yes
line-height Yes Yes Yes Info Yes Yes Yes Yes
text-align Yes Yes Yes Yes Yes Yes Yes Yes
text-decoration Yes Yes Yes Yes Yes Yes Yes Yes
text-indent Yes Yes Yes Yes Yes Yes Yes Yes
text-overflow CSS3 No Yes Yes Info Yes Info Info Yes
text-shadow CSS3 No No Yes Yes Yes Yes No Yes
text-transform Yes Yes Yes Yes Yes Yes Yes Yes
white-space Yes Yes Yes Yes Yes Yes Yes Yes
word-spacing No Yes Yes Yes Yes Yes Yes Yes
word-wrap CSS3 No Info Yes Yes Yes Yes No No
vertical-align No Yes Yes Yes Yes Yes Yes Yes
text-fill-color CSS3 No No Yes No Yes No No Yes
text-fill-stroke CSS3 No No Yes No Yes No No Yes

Color & Background

color Yes Yes Yes Yes Yes Yes Yes Yes
background Info Yes Yes Info Yes Yes Yes Yes
background CSS3 No No Yes No Yes No No Yes
background-color Yes Yes Yes Yes Yes Yes Yes Yes
background-image No Yes Yes No Yes Yes Yes Yes
background-position No Yes Yes No Yes Yes Yes Yes
background-repeat No Yes Yes No Yes Yes Yes Yes
background-sizeCSS3 No No Yes No Yes Info No Info
HSL Colors CSS3 Yes Yes Yes Yes Yes Yes Yes Yes
HSLA Colors CSS3 No No Yes No Yes No Yes Yes
Opacity CSS3 No No Yes Yes Yes No No Yes
RGBA Colors CSS3 No No Yes No Yes No Yes Yes

Box Model

border Yes Yes Yes Yes Yes Yes Yes Yes
border-color No No Yes Yes Yes Yes Yes No
border-image CSS3 No No Yes No Yes No No No
border-radius CSS3 No No Yes Yes Yes No Yes No
box-shadow CSS3 No No Yes Yes Yes No No No
height No Yes Yes Yes Yes Yes Yes Yes
margin Yes Yes Yes No Yes Yes Yes Yes
padding Info Yes Yes Yes Yes Yes Yes Yes
width Info Yes Yes Yes Yes Yes Yes Yes
max-width No Yes Yes Yes Yes Yes Yes Yes
min-width No Yes Yes Yes Yes Yes Yes Yes

Positioning & Display

bottom No Yes Yes Yes Yes No No Yes
clear No Yes Yes Yes Yes Yes Yes Yes
clip No Yes Yes No Yes No No Yes
cursor No Yes Yes Yes Yes Yes No No
display No Yes Yes Yes Yes Yes No Yes
float No Yes Yes No Yes Yes Yes Yes
left No Yes Yes No Yes No No Yes
opacity No No Yes Yes Yes No No Yes
outline CSS3 No No Yes Info Yes Info Info Yes
overflow No Yes Yes Info Yes Info Info Info
position No Yes Info Yes Yes No No Yes
resize CSS3 No Yes Yes Info Yes Info No No
right No Yes Yes Yes Yes No No Yes
top No Yes Yes Yes Yes No No Yes
visibility No Yes Yes Yes Yes Yes No Yes
z-index Yes Yes Yes Yes Yes Yes No Yes
Lists
list-style-image No Yes Yes No Yes Yes No Yes
list-style-position No Yes Yes No Yes Yes Yes Yes
list-style-type No Yes Yes Yes Yes Yes Yes Yes

Tables

border-collapse Yes Yes Yes Yes Yes Yes Yes Yes
border-spacing No No Yes Yes Yes Yes Yes Yes
caption-side No No Yes Yes Yes Yes Yes Yes
empty-cells No No Yes Yes Yes Yes Yes Yes
table-layout Yes Yes Yes Yes Yes Yes Yes Yes

HTML 5

<canvas> No No Yes Yes No No No No
<audio> No No Yes Info Yes No No No
<video> No No Yes Info Yes No No No
Selamat mendesign newsletter dengan CSS! semoga panduan kompatibilitas diatas dapat menjadi dasar pengetesan newsletter sebelum di publish. Karena, sekali newsletter keluar, tidak bisa dilakukan perubahan lagi.
Semoga artikel ini membantu, daftar ini saya dapatkan dari sini

Bagikan info ini ke teman-teman kamu

  • Facebook
  • Twitter
  • LinkedIn
  • StumbleUpon
  • Blogger
  • Google Plus
3d key

5 tips mengamankan komputer dari kejahatan online

Menjaga komputer anda tetap aman dari berbagai ancaman kejahatan online berhubungan erat dengan kebiasaan penggunanya. Namun berikut adalah 5 tips dasar yang bisa dilakukan untuk melindungi komputer anda dan data-data yang berada di dalamnya tetap aman dari kejahatan online.

1.Install Software Anti-virus

Software Anti-virus dirancang untuk mengidentifikasi, menetralkan dan menghilangkan virus yang dapat merusak komputer, merusak data, atau mengungkap ‘vulnerabilities’ yang dapat digunakan hacker dan spammer untuk hal-hal yang buruk. Pilih software anti virus yang berkualitas, update secara teratur supaya tetap up-to-date dengan perkembangan virus. Jangan lupa, scan komputer anda secara teratur.

2. Nyalakan Firewall

Firewall adalah ‘tembok’ yang melindungi komputer anda dari semua lalulintas data online. Ia yang mem-filter informasi keluar dan masuk. Jika antivirus men-scan file komputer anda, firewall bisa diibaratkan seperti anjing penjaga di depan komputer anda. Pastikan Firewall dan Antivirus dalam keadaan aktif sebelum anda berseluncur di dunia maya.

3.Install software anti-spyware

Spyware dan Adware sangat mengganggu kegiatan browsing. Dia bisa berupa popup, plugin browser tak dikenal, icon toolbar asing, redirect ke website tak dikenal, search engine aneh, hingga pengalaman browsing yang lambat. Untuk mengurangi kemungkinan infeksi malware jenis ini, install software anti spyware dan adware.

4.Gunakan addon security yang terpercaya pada browser

Untuk tambahan keamanan, install plugin security semacam WOT yang bisa memperingatkan bahaya spyware, virus, spam, phising, dan lain-lain pada suatu website. Jadi sebelum anda melanjutkan brwosing ke website tersebut, akan ada peringatan sebelumnya.

5. Update Informasi dan kebiasaan

Update informasi mengenai kejahatan-kejahatan online yang terjadi dan metode-metodenya. Mulai kebiasaan baik dalam berseluncur di dunia maya. Website-website porno, afiliate marketing, money game, download, dan yang menawarkan konten gratis biasanya memiliki muatan lain.

Jadi mulai sekarang, berhati-hatilah jika berseluncur di dunia maya. Kita bisa tidak perduli jika komputer itu ada di warnet atau sarana public. Tapi pasti kita menyayangi data-data pribadi kita sendiri. Apakah tips diatas sudah cukup mengamankan komputer anda dari kejahatan online?

Bagikan info ini ke teman-teman kamu

  • Facebook
  • Twitter
  • LinkedIn
  • StumbleUpon
  • Blogger
  • Google Plus
absolute center

Absolute centering: Cara membuat div rata tengah, horizontal dan vertical dengan CSS

Mungkin sudah banyak yang bisa menebak caranya membuat div rata tengah, yaitu dengan ‘margin: 0 auto’. Namun ternyata itu hanya berhasil untuk rata tengah horizontal, bagaimana dengan rata tengah secara vertical?

Lalu bagaimana agar div rata tengah baik vertical dan horizontal? Ternyata dapat dilakukan dengan hanya menambahkan element : height kedalam CSS.

misalnya CSS awal adalah:

.tengah {
     margin: auto;
     position: absolute;
     top: 0; left: 0; bottom: 0; right: 0;
}

Cukup tambahkan:

.tengah {
     margin: auto;
     position: absolute;
     top: 0; left: 0; bottom: 0; right: 0;
     height: 300px;
     border: 1px solid #999; /*jika ingin melihat posisi div anda lebih jelas */
}

Elemen div apakah sudah rata tengah horizontal dan vertical sekarang? yep, dan ini sudah saya tes pada beberapa browser umum seperti chrome, mozilla, safari dan opera. bekerja dengan baik :)

Sedikit penjelasan yang mungkin menjawab pertanyaan, mengapa bisa rata tengah secara vertical dan horizontal:

1. jika nilai margin-top dan margin-bottom adalah auto, nilai yang pakai adalah ’0′
2. position: absolute; posisi div menjadi tetap, baik jika digunakan bersamaan dengan top, bottom, left, right.
3. top, bottom, left dan right : 0, memerintahkan browser untuk memberikan bounding box / batasan baru setelah di absolute-kan
4. width dan height, browser memberi nilai default 100% jika tidak ada nilai awalnya.

Semoga dapat memberikan pencerahan. Jika ada yang mau menambahkan metode diatas silahkan memberikan masukannya di kolom komentar dibawah ini :)

Bagikan info ini ke teman-teman kamu

  • Facebook
  • Twitter
  • LinkedIn
  • StumbleUpon
  • Blogger
  • Google Plus

Mungkin cuma Blog-blogan