The following code was used to add a 35px by 35px image to the byline of an single post page. The approach used is to modify the theme template tag “inspiro_single_entry_meta” to add the author avatar in front of the byline. <\/p>\n\n\n\n
This article applies to WordPress Inspiro v2.1.4 by WPZOOM<\/pre>\n\n\n\nLocate the file \/inc\/template-tags.php and locate the section “inspiro_single_entry_meta” and replace it with below code;<\/p>\n\n\n\n
if ( ! function_exists( 'inspiro_single_entry_meta' ) ) :\n \/**\n * Prints HTML with meta information for the current post-date\/time and author.\n *\/\n function inspiro_single_entry_meta() {\n $catlinks = '';\n\n \/* translators: Used between list items, there is a space after the comma. *\/\n $separate_meta = __( ', ', 'inspiro' );\n\n \/\/ Get Categories for posts.\n $categories_list = get_the_category_list( $separate_meta );\n\n if ( inspiro_categorized_blog() && $categories_list ) {\n $catlinks = sprintf(\n '<span class=\"entry-categories cat-links\">%s %s<\/span>',\n __( 'in', 'inspiro' ),\n $categories_list\n );\n }\n\n $author_id = get_the_author_meta( 'ID' );\n $avatar = get_avatar( $author_id, 32, '', '', array( 'class' => 'entry-author-avatar' ) );\n $byline = $avatar . ' ' . inspiro_author_link();\n\n $datetime = sprintf(\n '<span class=\"entry-date\">%s %s<\/span>',\n __( 'on', 'inspiro' ),\n inspiro_time_link()\n );\n \/\/ Finally, let's write all of this to the page.\n echo wp_kses(\n $byline . $catlinks . $datetime,\n array(\n 'a' => array(\n 'href' => array(),\n 'title' => array(),\n 'class' => array(),\n ),\n 'img' => array( \/\/ <--- add this\n 'src' => array(),\n 'class' => array(),\n 'alt' => array(),\n 'height' => array(),\n 'width' => array(),\n ),\n 'time' => array(\n 'datetime' => array(),\n 'class' => array(),\n ),\n 'span' => array(\n 'class' => array(),\n ),\n )\n );\n }\nendif;<\/code><\/pre>\n\n\n\nAdd the following to the theme CSS to style and tweak to your requirements. Its a good idea not to exceed 32px for wrapping of the article meta data.<\/p>\n\n\n\n
\/* Author avatar in post meta header *\/\n.entry-meta .entry-author-avatar {\n width: 32px; \/* match get_avatar() size *\/\n height: 32px;\n border-radius: 40%; \/* make it circular *\/\n vertical-align: middle; \/* align with text *\/\n margin-right: 6px; \/* space between avatar and author name *\/\n display: inline-block; \/* ensure inline alignment *\/\n}\n\n\/* Optional: adjust spacing if categories\/date wrap awkwardly *\/\n.entry-meta .entry-categories,\n.entry-meta .entry-date {\n margin-left: 10px;\n font-size: 0.9em; \/* slightly smaller than title *\/\n color: #666; \/* match meta color *\/\n}<\/code><\/pre>\n\n\n\n<\/p>\n","protected":false},"excerpt":{"rendered":"
The following code was used to add a 35px by 35px image to the byline of an single post page. The approach used is to modify the theme template tag “inspiro_single_entry_meta” to add the author avatar in front of the byline. This article applies to WordPress Inspiro v2.1.4 by WPZOOM Locate the file \/inc\/template-tags.php and … <\/p>\n