Cara Pindah Hosting WordPress

Terakhir diperbaharui: Selasa, 15 Mei 2018 pukul 10:16
Tautan: https://darto.id/7m

Sebetulnya memindahkan hosting WordPress sangat mudah sekali. Dan banyak jalan menuju proses pindah hosting WordPress. Tapi salah satu yang saya sering gunakan adalah cara berikut:

Proses Pindah Hosting WordPress

Untuk melakukan proses pindah hosting WordPress yang lama menuju hosting WordPress yang baru, terlebih dahulu buka cPanel pada website lama, simpan data dan database yang ingin dipindahkan dengan cara:

cPanel => Files => Backup => Partial Backups => Download a Home Directory Backup => klik Home Directory. Dan untuk backup database pada Download a MySQL Database Backup => klik nama database MySQL yang anda gunakan.

Setelah prosesnya selesai, biasanya yang agak lama adalah menyimpan file-file pada Home Directory. Pada website yang baru, buka cPanel dan kemudian lakukan langkah sederhana berikut untuk memulai proses pindah hosting WordPress Anda dengan merestore file dan database dari hosting yang lama.

cPanel => Files => Backup => Partial Backups => Restore a Home Directory Backup => klik tombol Choose File dan dialog window akan muncul untuk Anda memilih file hasil backup yang sudah Anda lakukan, biasanya dengan nama file backup-domain-tanggal.tar.gz setelah dipilih proses restore pun akan segera berjalan dan cepat lamanya bergantung pada besar size file yang dibackup untuk direstore dan juga bandwidth yang Anda gunakan.

Begitu juga untuk merestore databasenya, pada Restore a MySQL Database Backup => klik tombol Choose File dan pilih file hasil backup database, biasanya dengan nama file nama-database.sql.gz.

Setelah proses restore file dan database selesai, kita membuat MySQL user terlebih dahulu dengan cara:

cPanel => Databases => MySQL Ⓡ Databases => MySQL Users => Add New Users => silakan buat username dan password yang ingin buat, kalau saya pilih Password Generator dan memilih untuk menggunakan 18 digits. Dan jangan lupa untuk dicatat, hehehe.

Setelah itu pada Add User to Database pilih user yang baru Anda buat dan kemudian pilih pada database yang sudah Anda restore dari hosting yang lama => klik Add => dan pilih All Privileges.

Tugas terakhir adalah menyesuaikan konfigurasi pada wp-config.php di hosting yang baru untuk menggunakan MySQL user dan nama database yang Anda gunakan, setelah itu, selesai.

Eit, belum dulu, jangan lupa untuk merubah NS atau DNS pada domain dan setelah propagasi DNS pada domain selesai, maka Anda akan bisa mengakses website Anda tanpa ada perubahan sedikit pun.

Sebetulnya, ada cara yang lebih canggih lagi tanpa bersusah payah, yaitu dengan meminta tolong pada support dimana Anda memilih hosting baru dan tentu saja pastikan kalau mereka memberikan support pemindahan hosting dengan gratis. Cara ini adalah cara newbie yah, bukan cara yang sangat keren untuk dilakukan, karena ini adalah hasil dari trial and error yang saya pernah alami pada saat proses pemindahan hosting WordPress.

Dan baru kali ini saya menyadarinya bahwa dengan melakukan cara pindah hosting WordPress seperti diatas yang biasa saya lakukan ada kekurangannya, dan ini saya ketahui saat melihat hasil dari data sql yang ingin saya backup. Ternyata banyak sekali data yang menurut saya data atau konfigurasi yang sudah tidak terpakai atau tidak digunakan tapi tetap berada disana. Entah mempengaruhi website menjadi lambat atau tidak tapi kok seringnya jadi lambat yah, mmmm mungkin ya lambatnya jadi menambah waktu dalam membaca database kali yah, mmmm tau deh, I’m not an expert.

