@all: Author Box for ENFOLD – feel free to use my code modifications

Hi @all,

since many asked over the years in this forum about an Author Box for ENFOLD, I modified a free plugin by “phpbits”, so that it looks quite clean for this theme.
Since many of the “author box” plugins haven’t been updated for a long time or are just looking “old-fashioned” or have too much “bling-bling”, I decided to use this one:

https://wordpress.org/plugins/wp-author-box-lite/

I modified the CSS for this plugin, so that it looks clean and stylish for my ENFOLD site:

TAB 1:

TAB 2:

Plugin Settings: “show in posts –> below”
There’s also the option to change the color of borders, backgrounds and text directly in the plugin settings page!

Nevertheless, I modified the CSS and added new ones for a “cleaner look”. Feel free to use them for your own site.
I put these CSS in the custom.css file of ENFOLD, so that they are not lost in case of a plugin update!

/* WP Authorbox Lite 
===================================================================*/
#wpautbox-below {
	margin-bottom: 30px;
}
.wpautbox-socials {
    padding: 2px 10px;
}
body .a-tabs .wpautbox-socials {
    text-align: right;
}
body .a-tabs .a-tab-container {
    box-shadow: none;
}
.wpautbox-socials .wpautbox-icon {
	font-size: 12px;
}
.wpautbox-socials .wpautbox-icon:before {
    height: 20px;
    line-height: 20px;
    width: 20px;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-facebook {
    background: #808080 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-facebook:hover {
    background: #3b5998 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-twitter {
    background: #808080 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-twitter:hover {
    background: #00aced none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-instagram {
    background: #808080 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-instagram:hover {
    background: #3f729b none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-pinterest {
    background: #808080 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-pinterest:hover {
    background: #cb2027 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-rss {
    background: #808080 none repeat scroll 0 0;
}
.wpautbox-socials.wpautbox-socials-colored .wpautbox-icon.wpautbox-icon-rss:hover {
    background: #ff8300 none repeat scroll 0 0;
}
#wpautbox_about {
	margin-top: 6px;
}
.a-tabs #wpautbox_about h4.wpautbox-name {
    font-family: Oswald;
    letter-spacing: 1px;
    margin: 0 0 15px;
    text-transform: uppercase;
}
.wpautbox-author-meta {
	padding-left: 140px;
}
.el-icon-user:before, .el-user:before,
.el-icon-list:before, .el-list:before 
{
    padding-right: 5px;
}
ul.wpautbox-post_type-list.wpautbox-latest-post li {
	list-style-type: none;
	margin-left: 0;
}
ul.wpautbox-post_type-list.wpautbox-latest-post li:before {
    content: "\f054";
	font-size: 16px;
    font-family: FontAwesome;
    color: #dbc37a;
    padding-right: 8px;
}
ul.wpautbox-post_type-list.wpautbox-latest-post {
	margin-left: 0;
	margin-bottom: 0;
}
.wpautbox-avatar .avatar {
	height: auto;
	width: auto;
}
/* hide date 
body #wpautbox_latest-post .wpautbox-date { display:none; }
*/

—————————
@Mods: hope it is okay to post this here. I’m NOT the plugin author, I just modified the CSS for the use with my ENFOLD. But perhaps some day Kriesi creates a better one for our beloved ENFOLD ;-)

• This topic was modified 8 years, 8 months ago by BeeCee. Reason: updated CSS