Xin mến chào các bạn, hôm nay tui xin giới thiệu một sự kết hợp mới nữa của tui giữa plugin bất động sản và plugin Elementor builder. Đây cũng là một sản phẩm mới của tui, tui đã dung hợp và sẽ áp dụng cho các website bất động sản dạng landing page nhưng có công cụ lọc tìm kiếm của mình.

Dưới đây là một số phần trong plugin bất động sản mà tui đã kết hợp.

Bộ lọc tìm kiếm

Danh sách hiển thị khi tìm kiếm

Chi tiết bất động sản

Ngoài ra tui còn bổ sung thêm 1 số phần vào chi tiết bất động sản cho có không khí lu xu ri và chuyên nghiệp. 

Thanh điều hướng khi scroll

Các tiện ích của căn hộ.

Tài liệu kiến trúc tham khảo

Các tiện ích xung quanh khu vực

Video

Bản đồ

Liên hệ

Demo tham khảo

View source

Màn giới của tui đến đây là kết thúc. Thân ái chúc các bạn một ngày thật vui vẻ.  

The post Plugin bất động sản với elementor builder appeared first on Hi You, I am Tade.

À đó chính là Elementor , các bạn có thể vào elementor.com để nghe ngóng. Hiện tại elementor đã ra đến phiên bản 2.6.7 và tui không có quảng cáo cho elementor đâu nhe.

Bên cạnh những thứ vụn vặt như :

1.Kéo thả tùy biến khi điều chỉnh giao diện.

2.Xem giao diện thay đổi trong khi tùy chỉnh cũng hay nhưng tôi xem nó như vụn vặt thôi.

3.Thay đổi tùy chỉnh theo từng thiết bị trên chính công cụ editor cái này cung hay và  tiện lắm.

4.Lưu trữ các bản tùy chỉnh của mình thành template để backup phòng trường hợp này nọ (các đồng chí hiểu ý chứ).

5.Tùy biến cả điều hướng trang như single, blog, taxonomy,…

6.Elementor còn cho bạn tùy chỉnh layout của cả header và footer ( các này ở bản pro nhé nhưng àm ngon mà đúng không chỉ có $49 – không quảng cáo nhé).

7.Hổ trợ các modules cho woocommerce phần này nó cũng khá hay như card, menu cart mini, rating,… nhưng khi dùng các bạn lưu ý chỉ hổ trợ php 7.1 trở lên thôi nhé. Php phiên bản dưới 7.1 thì cứ chờ loading loading mãi mãi.

Sau tất cả những thứ vụn vặn có lẻ đến phần tôi thích nhất đó chính là elementor có những addon khá đa dạng cho phép developer có thể tác động vào loop và query của wordpress hay không nào. Có thể kể đến như:

Phần liệt kê tui hơi lười nhưng có chụp hình và icon installing cho sinh động đó. Nhưng phần này phải các bạn developer như tui mới cảm nhận được cái hay của nó.

Kết bài : Hiện tại so với các đối thủ khác như divi, visua composer, flatsome tôi đánh giá Elementor vượt trội hơn về trãi nghiệm người dùng và hiệu năng lập trình của nó đem lại. Tính tiện lợi của nó khá cao. Bài sau tui sẽ giới thiệu cho các bạn một website bất động sản tui đã build bằng Elementor.

Cám ơn quý dị đã xem bài viết của tôi. Good Night !

The post Elementor công cụ builder website wordpress 2019 appeared first on Hi You, I am Tade.

Hôm nay mình sẽ hướng dẫn cách sử dụng nút media trong quản trị wordpress để upload hình ảnh.

Cốt lỏi của vấn đề là sử dụng đối tượng meta_image_frame trong thư viện wordpress. Mình sẽ tiến hành từng bước để các bạn nắm rõ:

Bước 1: Tạo layout dạng HTML vu vơ và có các nút Media button