Setelah dilihat-lihat dari file sql, saya berkesimpulan dan melakukan testing, bahwa jika pada website Anda yang menggunakan WordPress agar tidak sering-sering install plugins dan membiarkan plugins masih didalam daftar plugins jika memang sudah tidak digunakan, segera saja di delete beserta file nya, karena jika tidak di delete konfigurasi dan lainnya akan masih ada didalam file begitu juga didatabase Anda, sehingga akan semakin membengkak database Anda.

OK deh, curhatnya segini aja dulu, masih mau ngerjain yang lain dulu nih, hehehe.

WordPress: Membuat Child Themes

Terakhir diperbaharui: Sabtu, 09 September 2017 pukul 08:48
Tautan: http://darto.id/7h

Apa itu Child Themes?

Kalau ada istilah child themes pasti akan ada pula istilah parent themes. Parent themes adalah tema (themes) yang akan kita gunakan untuk CMS WordPress kita. Seperti artinya, child themes adalah keturunan dari parent themes (tema utama).

Fungsi Child Themes

Fungsi yang terutama dari child themes adalah mengambil semua peran atau konfigurasi dari tema utama (parent themes) dan kemudian kita menambahkan atau menghilangkan konfigurasi tersebut pada child themes yang akan kita terapkan untuk tampilan di backend (dasbor) dan halaman website.

Mengapa Harus Membuat Child Themes? !!!

Tema di WordPress adalah sebuah kewajiban yang harus ada. Sebelum era ada child themes, ketika kita ingin menambahkan atau menghilangkan konfigurasi di WordPress, kita menulis kodenya di functions.php yang berada di dalam folder tema. Tetapi, bagi yang pelupa tentunya akan jadi masalah besar, karena kita sudah menulis kode yang kita inginkan dan kemudian ada update tema dari developer. Bles…. hilang semua deh. Terkadang dan seringnya lupa backup juga, jadinya total disaster dah, hehehe.

Sejauh mana peran penting child themes? Saya coba uraikan beberapa hal saja, bagi yang ingin menambahkan silakan.

  • Tidak merubah parent theme. Dengan membuat child theme, semua kustomisasi yang kita buat tidak akan berpengaruh pada parent theme.
  • Aman melakukan update tema. Karena kita tidak utak-atik atau menyentuh file-file yang berada di tema utama, artinya kita akan aman ketika melakukan update yang disediakan oleh pengembang tema yang sudah kita beli.
  • Memiliki konfigurasi yang sama dengan tema utama. Lantas, kenapa tetap harus membuat child theme jika konfigurasinya sama? Kalau menurut saya sih itu keuntungannya, hehehe. Karena untuk menjawab hal ini harus balik lagi 2 poin di atas. Dan tentunya, siapa juga sih yang tidak ingin merubah dari tampilan untuk website kita? entah menambahkan style (css) atau script (javascript), pastinya setiap website ada penyesuaian terhadap apa yang kita mau.
  • Mengurangi penggunaan plugins. Poin ini hanya kecendrungan saya saja dalam menggunakan CMS WordPress, yaitu mengurangi penggunaan plugins yang bisa berdampak terhadap performa website. Ada beberapa web admin, untuk melakukan kustomisasi dari tema yang dibeli dengan keinginan tampilan, banyak menginstall plugins. Yang menurut hemat saya tentunya banyak sekali kelemahannya karena biasanya pengembang atau pembuat plugins, sebetulnya saya gak cocok nyebut pengembang hehehe, emangnya bikin kue bolu, pengembang. Tapi berhubung orang Indonesia sudah di colok hidungnya sama Google translate, taunya pengembang bukan developer, hehehe. Lanjut… banyak pengembang yang membuat plugins berawal dari tujuan pribadinya sehingga tentunya saat membuat plugins bukan untuk melengkapi plugins lainnya. Dan artinya jika kita banyak menginstall plugin akan banyak kode-kode yang bertumpang tindih atau fungsinya saling bertabrakan. Dan ini menurut saya membuat dasbor website kita menjadi tidak kondusif, xixixi.
  • Meningkatkan skill. Dengan belajar membuat child theme semakin hari anda akan semakin mengerti WordPress itu apa sih dan gimana sih kerjanya. Walaupun masih harus banyak belajar untuk mengetahui gimana cara kerja core WordPress, hehehe. Setidaknya jadi tahu bagaimana cara kustomisasi WordPress.

