Author Box

The Author Box Widget in JupiterX is an excellent tool for bloggers who want to display an author's profile information within single blog posts. It adds a personal touch and allows readers to connect with the author. Here's how you can effortlessly integrate this feature into your blog template using the JupiterX theme and Elementor Page Builder.

View Live Demo

Content Tab

Author Info

  • Author Avatar: Toggle 'Show' to display the author's avatar or 'Hide' to not display it.
  • Display Name: Toggle 'Show' to display the author's name or 'Hide' to not display it.
  • HTML Tag: Select the HTML tag that you want to use for the author's name. Common options are H1 through H6, div, span, and p.
  • Link: Choose if you want the author's name and image to link to a specific destination. Options typically include 'None', 'Author Archive', and potentially other custom links.
    • Link for the Author Name and Image: Specify the URL or page to which the author's name and image will link if 'Link' is set to a custom option.
  • Biography: Toggle 'Show' to include the author's biography text or 'Hide' to exclude it.
  • Archive Button: Toggle between 'Show' and 'Hide' to display or hide a button that links to an archive of the author's posts.
    • Archive Text: If the Archive Button is shown, this field allows you to customize the text displayed on the button. For example, 'All Posts'.
  • Layout: Select the type of layout and its direction.
  • Alignment: Select the alignment of the content inside the box.

Style Tab

Image

  • Vertical Align: Adjust the vertical alignment of the author avatar within the author box.
  • Image Size: Set the size of the author avatar. You can use the slider or input a specific value in pixels.
  • Gap: Configure the space between the author avatar and the adjacent text. You can use the slider or input a specific value in pixels.
  • Border: Toggle 'Yes' to add a border around the avatar or 'No' to have no border.
  • Border Radius: Use the slider to round the corners of the author avatar. A higher value will create a more rounded appearance.
  • Box Shadow: Click the icon to add or configure a shadow around the author avatar.

Text

  • Name
    • Color: Choose the color of the author's name.
    • Typography: Click on the pencil icon to adjust the typography settings of the author's name.
    • Gap: Adjust the space between the author's name and the biography text.
  • Biography
    • Color: Select the color for the author's biography text.
    • Typography: Click on the pencil icon to customize the typography settings of the author's biography.
    • Gap: Configure the space between the biography text and the archive button, if present.

Button

  • Text Color: Set the color of the text on the archive button. You can define different colors for the Normal and Hover states.
  • Background Color: Choose the background color of the archive button for both Normal and Hover states.
  • Typography: Click the pencil icon to customize the typography of the archive button text.
  • Border Width: Use the slider to set the width of the border around the archive button.
  • Border Radius: Adjust the border radius to control the roundness of the archive button's corners.
  • Padding: Set the padding inside the archive button to control the spacing between the text and the border. You can link these values to have uniform padding or adjust each side individually.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.