<div class="wrap" id="theme_option">
   
    <div class="container-fluid">
        <div class="Logo">
            <div class="box-title" data-toggle="collapse" href="#logo" aria-expanded="false" aria-controls="logo">Logo <span class="dashicons dashicons-arrow-right-alt2 navbar-right"></span></div>
            <div id="logo" aria-expanded="false" class="collapse in">
                <div id="images-container" class="form-group">
                    <div class="input-group">
                        <input type="text" name="wp_theme_logo_image" id="logo-image" class="form-control" value="">
                        <div class="input-group-addon">
                            <input type="button" class="logo-image-button btn btn-primary " value="Chọn hình">
                            <input type="button" class="remove-logo btn btn-primary" value="Xóa">
                        </div>
                    </div>
                    <div class="clearfix"></div>
                </div><!-- end images container -->
            </div>
        </div>
    </div>
</div>

Bước 2: Khai báo thư viện Media và Script để gọi

function wp_artisans_theme_back_end()
{
    wp_enqueue_media();
    wp_enqueue_script('custom', WP_PLUGIN_URL . '/Tester/bootstrap/js/admin_custom.js', array(),'',true );
}
add_action( 'admin_enqueue_scripts2', 'wp_artisans_theme_back_end' );

File Script

jQuery(document).ready(function($){
  // add image uploader functionality
        var meta_image_frame;
      $('.logo-image-button').live('click', function(e){
            e.preventDefault();

            if( meta_image_frame ){
             meta_image_frame.open();
                return;
            }

            meta_image_frame = wp.media.frames.file_frame = wp.media({
                title: 'Add Images',
                button: {text: 'Add to Images'},
                library: { type: 'image'}
            });

            meta_image_frame.on('select', function(){
                var media_attachment = meta_image_frame.state().get('selection').first().toJSON();

                   var url = '';

                $('#logo-image').val(media_attachment.url);
            });

            meta_image_frame.open();

      });
$('.remove-logo').click(function(){
$('#logo-image').val('');   
})
    
})

Lưu ý:

Bạn cần gọi hook admin_enqueue_scripts2  

Đến đây là xong !

Chúc các bạn may mắn.

The post Sử dụng media của wordpress để tải hình ảnh appeared first on Hi You, I am Tade.

Các loại template các bạn dùng custom post, archive và page.

Các hook được sử dụng: single_template, archive_template và page_template

Tiến hành code.

1.Custom post

Đối với custom post ta dung hook single_template. ‘ YOUR_CUSTOM_POST ‘ là tên custom post của bạn dùng. 

function get_custom_post_type_single($single_template) {
    global $post;
    if ($post->post_type == 'YOUR_CUSTOM_POST') {
        $single_template = dirname( __FILE__ ) . '/single-YOUR_CUSTOM_POST.php';
    }
    return $single_template;
}
add_filter( 'single_template', 'get_custom_post_type_single' );

2.Archive

Đối với trang archive ta dung hook archive_template. ‘ YOUR_TAXONOMY ‘ là tên taxonomy của bạn dùng.

function get_custom_archive($archive_template){
    global $wpdb;
    $archive =$wpdb->last_result;
    if ( $archive[0]->taxonomy==  'YOUR_TAXONOMY' ) {
        $archive_template = dirname( __FILE__ ) . '/archive-YOUR_TAXONOMY.php';
    }
    return $archive_template;
}
add_filter( "archive_template", "get_custom_archive" ) ;

3.Page Template

Đối với page bạn phải chọn slug chính xác thì template mới được sử dụng.

add_filter( 'page_template', 'wpa_page_template' );
function wpa_page_template( $page_template )
{
if ( is_page( YOUR_SLUG ) ) {
$page_template = dirname( __FILE__ ) . '/templates/template-YOUR_SLUG.php';
}
return $page_template;
}

Chúc các bạn thành công !

The post Tạo template trong plugin wordpress appeared first on Hi You, I am Tade.

Vẫn như củ các bạn copy code và đặt vào file functions.php thôi nhưng chú ý 1 số thông số như sau:

1.Hook : Mình sử dung 2 hook là restrict_manage_posts và parse_query.

restrict_manage_posts để lấy data taxonomy và hiển thị ra dạng dropdown taxonomy

parse_query cải tạo lại bộ lọc để nó có thể filter thêm cái taxonomy mình mới thêm.

2.Biến: Bạn thay biến post_type và taxonomy thành của mình để sử dụng nhé.

3.Code đây

add_action('restrict_manage_posts', 'tsm_filter_post_type_by_taxonomy');
function tsm_filter_post_type_by_taxonomy() {
 global $typenow;
 $post_type = 'project'; // change to your post type
 $taxonomy = 'kind'; // change to your taxonomy
 if ($typenow == $post_type) {
 $selected = isset($_GET[$taxonomy]) ? $_GET[$taxonomy] : '';
 $info_taxonomy = get_taxonomy($taxonomy);
 wp_dropdown_categories(array(
 'show_option_all' => __("Lọc {$info_taxonomy->label}"),
 'taxonomy' => $taxonomy,
 'name' => $taxonomy,
 'orderby' => 'name',
 'selected' => $selected,
 'show_count' => true,
 'hide_empty' => true,
 ));
 };
}
/**
 * Filter posts by taxonomy in admin
 * @author Hoang Thuc
 * @link https://hoangthuc.com/bo-loc-taxonomy-trong-admin-custom-post
 */
add_filter('parse_query', 'tsm_convert_id_to_term_in_query');
function tsm_convert_id_to_term_in_query($query) {
 global $pagenow;
 $post_type = 'project'; // change to your post type
 $taxonomy = 'kind'; // change to your taxonomy
 $q_vars = &$query->query_vars;
 if ( $pagenow == 'edit.php' && isset($q_vars['post_type']) && $q_vars['post_type'] == $post_type && isset($q_vars[$taxonomy]) && is_numeric($q_vars[$taxonomy]) && $q_vars[$taxonomy] != 0 ) {
 $term = get_term_by('id', $q_vars[$taxonomy], $taxonomy);
 $q_vars[$taxonomy] = $term->slug;
 }
} 

Chúc các bạn thành công !

The post Thêm bộ lọc taxonomy trong admin custom post type appeared first on Hi You, I am Tade.

Phần 2 mình sẽ hướng dẫn về cách ẩn slug trên taxonomy custom post khi show bài viết. Các bạn nào chưa xem phần 1 hướng dẫn về cách ẩn slug trên custom post.

Phần này mình sẽ hướng dẫn theo 2 cách , thứ nhất là dung hook trong code wordpress, hai là dùng plugin wordpress. Cách 2 có thể dùng dễ dàng cho các bạn không rành về code wordpress.

1.Dùng hook request để ẩn slug taxonomy

add_filter('request', 'rudr_change_term_request', 1, 1 );

function rudr_change_term_request($query){

$tax_name = 'report_category';
if( $query['attachment'] ) :
$include_children = true;
$name = $query['attachment'];
else:
$include_children = false;
$name = $query['name'];
endif;
$term = get_term_by('slug', $name, $tax_name);

if (isset($name) && $term && !is_wp_error($term)):

if( $include_children ) {
unset($query['attachment']);
$parent = $term->parent;
while( $parent ) {
$parent_term = get_term( $parent, $tax_name);
$name = $parent_term->slug . '/' . $name;
$parent = $parent_term->parent;
}
} else {
unset($query['name']);
}

switch( $tax_name ):
case 'category':{
$query['category_name'] = $name; // for categories
break;
}
case 'post_tag':{
$query['tag'] = $name; // for post tags
break;
}
default:{
$query[$tax_name] = $name; // for another taxonomies
break;
}
endswitch;

endif;

return $query;

}

Note* Trong phần này mình dùng hàm rudr_change_term_request để filter hook request

2. Dùng plugin wp htaccess control

Các bạn vào setting >> htaccess control

Chọn Remove Taxonomies and author base sau đó tắt các slug taxonomy mà bạn muốn.