Cara Membuat Child Themes

1. Membuat folder di wp-content => themes dan kemudian berikan nama sesuai dengan yang diinginkan dan disarankan untuk memberikan nama yang simple, tidak panjang banget, tidak pakai spasi, tidak menggunakan nama seperti password. Contoh: dartokloning, kloningspoon. Jika ingin menggunakan dua suku kata mungkin bisa menggunakan tanda minus (strip). Contoh: darto-keren, kloning-spoon, darto-gituh.

2. Membuat style.css didalam folder child themes.

/*
 Theme Name:   Darto KLoning
 Theme URI:    https://www.kloningspoon.com/
 Description:  Darto KLoning - We Share Because We Care
 Author:       Darto KLoning
 Author URI:   https://www.kloningspoon.com
 Template:     twentyfifteen
 Version:      2016.07.14
*/

/* Terapkan kustom css anda dibawah ini
============================================ */

Yang perlu diperhatikan adalah pada isian Template, dimana isinya harus sesuai dengan nama folder dari parent theme yang ingin kita gunakan.

3. Membuat functions.php didalam folder child themes.

<?php

/*=== Memanggil css tema utama ===*/

function panggil_style_tema_utama(){
wp_enqueue_style( 'tema-utama', get_template_directory_uri() . '/style.css' );
}

add_action( 'wp_enqueue_scripts', 'panggil_style_tema_utama' );

/* Terapkan kode php atau function anda dibawah ini
=================================================== */

4. Menyiapkan file gambar dengan resolusi 1200×900 pixel dengan nama screenshot.png. Gambar ini yang akan mewakili child theme yang sudah kita buat saat di lihat di menu Appearance (tampilan) => Themes (tema).

Selesai sudah untuk pembuatan child themenya. Selebihnya anda bebas mengutak-atik child themes anda.

Selamat berekspresi dan berjuang.

WordPress: Menambahkan Shortcode di dalam Widget

Terakhir diperbaharui: Minggu, 18 September 2016 pukul 10:16
Tautan: http://darto.id/6o

Sebetulnya sekarang sudah banyak WordPress theme yang mengaktifkan filter agar bisa menambahkan shortcode di widget. Tapi, ya ternyata masih ada juga theme yang belum mengaktifkan filter ini, ternyata, wah wah wah, kok bisa yah.

Bagi yang mau menambahkan shortocde di widget tetapi yang keluar malah teks shortcodenya, mungkin harus mengaktifkan filter widget_text yang bisa di cantumkan di functions.php

// mengaktifkan shortcode di dalam widget
add_filter('widget_text','do_shortcode');

Semoga membantu

WordPress: Memperbaiki Post Editor (TinyMCE)

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/8

Kejadian tombol hilang di post editor sebetulnya jarang sekali terjadi. Tapi entah kenapa akhirnya saya harus mengalaminya juga, hehehe. Semua tombol hilang, klik “Visual” tidak berfungsi, klik “Text” tidak berfungsi, hanya ada text editor berwarna putih saja.

Clear cache tidak juga berpengaruh. Ganti browser ternyata masalahnya tetap sama. Akhirnya timpa (rewrite) folder tinymce di  wp-include/js/, ternyata tidak juga bisa memperbaiki post editor. Kemudian mencoba buka wp-config.php dan masukkan kode:

define('CONCATENATE_SCRIPTS', false);

