How to implement an user avatar in a post?
How to implement an user avatar in a post?
How to implement an user avatar in a post?
How to implement an user avatar in a post?More details needed.
Do you want it added to all posts automatically?
Is it WordPress CMS ?
Do you want it as editor button for inserting ?
Avatar of post author, or ?
Sorry, your are right! ;-)
Yes, it is WordPress and I want to insert the post autors image automatically in every blogpost.
Sorry, your are right! ;-) Yes, it is WordPress and I want to insert the post autors image automatically in every blogpost.Add this in Settings CMS code and Additional CSS code:
/*Function to Add Author Box*/
function add_author_box($content){
if( is_single() ) {
/*Editable*/
$img_ext = 'jpg'; //Replace this with png if you are using PNG images.
$img_size = 82; //Edit this value to change the author image size.
/*Getting author info*/
$auth_id = get_the_author_meta('ID'); //Get author ID.
$auth_name = get_the_author_meta('display_name'); // Get author name.
$auth_des = get_the_author_meta('description'); // Get author description.
$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.
$upload_dir = wp_upload_dir();
$uploads_folder_url = $upload_dir['url']; //uploads folder URL.
$uploads_folder_path = $upload_dir['path']; //uploads folder path.
$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.
$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.
/*Check if user uploaded avatar exists*/
if(file_exists($auth_avt_path)){
$auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'">'; //If user uploaded avatar exists, use it in the display.
}else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.
}
/*Output*/
$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";
}
return $content;
}
add_filter ( 'the_content', 'add_author_box', 0 );
/*author box style*/
#authorbox{
background: #fff; /*background color of the author box*/
border: 1px solid #ccc; /* border around the box */
width:100%;
overflow:hidden;
color: #333;
margin:15px 0 15px 0; /*space top and bottom of the box*/
padding-bottom:5px;
}
#authorbox h3{
font-size: 18px; /*font size of heading containing the author name*/
color:#333; /* color of the heading text */
margin:0 0 5px 0;
padding:5px 2px 5px 5px;
border-bottom: 1px solid #ccc;
}
#authorbox a{
color: #c87137; /* Link color */
text-decoration:none;
}
#authorbox img{
margin:0;
padding: 0 5px 0px 0px;
float:left;
}
#authorbox p{
color:#333; /* Author description text color */
margin:0;
padding:0px 5px 5px 5px;
font-size:14px;
line-height:150%;
}
<div id="authorarea">
<?php echo="" get_avatar(="" get_the_author_meta(="" 'user_email'="" ),="" 70="" );=""?>
<h3>About <?php echo="" get_the_author();=""?></h3>
<div class="authorinfo">
<?php the_author_meta(="" 'description'="" );=""?>
<a class="author-link" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" rel="author">View posts by <?php echo="" get_the_author();=""?>
<span class="meta-nav">→</span></a>
</div>
</div>
#authorarea{
background: #f0f0f0;
border: 1px solid #d2d2d2;
padding: 10px;
width:500px;
overflow:hidden;
color: #333;
}
#authorarea h3{
font-size: 18px;
color:#333;
margin:0;
padding:10px 10px 5px 10px;
}
#authorarea h3 a{
text-decoration:none;
color: #333;
font-weight: bold;
}
#authorarea img{
margin:0;
padding:10px;
float:left;
border: 1px solid #ddd;
width: 100px;
height: 100px;
}
#authorarea p{
color:#333;
margin:0;
padding:0px 10px 10px 10px;
}
#authorarea p a{
color:#333;
}
.authorinfo{
padding-left:120px;
}
Add this in Settings CMS code and Additional CSS code:
/*Function to Add Author Box*/
function add_author_box($content){
if( is_single() ) {
/*Editable*/
$img_ext = 'jpg'; //Replace this with png if you are using PNG images.
$img_size = 82; //Edit this value to change the author image size.
/*Getting author info*/
$auth_id = get_the_author_meta('ID'); //Get author ID.
$auth_name = get_the_author_meta('display_name'); // Get author name.
$auth_des = get_the_author_meta('description'); // Get author description.
$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.
$upload_dir = wp_upload_dir();
$uploads_folder_url = $upload_dir['url']; //uploads folder URL.
$uploads_folder_path = $upload_dir['path']; //uploads folder path.
$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.
$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.
/*Check if user uploaded avatar exists*/
if(file_exists($auth_avt_path)){
$auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'">'; //If user uploaded avatar exists, use it in the display.
}else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.
}
/*Output*/
$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";
}
return $content;
}
add_filter ( 'the_content', 'add_author_box', 0 );
-------------
/*author box style*/
#authorbox{
background: #fff; /*background color of the author box*/
border: 1px solid #ccc; /* border around the box */
width:100%;
overflow:hidden;
color: #333;
margin:15px 0 15px 0; /*space top and bottom of the box*/
padding-bottom:5px;
}
#authorbox h3{
font-size: 18px; /*font size of heading containing the author name*/
color:#333; /* color of the heading text */
margin:0 0 5px 0;
padding:5px 2px 5px 5px;
border-bottom: 1px solid #ccc;
}
#authorbox a{
color: #c87137; /* Link color */
text-decoration:none;
}
#authorbox img{
margin:0;
padding: 0 5px 0px 0px;
float:left;
}
#authorbox p{
color:#333; /* Author description text color */
margin:0;
padding:0px 5px 5px 5px;
font-size:14px;
line-height:150%;
}
------------------------
<div id="authorarea">
<?php echo="" get_avatar(="" get_the_author_meta(="" 'user_email'="" ),="" 70="" );=""?>
<h3>About <?php echo="" get_the_author();=""?></h3>
<div class="authorinfo">
<?php the_author_meta(="" 'description'="" );=""?>
<a class="author-link" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" rel="author">View posts by <?php echo="" get_the_author();=""?>
<span class="meta-nav">→</span></a>
</div>
</div>
--------------
#authorarea{
background: #f0f0f0;
border: 1px solid #d2d2d2;
padding: 10px;
width:500px;
overflow:hidden;
color: #333;
}
#authorarea h3{
font-size: 18px;
color:#333;
margin:0;
padding:10px 10px 5px 10px;
}
#authorarea h3 a{
text-decoration:none;
color: #333;
font-weight: bold;
}
#authorarea img{
margin:0;
padding:10px;
float:left;
border: 1px solid #ddd;
width: 100px;
height: 100px;
}
#authorarea p{
color:#333;
margin:0;
padding:0px 10px 10px 10px;
}
#authorarea p a{
color:#333;
}
.authorinfo{
padding-left:120px;
}
Use one of them. Dont know how it looks, test it and raport back with screenshots. I tested it long time ago.
Second one is for use with CMS Control insert direct in template, not in Settings tab. You have more layout control over second one.
Use one of them. Dont know how it looks, test it and raport back with screenshots. I tested it long time ago. Second one is for use with CMS Control insert direct in template, not in Settings tab. You have more layout control over second one.Forum really screws code formatting here.
/Function to Add Author Box/<br>function add_author_box($content){<br><br>if( is_single() ) {<br><br>/Editable/<br>$img_ext = 'jpg'; //Replace this with png if you are using PNG images.<br>$img_size = 82; //Edit this value to change the author image size.<br><br>/Getting author info/<br>$auth_id = get_the_author_meta('ID'); //Get author ID.<br>$auth_name = get_the_author_meta('display_name'); // Get author name.<br>$auth_des = get_the_author_meta('description'); // Get author description.<br>$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.<br>$upload_dir = wp_upload_dir();<br>$uploads_folder_url = $upload_dir['url']; //uploads folder URL.<br>$uploads_folder_path = $upload_dir['path']; //uploads folder path.<br>$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.<br>$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.<br><br>/Check if user uploaded avatar exists/<br>if(file_exists($auth_avt_path)){<br> $auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'" >'; //If user uploaded avatar exists, use it in the display.<br> }else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.<br> }<br> <br>/Output/<br>$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";<br>}<br>return $content;<br>}<br>add_filter ( 'the_content', 'add_author_box', 0 );
Forum really screws code formatting here. /*Function to Add Author Box*/<br>function add_author_box($content){<br><br>if( is_single() ) {<br><br>/*Editable*/<br>$img_ext = 'jpg'; //Replace this with png if you are using PNG images.<br>$img_size = 82; //Edit this value to change the author image size.<br><br>/*Getting author info*/<br>$auth_id = get_the_author_meta('ID'); //Get author ID.<br>$auth_name = get_the_author_meta('display_name'); // Get author name.<br>$auth_des = get_the_author_meta('description'); // Get author description.<br>$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.<br>$upload_dir = wp_upload_dir();<br>$uploads_folder_url = $upload_dir['url']; //uploads folder URL.<br>$uploads_folder_path = $upload_dir['path']; //uploads folder path.<br>$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.<br>$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.<br><br>/*Check if user uploaded avatar exists*/<br>if(file_exists($auth_avt_path)){<br> $auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'" >'; //If user uploaded avatar exists, use it in the display.<br> }else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.<br> }<br> <br>/*Output*/<br>$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";<br>}<br>return $content;<br>}<br>add_filter ( 'the_content', 'add_author_box', 0 );I cant. Pointless unless they fix it in forum.
I cant. Pointless unless they fix it in forum./*Function to Add Author Box*/
function add_author_box($content){
if( is_single() ) {
/*Editable*/
$img_ext = 'jpg'; //Replace this with png if you are using PNG images.
$img_size = 82; //Edit this value to change the author image size.
/*Getting author info*/
$auth_id = get_the_author_meta('ID'); //Get author ID.
$auth_name = get_the_author_meta('display_name'); // Get author name.
$auth_des = get_the_author_meta('description'); // Get author description.
$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.
$upload_dir = wp_upload_dir();
$uploads_folder_url = $upload_dir['url']; //uploads folder URL.
$uploads_folder_path = $upload_dir['path']; //uploads folder path.
$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.
$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.
/*Check if user uploaded avatar exists*/
if(file_exists($auth_avt_path)){
$auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'" >'; //If user uploaded avatar exists, use it in the display.
}else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.
}
/*Output*/
$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";
}
return $content;
}
add_filter ( 'the_content', 'add_author_box', 0 );
/*Function to Add Author Box*/
function add_author_box($content){
if( is_single() ) {
/*Editable*/
$img_ext = 'jpg'; //Replace this with png if you are using PNG images.
$img_size = 82; //Edit this value to change the author image size.
/*Getting author info*/
$auth_id = get_the_author_meta('ID'); //Get author ID.
$auth_name = get_the_author_meta('display_name'); // Get author name.
$auth_des = get_the_author_meta('description'); // Get author description.
$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.
$upload_dir = wp_upload_dir();
$uploads_folder_url = $upload_dir['url']; //uploads folder URL.
$uploads_folder_path = $upload_dir['path']; //uploads folder path.
$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.
$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.
/*Check if user uploaded avatar exists*/
if(file_exists($auth_avt_path)){
$auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'" >'; //If user uploaded avatar exists, use it in the display.
}else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.
}
/*Output*/
$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";
}
return $content;
}
add_filter ( 'the_content', 'add_author_box', 0 );
/*author box style*/
#authorbox{
background: #fff; /*background color of the author box*/
border: 1px solid #ccc; /* border around the box */
width:100%;
overflow:hidden;
color: #333;
margin:15px 0 15px 0; /*space top and bottom of the box*/
padding-bottom:5px;
}
#authorbox h3{
font-size: 18px; /*font size of heading containing the author name*/
color:#333; /* color of the heading text */
margin:0 0 5px 0;
padding:5px 2px 5px 5px;
border-bottom: 1px solid #ccc;
}
#authorbox a{
color: #c87137; /* Link color */
text-decoration:none;
}
#authorbox img{
margin:0;
padding: 0 5px 0px 0px;
float:left;
}
#authorbox p{
color:#333; /* Author description text color */
margin:0;
padding:0px 5px 5px 5px;
font-size:14px;
line-height:150%;
}
/*author box style*/
#authorbox{
background: #fff; /*background color of the author box*/
border: 1px solid #ccc; /* border around the box */
width:100%;
overflow:hidden;
color: #333;
margin:15px 0 15px 0; /*space top and bottom of the box*/
padding-bottom:5px;
}
#authorbox h3{
font-size: 18px; /*font size of heading containing the author name*/
color:#333; /* color of the heading text */
margin:0 0 5px 0;
padding:5px 2px 5px 5px;
border-bottom: 1px solid #ccc;
}
#authorbox a{
color: #c87137; /* Link color */
text-decoration:none;
}
#authorbox img{
margin:0;
padding: 0 5px 0px 0px;
float:left;
}
#authorbox p{
color:#333; /* Author description text color */
margin:0;
padding:0px 5px 5px 5px;
font-size:14px;
line-height:150%;
}
> <div id="authorarea"> <?php echo get_avatar( > get_the_author_meta( 'user_email' ), 70 ); ?> <h3>About > <?php echo get_the_author(); ?></h3> <div > class="authorinfo"> <?php the_author_meta( 'description' ); > ?> <a class="author-link" href="<?php echo esc_url( > get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" > rel="author">View posts by <?php echo get_the_author(); ?> > <span class="meta-nav">&rarr;</span></a> > </div> </div><div id="authorarea"> <?php echo get_avatar(
get_the_author_meta( 'user_email' ), 70 ); ?> <h3>About
<?php echo get_the_author(); ?></h3> <div
class="authorinfo"> <?php the_author_meta( 'description' );
?> <a class="author-link" href="<?php echo esc_url(
get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>"
rel="author">View posts by <?php echo get_the_author(); ?>
<span class="meta-nav">→</span></a>
</div> </div>
#authorarea{
background: #f0f0f0;
border: 1px solid #d2d2d2;
padding: 10px;
width:500px;
overflow:hidden;
color: #333;
}
#authorarea h3{
font-size: 18px;
color:#333;
margin:0;
padding:10px 10px 5px 10px;
}
#authorarea h3 a{
text-decoration:none;
color: #333;
font-weight: bold;
}
#authorarea img{
margin:0;
padding:10px;
float:left;
border: 1px solid #ddd;
width: 100px;
height: 100px;
}
#authorarea p{
color:#333;
margin:0;
padding:0px 10px 10px 10px;
}
#authorarea p a{
color:#333;
}
.authorinfo{
padding-left:120px;
}
#authorarea{
background: #f0f0f0;
border: 1px solid #d2d2d2;
padding: 10px;
width:500px;
overflow:hidden;
color: #333;
}
#authorarea h3{
font-size: 18px;
color:#333;
margin:0;
padding:10px 10px 5px 10px;
}
#authorarea h3 a{
text-decoration:none;
color: #333;
font-weight: bold;
}
#authorarea img{
margin:0;
padding:10px;
float:left;
border: 1px solid #ddd;
width: 100px;
height: 100px;
}
#authorarea p{
color:#333;
margin:0;
padding:0px 10px 10px 10px;
}
#authorarea p a{
color:#333;
}
.authorinfo{
padding-left:120px;
}
First one will not work, it is ruined much. Can ruin your template if you use it.
If they want this be a support forum they really need to make "pre" and "code" dont change anything inside.
I use Crayon plugin for WordPress and works perfectly inside WP posts.
Take some part of code and search snippet in Google. Shame, very shame.
First one will not work, it is ruined much. Can ruin your template if you use it. If they want this be a support forum they really need to make "pre" and "code" dont change anything inside. I use Crayon plugin for WordPress and works perfectly inside WP posts. Take some part of code and search snippet in Google. Shame, very shame./Function to Add Author Box/
function add_author_box($content){
if( is_single() ) {
/Editable/
$img_ext = 'jpg'; //Replace this with png if you are using PNG images.
$img_size = 82; //Edit this value to change the author image size.
/Getting author info/
$auth_id = get_the_author_meta('ID'); //Get author ID.
$auth_name = get_the_author_meta('display_name'); // Get author name.
$auth_des = get_the_author_meta('description'); // Get author description.
$auth_page_url = get_author_posts_url($auth_id); //Get author Page URL.
$upload_dir = wp_upload_dir();
$uploads_folder_url = $upload_dir['url']; //uploads folder URL.
$uploads_folder_path = $upload_dir['path']; //uploads folder path.
$auth_avt = $uploads_folder_url.'/author'.$auth_id.'.'.$img_ext; //author image URL.
$auth_avt_path = $uploads_folder_path.'/author'.$auth_id.'.'.$img_ext; //author image path.
/Check if user uploaded avatar exists/
if(file_exists($auth_avt_path)){
$auth_img = '<img src="'. $auth_avt .'" width="'. $img_size .'" height="'. $img_size .'" >'; //If user uploaded avatar exists, use it in the display.
}else{$auth_img = get_avatar( $auth_id, $img_size ); //If user uploaded avatar does not exist use gavatar.
}
/Output/
$content .= "<div id='authorbox'><h3>Article by <a href='$auth_page_url'>$auth_name</a></h3> $auth_img $auth_des </div>";
}
return $content;
}
add_filter ( 'the_content', 'add_author_box', 0 );
If I paste code inside visual editor tab in TinyMce and open text tab, copy and paste here all is OK. But may not use pre and code button on forum here. It ruins everything.
If I paste code inside visual editor tab in TinyMce and open text tab, copy and paste here all is OK. But may not use pre and code button on forum here. It ruins everything.