Sau đó save lại. nếu vẫn chưa hoạt động các bạn vào setting >> permalink bấm  save lại.

Chúc các bạn thành công !

The post Xóa slug trên custom post và custom taxonomy: Phần 2 appeared first on Hi You, I am Tade.

Đầu tiên về custom post (nếu bạn nào chưa biết về custom post có thể xem bài viết trước của mình).

1.Xóa slug trên custom post trong trang single:

Link custom post single ban đầu: https://hoangthuc.com/report/bao-cao-thu-chi/

Link custom post single cần thay thành: https://hoangthuc.com/bao-cao-thu-chi/

Custom post type mình làm ở đây là “report” nếu làm bạn có thể tùy biến custom post này. Các bạn vào file fucntions.php và thêm đoạn code có định dạng bên dưới.

// remove slug custom_post type
function na_remove_slug( $post_link, $post, $leavename ) {

    if ( 'report' != $post->post_type || 'publish' != $post->post_status ) {
        return $post_link;
    }

    $post_link = str_replace( '/' . $post->post_type . '/', '/', $post_link );

    return $post_link;
}
add_filter( 'post_type_link', 'na_remove_slug', 10, 3 );

Note* Trong phần này bạn sẽ dung hàm na_remove_slug để filter vào hook post_type_link

2. Xữ lý lỗi 301 redirect khi chuyển:

Trong quá trình remove slug như bước 1 wp sẽ xuất hiện lỗi 301 không tìm thấy trang. Cách xữ lý.

function na_parse_request( $query ) {

    if ( ! $query->is_main_query() || 2 != count( $query->query ) || ! isset( $query->query['page'] ) ) {
        return;
    }

    if ( ! empty( $query->query['name'] ) ) {
        $query->set( 'post_type', array( 'post', 'report', 'page' ) );
    }
}
add_action( 'pre_get_posts', 'na_parse_request' );

Sau đó các bạn và Setting => Permalink và Save button lại để hoàn tất.

Chúc các bạn thành công !

The post Xóa slug trên custom post và custom taxonomy: Phần 1 appeared first on Hi You, I am Tade.

Nguyên nhân: Do wordpress lưu trữ các đường dẫn tỉnh trong database nện khi bạn chuyển sang domain mới nhưng databse vẫn còn là url của domian củ dẫn đến phát sinh lỗi.

Giải quyết: Đã biết nguyên nhân thì cũng sẽ giải quyết dễ dàng thôi đó là chúng ta sẽ đổi url theo domain mới.

Phương thức:

Trường hợp bị redirect cả khi vào wp-admin. Đối với trường hợp này chúng ta cần phải vào wp-config.php và set lại một số thống số như sau:

define('WP_HOME','URL domain mới');
define('WP_SITEURL','URL domain mới');

Như vậy đã vào được wp-admin. Còn đối với trường hợp vào wp-admin bình thường thì ta tiếp bước 2:

Cài plugin Velvet Blues Update URLs 

Plugin này cho phép ta chuyển url domain củ sang domain mới đối với post, page, media, custom post. Đây là giao diện plugin

Chúc các bạn thành công !

The post Lỗi url khi chuyển website sang domain mới trong wordpress appeared first on Hi You, I am Tade.

/**
 * Display time since post was published
 *
 * @uses	human_time_diff()  Return time difference in easy to read format
 * @uses	get_the_time()  Get the time the post was published
 * @uses	current_time()  Get the current time
 *
 * @return	string  Timestamp since post was published
 *
 * @author c.bavota
 */
function get_time_since_posted() {

	$time_since_posted = human_time_diff( get_the_time( 'U' ), current_time( 'timestamp' ) ) . ' ago';

	return $time_since_posted;

}

Bây giờ các bạn có thể sử dụng hàm get_time_since_posted() để hiển thị thời gian từ ngày đăng bài cho đến hiện tại trong loop wordpress.
Tham khảo hàm human_time_diff() tại http://codex.wordpress.org/Function_Reference/human_time_diff