Alhamdulillah, akhirnya post editornya kembali normal. Tombol-tombolnya bermunculan kembali, hehehe.

WordPress: Get URL Only of Featured Image

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/c

Untuk menampilkan featured image di WordPress sangat mudah sekali, cukup dengan perintah:

<?php echo get_the_post_thumbnail( $post_id, $size, $attr ); ?>

Contoh:

<?php echo get_the_post_thumbnail( $post->ID, full, array( 'style' => 'margin-bottom: 15px;' ) ); ?>

Dan option sizenya bisa disesuaikan dengan keinginan kita, thumbnail, medium, large dan full atau dengan ukuran yang bisa kita custom sendiri, misal array( 100, 100).

Tapi, bagaimana kalau kita hanya menginginkan URL imagenya saja tanpa ada ukuran? Kadang hal ini kita butuhkan dengan tujuan untuk responsive display di website atau email template.

Ternyata ada function bawaan dari WordPress yang bisa kita gunakan untuk hal ini, yaitu mendapatkan URL dari featured image dan juga titlenya. Berikut kodenya:

$thumbnail_id = get_post_thumbnail_id($post->ID);
$thumbnail_object = get_post($thumbnail_id);

Cara menggunakannya adalah:

<img src="<?php $thumbnail_object->guid; ?>" style="height:auto !important; max-width:600px !important; width: 100% !important;" alt="<?php $thumbnail_object->post_title; ?>">

Okay, semoga bermanfaat :D. Bagi yang ngerti itu juga, hehehehe.

WordPress Calendar Widget Style

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/i

While developing a WordPress theme a lot of time you forget to style WordPress calendar widget. You can find many premium themes which do not care about WordPress calendar widget and i know i have also done a lot in past. Although it’s a lesser used functionlity but it is unwise to ignore if you are developing a premium WordPress theme.

Style 0

wordpress-calendar-widget-style0

#wp-calendar {
width:100%;
font-size:12px;
font-weight:300;
border-collapse:separate;
border-spacing:8px;
margin-left:-2px;
}

#wp-calendar
caption {
display:none;
}

#wp-calendar tbody
td {
margin-bottom:10px;
text-align:center;
-webkit-border-radius:2px;
-moz-border-radius:2px;
-ms-border-radius:2px;
-o-border-radius:2px;
border-radius:2px;
border:1px solid #f4f4f4;
padding:6px;
}

#wp-calendar tbody td:hover {
border-color:#e2e2e2;
}

#wp-calendar tbody
td.pad {
border:0;
}

#wp-calendar tbody
td#today {
color:#47C2DC;
border-color:#47C2DC;
}

#wp-calendar tfoot td#prev a,#wp-calendar tfoot td#next
a {
color:#888;
font-size:12px;
font-weight:400;
position:relative;
text-transform:uppercase;
bottom:-9px;
margin-bottom:1px;
}

#wp-calendar tfoot
td#prev {
text-align:left;
}

#wp-calendar tfoot
td#next {
text-align:right;
}

#wp-calendar thead
th {
font-size:13px;
font-weight:400;
color:#888;
text-align:center;
padding-bottom:10px;
}

#wp-calendar tbody td
a,#wp-calendar tfoot td#prev a:hover,#wp-calendar tfoot td#next a:hover {
color:#47C2DC;
}

 Style 1

wordpress-calendar-widget-style1

.widget_calendar {float: left;}
#wp-calendar {width: 100%; }
#wp-calendar caption { text-align: right; color: #333; font-size: 12px; margin-top: 10px; margin-bottom: 15px; }
#wp-calendar thead { font-size: 10px; }
#wp-calendar thead th { padding-bottom: 10px; }
#wp-calendar tbody { color: #aaa; }
#wp-calendar tbody td { background: #f5f5f5; border: 1px solid #fff; text-align: center; padding:8px;}
#wp-calendar tbody td:hover { background: #fff; }
#wp-calendar tbody .pad { background: none; }
#wp-calendar tfoot #next { font-size: 10px; text-transform: uppercase; text-align: right; }
#wp-calendar tfoot #prev { font-size: 10px; text-transform: uppercase; padding-top: 10px; }

 Style 2

