[Genesis] Hiển thị nội dung bên dưới bài viết theo danh mục

Chào mọi người, hôm nay mình có 1 nhiệm vụ chỉnh sửa cho 1 website sử dụng Genesis Wordpress. Cụ thể:

- Thêm vào cuối mỗi bài viết (Post) một khung quảng cáo nhỏ mà nội dung của nó được lấy từ dữ liệu của danh mục của bài viết.

Sau đây là cách làm của mình:

1. Thêm 3 trường mới vào category để khi tạo mới / hoặc chỉnh sửa thì có thể thay đổi:

- Ảnh quảng cáo: ad_img
- Tiêu đề quảng cáo: ad_title
- Đường dẫn bài quảng cáo: ad_url

Trong file functions.php của theme đang sử dụng cho website Wordpress, thêm đoạn code sau:

//add extra fields to category edit form hook
add_action ( 'edit_category_form_fields', 'extra_category_fields');
//add extra fields to category edit form callback function
function extra_category_fields( $tag ) {    //check for existing featured ID
    $t_id = $tag->term_id;
    $cat_meta = get_option( "category_$t_id");
?>

<tr class="form-field">
    <th scope="row" valign="top"><label for="Cat_meta[ad_img]"><?php _e('Ad Image Url'); ?></label></th>
    <td>
        <input type="text" name="Cat_meta[ad_img]" id="Cat_meta[ad_img]" size="40" value="<?php echo $cat_meta['ad_img'] ? $cat_meta['ad_img'] : ''; ?>"><br />
        <span class="description"><?php _e('The image is shown on post pages of this category'); ?></span>
    </td>
</tr>
<tr class="form-field">
    <th scope="row" valign="top"><label for="Cat_meta[ad_title]"><?php _e('Ad Title'); ?></label></th>
    <td>
        <input type="text" name="Cat_meta[ad_title]" id="Cat_meta[ad_title]" size="40" value="<?php echo $cat_meta['ad_title'] ? $cat_meta['ad_title'] : ''; ?>"><br />
        <span class="description"><?php _e('The Ad Title is used for the ad title on page posts of this category'); ?></span>
    </td>
</tr>
<tr class="form-field">
    <th scope="row" valign="top"><label for="Cat_meta[ad_url]"><?php _e('Ad Url'); ?></label></th>
    <td>
        <input type="text" name="Cat_meta[ad_url]" id="Cat_meta[ad_url]" size="40" value="<?php echo $cat_meta['ad_url'] ? $cat_meta['ad_url'] : ''; ?>"><br />
        <span class="description"><?php _e('The Ad Url is used for the adlink on page posts of this category'); ?></span>
    </td>
</tr>
<tr class="form-field">
    <th scope="row" valign="top"><label for="Cat_meta[ad_text]"><?php _e('Ad Text'); ?></label></th>
    <td>
        <textarea name="Cat_meta[ad_text]" id="Cat_meta[ad_text]" rows="5" cols="50" class="large-text"><?php echo $cat_meta['ad_text'] ? $cat_meta['ad_text'] : ''; ?></textarea><br />
        <span class="description"><?php _e('The Ad Text is used for the ad copy on page posts of this category'); ?></span>
    </td>
</tr>
<?php
}

// save extra category extra fields hook
add_action ( 'edited_category', 'save_extra_category_fileds');
   // save extra category extra fields callback function
function save_extra_category_fileds( $term_id ) {
    if ( isset( $_POST['Cat_meta'] ) ) {
        $t_id = $term_id;
        $cat_meta = get_option( "category_$t_id");
        $cat_keys = array_keys($_POST['Cat_meta']);
            foreach ($cat_keys as $key){
            if (isset($_POST['Cat_meta'][$key])){
                $cat_meta[$key] = $_POST['Cat_meta'][$key];
            }
        }
        //save the option array
        update_option( "category_$t_id", $cat_meta );
    }
}

2. Lấy dữ liệu meta của Category và hiển thị trong mỗi bài viết:

Thêm đoạn code cũng vào functions.php:

add_action( 'genesis_entry_footer', 'wpsites_after_post_widget', 5 );
function wpsites_after_post_widget() {
    if ( is_single() ) {
        /* genesis_widget_area( 'after-post', array(
            'before' => '<div class="after-post" class="widget-area">',
            'after'  => '</div>',
        ) ); */
        $categories = get_the_category();
        $output = '';
        if($categories){
            foreach($categories as $category) {$cat_data = get_option("category_$cat_id");
                $cat_data = get_option("category_{$category->term_id}");
                if (isset($cat_data['ad_title'])) { ?>
                    <section class="author-box" style="border: #0E4E81 2px dashed;"><?php if (!empty($cat_data['ad_img'])): ?><img src="<?=$cat_data['ad_img']?>" class="avatar avatar-70 photo" width="70" height="70" alt="<?=$cat_data['ad_title']?>"><?php endif?><a href="<?=$cat_data['ad_url']?>" title="<?=$cat_data['ad_title']?>"><h4 class="author-box-title"><?=$cat_data['ad_title']?></h4></a><div class="author-box-content"><?=$cat_data['ad_text']?></div><a href="<?=$cat_data['ad_url']?>" title="<?=$cat_data['ad_title']?>"><img src="http://example.com/wp-content/uploads/2015/04/xem-bai-thuoc-chua-khoi-benh-tri.jpg" alt="<?=$cat_data['ad_title']?>" style="padding-top: 20px;display: block;margin: 0 auto;"/></a></section>
            <?php }
            }
        }
    }
}

Phần html sử dụng bên trên bạn hoàn toàn có thể thay đổi tùy ý.

Bạn có cách làm nào khác không? Đừng ngại comment chia sẻ bên dưới cho mọi người và mình biết cách làm khác của bạn nhé!