In this article you can learn:
This article describes how to use Simple Author Box to display author information on a post. The instructions will guide you through how to install and set up Simple Author Box for WordPress Hosting.
How to Install Simple Author Box
Installing Simple Author Box is as simple as any other plugin. You can do this from the WordPress administrative dashboard. Follow the steps below to learn how:
- Log into your WordPress administrative dashboard.
- Navigate to Plugins > Add New.
- Begin typing simple author box into the Search plugins… field.
- Click on the Install Now button next to Simple Author Box by MachoThemes.
NOTICE: The button text changes with the status of the installation. The installation is complete once Activate displays inside the button.
- Click on Activate.
Now you know how to install the plugin. Read on to learn more about how to set it up.
How to Set Up Simple Author Box
The Simple Author Box plugin allows you to configure a few settings. It also adds custom fields to your WordPress user’s profile. These settings and details are used in combination to render how the author box will appear on the post. The next two sections will explain more about the settings and how to add author details.
Settings
- Log into your WordPress administrative dashboard.
- Navigate to Simple Author.
NOTE: You can refer to the table below for more information on each setting available to configure.
Option | Description | Recommended Configuration |
---|---|---|
Manually insert the Simple Author Box | Enable this toggle if you want to manually add Simple Author Box via shortcode or PHP function. | Off |
Hide the author box if author description is empty | Enable this toggle to hide the author box for users that do not have an author description. | On |
Show author email | Enable this toggle to display an email link next to the social icons. | Off |
Open social icon links in a new tab | Enable this toggle to force social media links to open in a new tab. | On |
Hide the social icons on author box | Enable this toggle to remove the social icons from the author box. | Off |
Hide the author box on archives | Enable this toggle to remove the author box from archived posts. | On |
Option | Description | Recommended Configuration |
---|---|---|
Top margin of author box | Adjust the slider to define how much space should be added to the top margin. | Default |
Bottom margin of author box | Adjust the slider to define how much space should be added to the bottom margin. | Default |
Padding top and bottom of author box | Adjust the slider to define how much space should be added to the top and bottom padding. | Default |
Padding left and right of author box | Adjust the slider to define how much space should be added to the left and right padding. | Default |
Border Width | Adjust the slider to define how wide the borders should be. | Default |
Author avatar image style | Select an option from the drop-down to choose either a square or circle avatar image. | Circle |
*Rotate effect on author avatar hover | Enable this toggle to add an effect that rotates the avatar upon hoving over it. NOTE: This setting only appears if you select Circle for the Author avatar image style setting. | Off |
Show author website | Enable this toggle to display a link to the author’s website. | Off |
*Open author website link in a new tab | Enable this toggle to force author website links to open in a new tab. NOTE: This setting only appears if you turn On the Show author website setting. | On |
*Add “nofollow” attribute on author website link | Enable this toggle to have the nofollow attribute added to the link (<a>) tag. NOTE: This setting only appears if you turn On the Show author website setting. | On |
*Author website position | Select an option from the drop-down to display the author website link to the left or right. NOTE: This setting only appears if you turn On the Show author website setting. | Right |
Social icons type | Select an option from the drop-down to choose either black and white symbols or add a colored background for the social media icons. | Colored |
*Social icons style | Select an option from the drop-down to choose the shape of the social media icons. NOTE: This setting only appears if you select Colored for the Social icons type setting. | Circle |
*Rotate effect on social icons hover (works only for circle icons) | Enable this toggle to add a rotate effect to the circle social icons upon hovering over it. NOTE: This setting only appears if you select Colored for the Social icons type setting. | Off |
*Use flat long shadow effect | Enable this toggle to display a shadow effect inside of the social icons. NOTE: This setting only appears if you select Colored for the Social icons type setting. | On |
*Show a thin border on colored social icons | Enable this toggle to show a border around the colored social icons. NOTE: This setting only appears if you select Colored for the Social icons type setting. | Off |
Option | Description |
---|---|
Author name color | Select a color for the author name text. |
Border color | Select a color for the border of the author box. |
Background color of social icons bar | Select a color for the background of the social media icon (bottom) section. |
Background color of author box | Select a color for the background of the author box (top) section. |
Color of author box paragraphs | Select a color for the author box text. |
Color of author box links | Select a color for links in the author box section. |
Social icons color (for symbols only) | When using symbols for social icons, select the color for them. |
Option | Description |
---|---|
Google font characters subset | Select a subset if you require additional characters. |
Author name font family | Select a font from the drop-down menu for the author name text. |
Author description font family | Select a font from the drop-down menu for the author description text. |
Author name font size | Adjust the slider to select a size for the author name font. |
Author description font size | Adjust the slider to select a size for the author description font. |
Size of social icons | Adjust the slider to select a size for the social icons. |
Author description font style | Select an option from the drop-down menu for the author description style of font. |
Option | Description |
---|---|
Load generated inline style to footer | Enable this toggle if you are using a plugin that utilizes the footer to load styles (for optimization). |
Author Information
In the settings section, you can see a preview of how the author box will appear. However, in order to customize the details for the author, you will need to modify the user’s profile. When you navigate to that screen you will notice some new fields that have been added. Use these new fields to add the details that will be displayed in the author box. Follow the steps below to learn how to modify the details of an author.
- Log into your WordPress administrative dashboard.
- Navigate to Users > Your Profile.
NOTE: You can edit another user by navigating to Users > All Users. Then, click on the user you would like to edit.
- Scroll down to the About Yourself section. In the Biographical Info field, enter the information you would like to display in your author box.
- Scroll down to the Custom User Profile Image (Simple Author Box) section. Click on the Upload Image button. Select or upload an image to use as your profile image, then click the Update button to use the photo you selected/uploaded.
- In the Social Media Links (Simple Author Box) select a social media platform from the drop-down menu and then enter the full URL to your profile page.
NOTICE: You can add more social media icons by clicking on the + Add new social platform button. Another field will be added so you can enter the information for. To remove a social media icon, click on the red trashcan icon to the right of the field you want to delete.
- Finally, be sure to click on Update Profile to save your changes.
Congratulations, now you know how to modify author details to display in the author box on posts. Learn more ways to customize WordPress in our WordPress Education Channel.