wordpress-calendar-widget-style2

#wp-calendar, #wp-calendar th, #wp-calendar td {
text-align: center;
background: none;
border: none;
}
#wp-calendar {
background: none;
empty-cells: hide;
width: 260px;
font: normal 11px / 200% Verdana, Arial, Helvetica, sans-serif;
}
#wp-calendar th {
font-style: normal;
font-weight: bold;
text-transform: capitalize;
border-bottom: 1px solid #666;
}
#wp-calendar td {
text-align: center;
background: transparent url(images/entry-meta.png) repeat-x top left;
padding: 0px;
border-bottom: 1px solid #ccc;
}
#wp-calendar td:hover {
background-color: red;
}
#wp-calendar a {
text-decoration: none;
display: block;
color: #fff;
}
#wp-calendar a:hover {
background: #c5d1d9;
color: #666;
}
#wp-calendar caption {
font-weight: bold;
text-align: center;
}
#wp-calendar #today {
rgba(255, 255, 255, 0.27);
}
#wp-calendar caption {
text-align: center;
width: 100%;
}
#wp-calendar .pad {
background-color: #fff;
}
#wp-calendar #next a {
padding-right: 10px;
text-align: right;
background: #f0f3f5;
color: #666;
}
#wp-calendar #prev a {
padding-left: 10px;
text-align: left;
rgba(196, 196, 196, 0.67);
color: #666;
}
#wp-calendar #prev a:hover, #wp-calendar #next a:hover {
color: #fff;
}
#wp-calendar .pad, #wp-calendar .pad:hover {
background: rgba(255, 255, 255, 0);
}

 Style 3

wordpress-calendar-widget-style3

#wp-calendar { width: 100%; font-size: 11px; }
#wp-calendar thead th { background: #f5f5f5; border: 1px solid #ddd; border-top: none; font-size: 11px; }
#wp-calendar tbody td { text-align: center; border: 1px solid #ddd; line-height: 2.5em; transition: background 0.15s ease; -webkit-transition: background 0.15s ease; -o-transition: background 0.15s ease; -moz-transition: background 0.15s ease; }
#wp-calendar tbody td:hover { background: #f1f1f1; color: #333; }
#wp-calendar tbody td a { display: block; text-decoration: none; background: #f1f1f1; color: #333; }
#wp-calendar tbody td:hover a { background: #4d4d4d; color: #fff; }
#wp-calendar tfoot td { padding-top: 1px; padding: 4px; }
#wp-calendar caption { cursor: pointer; font-size: 13px; text-transform: uppercase; margin: 0; padding: 12px; outline: 0 none !important; background: #3b86b0; color: #fff; }
#wp-calendar tbody a { display: block; text-decoration: underline; }
#wp-calendar th { text-align: center; border: 1px solid transparent; border-top: none; padding: 7px 0; color: #a7a7a7; }
#footer #wp-calendar thead th { background: #222 }
#footer #wp-calendar tbody td { border-color: #222 }

 Style 4

wordpress-calendar-widget-style4

#calendar_wrap {
	border: 1px solid #DDD;
	border-radius: 4px;
	}

.widget_calendar #wp-calendar {
	width: 100%;
	}

.widget_calendar caption {
	font-size: 18px;
	font-style: italic;
	color: #777;
	background: #F4F4F4;
	padding: 5px 0 8px 0;
	margin-bottom: 10px;
	border-bottom: 1px solid #DDD;
	}

.widget_calendar th,
.widget_calendar td {
	text-align: center;
	}

.widget_calendar #today {
	background: #F4F4F4;
	border-radius: 4px;
	}

