I’m using the Twenty Twenty One WordPress theme and would like to add an author image below the title and the excerpt in the entry header for all the single-post pages.
Here’s a photo of where I’d like the image to go:
Image of blog post
I’ve been searching a lot on the web trying to find a solution, and I’m pretty sure I need to add some kind of code to the Functions.php section in the theme editor. But most of the solutions I find is only for either the Genesis theme framework or the GeneratePress theme framework.
Here’s a copy of the Functions.php for the theme:
<?php
if ( version_compare( $GLOBALS['wp_version'], '5.3', '<' ) ) {
require get_template_directory() . '/inc/back-compat.php';
}
if ( ! function_exists( 'twenty_twenty_one_setup' ) ) {
function twenty_twenty_one_setup() {
load_theme_textdomain( 'twentytwentyone', get_template_directory() . '/languages' );
add_theme_support( 'automatic-feed-links' );
add_theme_support( 'title-tag' );
add_theme_support(
'post-formats',
array(
'link',
'aside',
'gallery',
'image',
'quote',
'status',
'video',
'audio',
'chat',
)
);
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 1568, 9999 );
register_nav_menus(
array(
'primary' => esc_html__( 'Primary menu', 'twentytwentyone' ),
'footer' => esc_html__( 'Secondary menu', 'twentytwentyone' ),
)
);
add_theme_support(
'html5',
array(
'comment-form',
'comment-list',
'gallery',
'caption',
'style',
'script',
'navigation-widgets',
)
);
$logo_width = 300;
$logo_height = 100;
add_theme_support(
'custom-logo',
array(
'height' => $logo_height,
'width' => $logo_width,
'flex-width' => true,
'flex-height' => true,
'unlink-homepage-logo' => true,
)
);
add_theme_support( 'customize-selective-refresh-widgets' );
add_theme_support( 'wp-block-styles' );
add_theme_support( 'align-wide' );
add_theme_support( 'editor-styles' );
$background_color = get_theme_mod( 'background_color', 'D1E4DD' );
if ( 127 > Twenty_Twenty_One_Custom_Colors::get_relative_luminance_from_hex( $background_color ) ) {
add_theme_support( 'dark-editor-style' );
}
$editor_stylesheet_path = './assets/css/style-editor.css';
global $is_IE;
if ( $is_IE ) {
$editor_stylesheet_path = './assets/css/ie-editor.css';
}
add_editor_style( $editor_stylesheet_path );
add_theme_support(
'editor-font-sizes',
array(
array(
'name' => esc_html__( 'Extra small', 'twentytwentyone' ),
'shortName' => esc_html_x( 'XS', 'Font size', 'twentytwentyone' ),
'size' => 16,
'slug' => 'extra-small',
),
array(
'name' => esc_html__( 'Small', 'twentytwentyone' ),
'shortName' => esc_html_x( 'S', 'Font size', 'twentytwentyone' ),
'size' => 18,
'slug' => 'small',
),
array(
'name' => esc_html__( 'Normal', 'twentytwentyone' ),
'shortName' => esc_html_x( 'M', 'Font size', 'twentytwentyone' ),
'size' => 20,
'slug' => 'normal',
),
array(
'name' => esc_html__( 'Large', 'twentytwentyone' ),
'shortName' => esc_html_x( 'L', 'Font size', 'twentytwentyone' ),
'size' => 24,
'slug' => 'large',
),
array(
'name' => esc_html__( 'Extra large', 'twentytwentyone' ),
'shortName' => esc_html_x( 'XL', 'Font size', 'twentytwentyone' ),
'size' => 40,
'slug' => 'extra-large',
),
array(
'name' => esc_html__( 'Huge', 'twentytwentyone' ),
'shortName' => esc_html_x( 'XXL', 'Font size', 'twentytwentyone' ),
'size' => 96,
'slug' => 'huge',
),
array(
'name' => esc_html__( 'Gigantic', 'twentytwentyone' ),
'shortName' => esc_html_x( 'XXXL', 'Font size', 'twentytwentyone' ),
'size' => 144,
'slug' => 'gigantic',
),
)
);
add_theme_support(
'custom-background',
array(
'default-color' => 'd1e4dd',
)
);
$black = '#000000';
$dark_gray = '#28303D';
$gray = '#39414D';
$green = '#D1E4DD';
$blue = '#D1DFE4';
$purple = '#D1D1E4';
$red = '#E4D1D1';
$orange = '#E4DAD1';
$yellow = '#EEEADD';
$white = '#FFFFFF';
add_theme_support(
'editor-color-palette',
array(
array(
'name' => esc_html__( 'Black', 'twentytwentyone' ),
'slug' => 'black',
'color' => $black,
),
array(
'name' => esc_html__( 'Dark gray', 'twentytwentyone' ),
'slug' => 'dark-gray',
'color' => $dark_gray,
),
array(
'name' => esc_html__( 'Gray', 'twentytwentyone' ),
'slug' => 'gray',
'color' => $gray,
),
array(
'name' => esc_html__( 'Green', 'twentytwentyone' ),
'slug' => 'green',
'color' => $green,
),
array(
'name' => esc_html__( 'Blue', 'twentytwentyone' ),
'slug' => 'blue',
'color' => $blue,
),
array(
'name' => esc_html__( 'Purple', 'twentytwentyone' ),
'slug' => 'purple',
'color' => $purple,
),
array(
'name' => esc_html__( 'Red', 'twentytwentyone' ),
'slug' => 'red',
'color' => $red,
),
array(
'name' => esc_html__( 'Orange', 'twentytwentyone' ),
'slug' => 'orange',
'color' => $orange,
),
array(
'name' => esc_html__( 'Yellow', 'twentytwentyone' ),
'slug' => 'yellow',
'color' => $yellow,
),
array(
'name' => esc_html__( 'White', 'twentytwentyone' ),
'slug' => 'white',
'color' => $white,
),
)
);
add_theme_support(
'editor-gradient-presets',
array(
array(
'name' => esc_html__( 'Purple to yellow', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $yellow . ' 100%)',
'slug' => 'purple-to-yellow',
),
array(
'name' => esc_html__( 'Yellow to purple', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $purple . ' 100%)',
'slug' => 'yellow-to-purple',
),
array(
'name' => esc_html__( 'Green to yellow', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $green . ' 0%, ' . $yellow . ' 100%)',
'slug' => 'green-to-yellow',
),
array(
'name' => esc_html__( 'Yellow to green', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $green . ' 100%)',
'slug' => 'yellow-to-green',
),
array(
'name' => esc_html__( 'Red to yellow', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $yellow . ' 100%)',
'slug' => 'red-to-yellow',
),
array(
'name' => esc_html__( 'Yellow to red', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $yellow . ' 0%, ' . $red . ' 100%)',
'slug' => 'yellow-to-red',
),
array(
'name' => esc_html__( 'Purple to red', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $purple . ' 0%, ' . $red . ' 100%)',
'slug' => 'purple-to-red',
),
array(
'name' => esc_html__( 'Red to purple', 'twentytwentyone' ),
'gradient' => 'linear-gradient(160deg, ' . $red . ' 0%, ' . $purple . ' 100%)',
'slug' => 'red-to-purple',
),
)
);
if ( is_customize_preview() ) {
require get_template_directory() . '/inc/starter-content.php';
add_theme_support( 'starter-content', twenty_twenty_one_get_starter_content() );
}
add_theme_support( 'responsive-embeds' );
add_theme_support( 'custom-line-height' );
add_theme_support( 'experimental-link-color' );
add_theme_support( 'custom-spacing' );
add_theme_support( 'custom-units' );
add_filter( 'rss_widget_feed_link', '__return_false' );
}
}
add_action( 'after_setup_theme', 'twenty_twenty_one_setup' );
function twenty_twenty_one_widgets_init() {
register_sidebar(
array(
'name' => esc_html__( 'Footer', 'twentytwentyone' ),
'id' => 'sidebar-1',
'description' => esc_html__( 'Add widgets here to appear in your footer.', 'twentytwentyone' ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
)
);
}
add_action( 'widgets_init', 'twenty_twenty_one_widgets_init' );
function twenty_twenty_one_content_width() {
$GLOBALS['content_width'] = apply_filters( 'twenty_twenty_one_content_width', 750 );
}
add_action( 'after_setup_theme', 'twenty_twenty_one_content_width', 0 );
function twenty_twenty_one_scripts() {
global $is_IE, $wp_scripts;
if ( $is_IE ) {
wp_enqueue_style( 'twenty-twenty-one-style', get_template_directory_uri() . '/assets/css/ie.css', array(), wp_get_theme()->get( 'Version' ) );
} else {
wp_enqueue_style( 'twenty-twenty-one-style', get_template_directory_uri() . '/style.css', array(), wp_get_theme()->get( 'Version' ) );
}
wp_style_add_data( 'twenty-twenty-one-style', 'rtl', 'replace' );
wp_enqueue_style( 'twenty-twenty-one-print-style', get_template_directory_uri() . '/assets/css/print.css', array(), wp_get_theme()->get( 'Version' ), 'print' );
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
wp_register_script(
'twenty-twenty-one-ie11-polyfills-asset',
get_template_directory_uri() . '/assets/js/polyfills.js',
array(),
wp_get_theme()->get( 'Version' ),
true
);
wp_register_script(
'twenty-twenty-one-ie11-polyfills',
null,
array(),
wp_get_theme()->get( 'Version' ),
true
);
wp_add_inline_script(
'twenty-twenty-one-ie11-polyfills',
wp_get_script_polyfill(
$wp_scripts,
array(
'Element.prototype.matches && Element.prototype.closest && window.NodeList && NodeList.prototype.forEach' => 'twenty-twenty-one-ie11-polyfills-asset',
)
)
);
if ( has_nav_menu( 'primary' ) ) {
wp_enqueue_script(
'twenty-twenty-one-primary-navigation-script',
get_template_directory_uri() . '/assets/js/primary-navigation.js',
array( 'twenty-twenty-one-ie11-polyfills' ),
wp_get_theme()->get( 'Version' ),
true
);
}
wp_enqueue_script(
'twenty-twenty-one-responsive-embeds-script',
get_template_directory_uri() . '/assets/js/responsive-embeds.js',
array( 'twenty-twenty-one-ie11-polyfills' ),
wp_get_theme()->get( 'Version' ),
true
);
}
add_action( 'wp_enqueue_scripts', 'twenty_twenty_one_scripts' );
function twentytwentyone_block_editor_script() {
wp_enqueue_script( 'twentytwentyone-editor', get_theme_file_uri( '/assets/js/editor.js' ), array( 'wp-blocks', 'wp-dom' ), wp_get_theme()->get( 'Version' ), true );
}
add_action( 'enqueue_block_editor_assets', 'twentytwentyone_block_editor_script' );
function twenty_twenty_one_skip_link_focus_fix() {
if ( defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ) {
echo '<script>';
include get_template_directory() . '/assets/js/skip-link-focus-fix.js';
echo '</script>';
} else {
?>
<script>
/(trident|msie)/i.test(navigator.userAgent)&&document.getElementById&&window.addEventListener&&window.addEventListener("hashchange",(function(){var t,e=location.hash.substring(1);/^[A-z0-9_-]+$/.test(e)&&(t=document.getElementById(e))&&(/^(?:a|select|input|button|textarea)$/i.test(t.tagName)||(t.tabIndex=-1),t.focus())}),!1);
</script>
<?php
}
}
add_action( 'wp_print_footer_scripts', 'twenty_twenty_one_skip_link_focus_fix' );
function twenty_twenty_one_non_latin_languages() {
$custom_css = twenty_twenty_one_get_non_latin_css( 'front-end' );
if ( $custom_css ) {
wp_add_inline_style( 'twenty-twenty-one-style', $custom_css );
}
}
add_action( 'wp_enqueue_scripts', 'twenty_twenty_one_non_latin_languages' );
require get_template_directory() . '/classes/class-twenty-twenty-one-svg-icons.php';
require get_template_directory() . '/classes/class-twenty-twenty-one-custom-colors.php';
new Twenty_Twenty_One_Custom_Colors();
require get_template_directory() . '/inc/template-functions.php';
require get_template_directory() . '/inc/menu-functions.php';
require get_template_directory() . '/inc/template-tags.php';
require get_template_directory() . '/classes/class-twenty-twenty-one-customize.php';
new Twenty_Twenty_One_Customize();
require get_template_directory() . '/inc/block-patterns.php';
require get_template_directory() . '/inc/block-styles.php';
require_once get_template_directory() . '/classes/class-twenty-twenty-one-dark-mode.php';
new Twenty_Twenty_One_Dark_Mode();
function twentytwentyone_customize_preview_init() {
wp_enqueue_script(
'twentytwentyone-customize-helpers',
get_theme_file_uri( '/assets/js/customize-helpers.js' ),
array(),
wp_get_theme()->get( 'Version' ),
true
);
wp_enqueue_script(
'twentytwentyone-customize-preview',
get_theme_file_uri( '/assets/js/customize-preview.js' ),
array( 'customize-preview', 'customize-selective-refresh', 'jquery', 'twentytwentyone-customize-helpers' ),
wp_get_theme()->get( 'Version' ),
true
);
}
add_action( 'customize_preview_init', 'twentytwentyone_customize_preview_init' );
function twentytwentyone_customize_controls_enqueue_scripts() {
wp_enqueue_script(
'twentytwentyone-customize-helpers',
get_theme_file_uri( '/assets/js/customize-helpers.js' ),
array(),
wp_get_theme()->get( 'Version' ),
true
);
}
add_action( 'customize_controls_enqueue_scripts', 'twentytwentyone_customize_controls_enqueue_scripts' );
function twentytwentyone_the_html_classes() {
$classes = apply_filters( 'twentytwentyone_html_classes', '' );
if ( ! $classes ) {
return;
}
echo 'class="' . esc_attr( $classes ) . '"';
}
function twentytwentyone_add_ie_class() {
?>
<script>
if ( -1 !== navigator.userAgent.indexOf( 'MSIE' ) || -1 !== navigator.appVersion.indexOf( 'Trident/' ) ) {
document.body.classList.add( 'is-IE' );
}
</script>
<?php
}
add_action( 'wp_footer', 'twentytwentyone_add_ie_class' );
Can someone help me out with my little problem? Thanks a ton!
Cheers,
Jakob
2
Answers
it’s probably used gravatar website:
go that site and create a account and give email used in wordpress admin panel
You can add it just by adding a block for
Post Author(See the attachment below).It will display the Profile image and name of the author of the posy.
This is the default feature in Twenty Twenty One theme.
UPDATE 1:
You can add post author to all post/pages just by editing the page/posts template. Here are the steps to do the same:
UPDATE 2
You can also add the same programmatically just by following the given below article:
https://www.wpkube.com/how-to-add-author-box-in-wordpress-posts/