Cách phủ tiêu đề Đăng lên hình ảnh nổi bật trên các bài đăng đơn lẻ trong Ambiance Pro

Trong diễn đàn StudioPress, một người dùng đã hỏi:

Bất cứ ai có thể cho tôi biết làm thế nào tôi có thể di chuyển tiêu đề trang trên các trang cụ thể trên những hình ảnh tính năng lớn này.

Trước tiên, chúng ta hãy xem xét cách các tiêu đề có thể được di chuyển từ vị trí mặc định của chúng sang các hình ảnh nổi bật cho TẤT CẢ các bài đăng có hình ảnh nổi bật trong Ambiance Pro.

Đây là cách có thể đặt điều này cho tất cả các bài đăng:

trong sự thay đổifunctions.php

//* Hook entry background area
add_action( 'genesis_after_header', 'ambiance_entry_background' );
function ambiance_entry_background() {

    if ( is_singular( 'post' ) || ( is_singular( 'page' ) && has_post_thumbnail() ) ) {

        echo '<div class="entry-background"></div>';

    }

}

đến

// Hook entry background area.
add_action( 'genesis_after_header', 'ambiance_entry_background' );
function ambiance_entry_background() {
    if ( is_singular( 'post' ) || ( is_singular( 'page' ) && has_post_thumbnail() ) ) {

        echo '<div class="entry-background">';
        genesis_do_post_title();
        echo '</div>';

    }
}

// Remove entry title from its default location on single posts.
add_action( 'genesis_before_entry', 'sk_remove_entry_title' );
function sk_remove_entry_title() {
    if ( ! is_singular( 'post' ) ) {
        return;
    }

    remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
}

Sau đó, thêm thông tin sau vào :style.css

.entry-background .entry-title {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #fff;
    width: 80%;
    text-align: center;
}

Để thực hiện điều này trên các Bài đăng cụ thể, chúng tôi sẽ tạo một hộp kiểm tùy chỉnh được gắn nhãn bằng ACF Pro và thực hiện một vài thay đổi trong mã.Relocate Title?

Cài đặt và kích hoạt Trường tùy chỉnh nâng cao.

Chuyển đến Trường tùy chỉnh> Trường tùy chỉnh. Tạo một nhóm trường mới được gọi là say như được hiển thị trong ảnh chụp màn hình bên dưới (đây là [gương) nhập XML nếu bạn muốn nhập]:Post Meta

Thay đổi mã đã thêm trước đó thành:functions.php

//* Hook entry background area
add_action( 'genesis_after_header', 'ambiance_entry_background' );
function ambiance_entry_background() {

    if ( is_singular( 'post' ) || ( is_singular( 'page' ) && has_post_thumbnail() ) ) {

        $relocate_title = get_post_meta( get_the_ID(), 'relocate_title', true );

        echo '<div class="entry-background">';
        if ( 1 == $relocate_title ) {
            genesis_do_post_title();
        }
        echo '</div>';

    }

}

// Remove entry title from its default location on single posts.
add_action( 'genesis_before_entry', 'sk_remove_entry_title' );
function sk_remove_entry_title() {
    $relocate_title = get_post_meta( get_the_ID(), 'relocate_title', true );

    if ( 1 != $relocate_title || ! is_singular( 'post' ) ) {
        return;
    }

    remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
}

Bây giờ, hãy truy cập các bài đăng mà bạn muốn tiêu đề được chuyển vị trí đến / phủ lên hình ảnh nổi bật và đánh dấu vào phần “Post Meta”.Relocate Title?

Các tiêu đề sẽ được chuyển vị trí chỉ cho những Bài đăng đã được đánh dấu chọn. Các bài đăng khác sẽ tiếp tục xuất hiện theo cấu hình chủ đề mặc định.Relocate Title?