.widget_calendar #prev,
.widget_calendar #next {
	padding: 5px 0;
	}

 Style 5

wordpress-calendar-widget-style5

#wp-calendar { border-collapse: collapse; border:1px solid #ddd; width:100%; border-top:none; }
#wp-calendar td, #wp-calendar th { text-align:center; }
#wp-calendar caption { color: #fff; padding: 0; line-height: 39px; }
#wp-calendar thead, #wp-calendar tfoot { line-height:33px; background:#eee; }
#wp-calendar tbody { line-height:33px; }
#wp-calendar #prev, #wp-calendar #next { padding:0 10px; background:#eee; }
#wp-calendar #prev { text-align:left; }
#wp-calendar #next { text-align:right; }

 Style 6

wordpress-calendar-widget

#wp-calendar {
width:100%;
}

#wp-calendar caption {
color:#eee;
font-size:13px;
margin-top:0;
background:#111;
text-transform:uppercase;
padding:8px 0;
}

#wp-calendar thead {
font-size:10px;
background:#333;
color:#fff;
}

#wp-calendar thead th {
padding:4px 10px;
}

#wp-calendar tbody {
color:#aaa;
}

#wp-calendar tbody td {
background:#222;
color:#ccc;
text-align:center;
font-size:13px;
padding:2.5%;
}

#wp-calendar tbody td a {
color:#ccc;
text-decoration:underline!important;
}

#wp-calendar tbody td.pad {
background:#111;
}

#wp-calendar tbody .pad {
background:none;
}

#wp-calendar #today {
color:#fff;
text-shadow:0 1px 0 rgba(0,0,0,.3);
background:0;
}

#wp-calendar tfoot #next {
font-size:10px;
text-transform:uppercase;
text-align:right;
}

#wp-calendar tfoot #prev {
font-size:10px;
text-transform:uppercase;
padding-top:5px;
}

 Style 7

wordpress-calendar-widget-style6

.widget_calendar {float: left;}
#wp-calendar {width: 100%; }
#wp-calendar caption { text-align: right; color: #333; font-size: 12px; margin-top: 10px; margin-bottom: 15px; }
#wp-calendar thead { font-size: 10px; }
#wp-calendar thead th { padding-bottom: 10px; }
#wp-calendar tbody { color: #aaa; }
#wp-calendar tbody td { background: #f5f5f5; border: 1px solid #fff; text-align: center; padding:8px;}
#wp-calendar tbody td:hover { background: #fff; }
#wp-calendar tbody .pad { background: none; }
#wp-calendar tfoot #next { font-size: 10px; text-transform: uppercase; text-align: right; }
#wp-calendar tfoot #prev { font-size: 10px; text-transform: uppercase; padding-top: 10px; }

A WordPress calendar comes with core wordpress classes which is pretty simple to customize. You can find a set of WordPress calendar widget core classes to customize it by your own.

.widget_calendar {}
#calendar_wrap {}
#calendar_wrap th {}
#calendar_wrap td {}
#wp-calendar tr td {}
#wp-calendar caption {}
#wp-calendar a {}
#wp-calendar #today {}
#wp-calendar #prev {}
#wp-calendar #next {}
#wp-calendar #next a {}
#wp-calendar #prev a {}

 

source: small envelope, wp explorer

 

WordPress: Add Option, Text Field to General Settings Page

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/n

If you need to add an option to a site, but it doesn’t really need to be on its own page. You can probably add it to one of the existing settings pages. Here’s how to add an option to the General Settings page.

In this case, I’m adding a ‘Islamic Phrases’ field for my next WordPress plugin, probably not the best example, so go ahead and change that.