The post Hiển thị thời gian kể từ ngày đăng trong wordpress appeared first on Hi You, I am Tade.

Trước hết mình xin giới thiệu cách tạo custom post đơn giản nhất có thể dành cho người không chuyên về code đó là dùng plugin. Các plugin cho phép bạn tạo mọi thứ về custom post như taxonomy, field , post type,…

Custom post type UI

Type

Đây là 2 plugin mình đã sử dụng qua và theo đánh giá của mình thì rất đầy đủ.

Và cách thứ 2 mình muốn hướng dẫn đó là code. Các bạn có thể tích hợp trong plugin, hoặc theme.

Khởi tạo custom post type

<?php
 if( ! function_exists( 'Domain_create_post_type' ) ) :
 function Domain_create_post_type() {
 $labels = array(
 'name' => 'Domain',
 'singular_name' => 'Domain',
 'add_new' => 'Add Domain',
 'all_items' => 'All Domain',
 'add_new_item' => 'Add Domain',
 'edit_item' => 'Edit Domain',
 'new_item' => 'New Domain',
 'view_item' => 'View Domain',
 'search_items' => 'Search Domain',
 'not_found' => 'No Domain found',
 'not_found_in_trash' => 'No Domain found in trash',
 'parent_item_colon' => 'Parent Domain'
 //'menu_name' => default to 'name'
 );
 $args = array(
 'labels' => $labels,
 'public' => true,
 'has_archive' => true,
 'publicly_queryable' => true,
 'query_var' => true,
 'rewrite' => true,
 'capability_type' => 'post',
 'hierarchical' => false,
 'supports' => array(
 'title',
 'editor',
 ),
 'menu_position' => 5,
 'menu_icon' => 'dashicons-clipboard',
 'exclude_from_search' => false,
 'register_meta_box_cb' => 'domain_add_post_type_metabox'
 );
 register_post_type( 'domain', $args );

register_taxonomy( 'domain_category', // register custom taxonomy - category
 'domain',
 array(
 'hierarchical' => true,
 'labels' => array(
 'name' => 'Domain category',
 'singular_name' => 'Domain category',
 )
 )
 );
 register_taxonomy( 'domain_tag', // register custom taxonomy - tag
 'domain',
 array(
 'hierarchical' => false,
 'labels' => array(
 'name' => 'Domain tag',
 'singular_name' => 'Domain tag',
 )
 )
 );
 }
 add_action( 'init', 'Domain_create_post_type' );
endif;

 function domain_add_post_type_metabox() { 
 add_meta_box( 'domain_metabox', 'Information', 'domain_metabox', 'domain', 'normal' );
 }


 function domain_metabox() {
 global $post;
 $registrar = get_post_meta($post->ID, 'registrar', true);

echo '<div class="form-horizontal" > 
<div class="form-group"> 
<label for="inputEmail3" class="col-sm-2 control-label">Registrar</label> 
<div class="col-sm-10"> <input type="text" class="form-control" name="registrar" value="'.$registrar .'" > 
</div> </div>
</div>'; 

function domain_post_save_meta( $post_id, $post ) { 
 $domain_post_meta['registrar'] = strtotime($_POST['registrar']);
 foreach( $domain_post_meta as $key => $value ) { 
 $value = implode(',', (array)$value); 
 if( get_post_meta( $post->ID, $key, FALSE ) ) { 
 update_post_meta($post->ID, $key, $value);
 } else { 
 add_post_meta( $post->ID, $key, $value );
 }
 if( !$value ) { 
 delete_post_meta( $post->ID, $key );
 }
 }
 }
 add_action( 'save_post', 'domain_post_save_meta', 1, 2 ); 
?>

Trong đây mình có làm phần tích hợp meta box nếu các bạn thấy không cần thiết thì bỏ ra nhé.

Chúc các bạn thành công !

The post WordPress nâng cao 1: Custom post type appeared first on Hi You, I am Tade.