$new_general_setting = new new_general_setting();
class new_general_setting {
    function new_general_setting( ) {
        add_filter( 'admin_init' , array( &$this , 'register_fields' ) );
    }
    function register_fields() {
        register_setting( 'general', 'Islamic_Phrases_Font_Size', 'esc_attr' );
        add_settings_field('Islamic_Phrases_Font_Size', '<label for="Islamic_Phrases_Font_Size">'.__('Islamic Phrases Font Size' , 'Islamic_Phrases_Font_Size' ).'</label>' , array(&$this, 'fields_html') , 'general' );
    }
    function fields_html() {
        $value = get_option( 'Islamic_Phrases_Font_Size', '' );
        echo '<input class="small-text" type="text" id="Islamic_Phrases_Font_Size" name="Islamic_Phrases_Font_Size" value="' . $value . '" />&nbsp;px&nbsp;&nbsp;<span id="IsP_errmsg"></span>';
    }
}

 

source: trepmal

WordPress: Display All Categories with ID

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/w

If you are a developer, in some cases you need to get all categories and their IDs. You might start referring to wordpress codex but most likely you will end up with no solution, just like me. Rather than counting on wordpress’s built-in function, you can write your own MySQL query to accomplish this.

Display All Categories with ID

<?php
$result = mysql_query("SELECT ".$table_prefix."terms.term_id, ".$table_prefix."terms.name,".$table_prefix."term_taxonomy.taxonomy FROM ".$table_prefix."terms INNER JOIN ".$table_prefix."term_taxonomy ON ".$table_prefix."terms.term_id = ".$table_prefix."term_taxonomy.term_id WHERE ".$table_prefix."term_taxonomy.taxonomy = 'category'");
while ($row = mysql_fetch_assoc($result)) {
// uncomment the line below to view the content of $row
// var_dump($row);
// category ID = $row['term_id']
// category name = $row['name']
echo $row['name'].' - ID '.$row['term_id'].'<br />';
}
?>

 

$table_prefix is a variable declared in wp-config.php, it carries value “wp_” by default unless you changed the setting. It is your SQL tables’ prefix.

WordPress stores all category, tags, etc in wp_term_taxonomy table so we can load all categories name and ID from there.

Display All Page with ID

<?php
$result = mysql_query("SELECT post_title, ID FROM ".$table_prefix."posts WHERE post_type = 'page' AND post_status = 'publish';");
while ($row = mysql_fetch_assoc($result)) {
// uncomment the line below to view the content of $row
// var_dump($row);
// page ID = $row['ID']
// page name = $row['post_title']
echo $row['post_title'].' - ID '.$row['ID'].'<br />';
}
?>

WordPress stores all pages in wp_posts table, but with post_type set as “page”.

 

source: zenverse

WordPress: Gravity Forms with Bootstrap 3 Style

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/z

You can create Gravity Forms to like Bootstrap 3 style, first, you need to enable/turn on Output HTML 5 (as YES) and turn off Output CSS (as NO), please go to Forms => Settings to do this.

After enable Output HTML5, add following style to your CSS:

.gform_wrapper ul {
  padding-left: 0;
  list-style: none; }

.gform_wrapper li {
  margin-bottom: 15px; }

.gform_wrapper form {
  margin-bottom: 0; }

.gform_wrapper .gfield_required {
  padding-left: 1px;
  color: #b94a48; }

.ginput_container input, .ginput_container select, .ginput_container textarea {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555;
  vertical-align: middle;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; }

.ginput_container input:-moz-placeholder, .ginput_container select:-moz-placeholder, .ginput_container textarea:-moz-placeholder {
  color: #999; }

.ginput_container input::-moz-placeholder, .ginput_container select::-moz-placeholder, .ginput_container textarea::-moz-placeholder {
  color: #999; }

.ginput_container input:-ms-input-placeholder, .ginput_container select:-ms-input-placeholder, .ginput_container textarea:-ms-input-placeholder {
  color: #999; }

.ginput_container input::-webkit-input-placeholder, .ginput_container select::-webkit-input-placeholder, .ginput_container textarea::-webkit-input-placeholder {
  color: #999; }

.ginput_container input:focus, .ginput_container select:focus, .ginput_container textarea:focus {
  border-color: #66afe9;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6); }

.ginput_container input[disabled], .ginput_container select[disabled], .ginput_container textarea[disabled], .ginput_container input[readonly], .ginput_container select[readonly], .ginput_container textarea[readonly], fieldset[disabled] .ginput_container input, fieldset[disabled] .ginput_container select, fieldset[disabled] .ginput_container textarea {
  cursor: not-allowed;
  background-color: #eee; }

textarea.ginput_container input, textarea.ginput_container select, textarea.ginput_container textarea {
  height: auto; }

.ginput_container textarea {
  height: auto; }

.gform_button {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.428571429;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 4px;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  color: #fff;
  background-color: #428bca;
  border-color: #357ebd; }

.gform_button:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px; }

.gform_button:hover, .gform_button:focus {
  color: #333;
  text-decoration: none; }

.gform_button:active, .gform_button.active {
  outline: 0;
  background-image: none;
  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); }

.gform_button.disabled, .gform_button[disabled], fieldset[disabled] .gform_button {
  cursor: not-allowed;
  pointer-events: none;
  opacity: .65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none; }

.gform_button:hover, .gform_button:focus, .gform_button:active, .gform_button.active, .open .dropdown-toggle.gform_button {
  color: #fff;
  background-color: #3276b1;
  border-color: #285e8e; }

.gform_button:active, .gform_button.active, .open .dropdown-toggle.gform_button {
  background-image: none; }

.gform_button.disabled, .gform_button[disabled], fieldset[disabled] .gform_button, .gform_button.disabled:hover, .gform_button[disabled]:hover, fieldset[disabled] .gform_button:hover, .gform_button.disabled:focus, .gform_button[disabled]:focus, fieldset[disabled] .gform_button:focus, .gform_button.disabled:active, .gform_button[disabled]:active, fieldset[disabled] .gform_button:active, .gform_button.disabled.active, .gform_button[disabled].active, fieldset[disabled] .gform_button.active {
  background-color: #428bca;
  border-color: #357ebd; }

.gform_wrapper .gfield_error .gfield_label {
  color: #b94a48; }

.gform_wrapper .gfield_error input, .gform_wrapper .gfield_error select, .gform_wrapper .gfield_error textarea {
  border-color: #eed3d7;
  background-color: #f2dede;
  color: #b94a48; }

.gform_wrapper .gfield_error input:focus, .gform_wrapper .gfield_error select:focus, .gform_wrapper .gfield_error textarea:focus {
  border-color: #b94a48;
  outline: 0;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(185, 74, 72, 0.6);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(185, 74, 72, 0.6); }

.validation_error {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
  background-color: #f2dede;
  border-color: #eed3d7;
  color: #b94a48; }

.validation_error h4 {
  margin-top: 0;
  color: inherit; }

.validation_error .alert-link {
  font-weight: bold; }

.validation_error>p, .validation_error>ul {
  margin-bottom: 0; }

.validation_error>p+p {
  margin-top: 5px; }

.validation_error hr {
  border-top-color: #e6c1c7; }

.validation_error .alert-link {
  color: #953b39; }

#gforms_confirmation_message {
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px; }

#gforms_confirmation_message h4 {
  margin-top: 0;
  color: inherit; }

#gforms_confirmation_message .alert-link {
  font-weight: bold; }

#gforms_confirmation_message>p, #gforms_confirmation_message>ul {
  margin-bottom: 0; }

#gforms_confirmation_message>p+p {
  margin-top: 5px; }

.gallery-row {
  padding: 15px 0; }

.aligncenter {
  display: block;
  margin: 0 auto; }

.alignleft {
  float: left; }

.alignright {
  float: right; }

figure.alignnone {
  margin-left: 0;
  margin-right: 0; }