Do you want to learn how to create an author archive page in Elementor ?
do you have a website multi-author and do you want to give it a new design with Elementor ?
If so, then that's a great idea because Elementor allows anyone to be a web designer without needing to have CSS skills. About the website multi-author, one of the things you might want to rethink is the author archive page.
In this article, we will show you how to create a custom author archive page in WordPress usingElementor.
Read also: How to use global colors in Elementor
Elementor - as you may know - comes with a theme builder feature that lets you create custom parts of your theme, including the author archive page. The two key widgets you can use to build a custom author archive page with Elementor are:
- AuthorBox
- Posts Archives
The Author Box widget will load the profile of the current author. It will load the information according to the author meta-fields filled in (such as name, profile picture, biography, etc…). While the Archives Posts widget displays the posts written by the associated author.
Of course, in addition to the above two widgets, you can also add other widgets to your liking to make your custom author archive page stand out.
How to create a custom author archive page in WordPress using Elementor
Before you start, make sure you've upgraded your Elementor to the pro version in case you haven't since this theme builder feature is only available on Elementor Pro.
See also: How to use global fonts in Elementor
Once you're ready, log into your WordPress dashboard and navigate to Templates -> Theme Builder. You will be redirected to Elementor's theme builder page. Click on the Archive tab in the left panel, then on Add new in the upper right corner to create an archive template.
Elementor offers dozens of ready-made archive templates for you to choose from. Just select a model you like. If you want to create the archive template from scratch, you can just close the template library. In this example, we'll create the archive template from scratch. Close the template library.
In this example, we'll create a simple author archive page that consists of just two widgets. Again, you can add any element to your liking to make your personalized author archive page more appealing.
Read also : How to create a registration page in Elementor
Start by adding a new section by clicking the plus button in the canvas area.
Author Box Widget
Add the Author Box widget by dragging it from the left panel to the edit box.
Go to the left panel to customize the widget. In the option Source under the block AuthorInfo, leave it as default. To turn off / on some meta information (such as profile picture, display name, and bio) you can just drag the toggles.
From this block you can change the layout as well as the alignment of the author information.
Read also: How to export and import Elementor models
To style the widget, you can access the tab style. There are 3 parameter blocks you can open:
- image
You can open this block to set profile picture alignment, size, gap between profile picture and author bio, border radius and box shadow.
- text
You can open this block to define the typography of the author's name and biography. You can set things like font size, font family, font style, and text color. You can also set the gap between the author's name and the author's biography.
- Button
If you activate the archive button, you can open this block to customize it. You can set things like background color, button text color, border radius, and fill.
Archive Posts Widget
Add the Archive Posts widget by dragging it from the left panel to the edit box. Once added, you can go to the left panel to customize the widget. In the block layout under the tab Contents, you can define the skin, the number of columns, the position of the image, the size of the image, the aspect ratio, the length of the extract, etc ...
You can open the block Pagination to define the pagination and the block Advanced to define a custom message if the archive does not contain any contents.
To customize the Archive Posts widget, you can open the tab style. There are 5 parameter blocks that you can manipulate:
- layout
You can open this block to set the spacing between rows and columns. You can also set the alignment of the contents.
- Image
You can open this block to customize the image of the messages. You can set the border radius and the space between the image and the content. You can also apply a CSS filter if you want. You can apply the CSS filter for normal state and hover state.
- Content
You can open this block to set the typography of the post title, meta, snippet and more. You can also set the spacing between each element.
- Pagination
You can open this block to define the typography and the color of the pagination text. You can use different typography and text settings on three different states: normal, hover, and active. You can also set the space between paging numbers.
- Nothing Found Message
You can open this block to set the typography and color of the message text when the archive page is empty.
When you are done editing the template, click the button PUBLISH at the bottom of the left panel. You will then be prompted to define a display condition. Just click the button ADD CONDITION.
From the drop-down menu, select Author Archive. If you want the custom author archive template to be applied to all authors in your website, you can set All in the second drop-down menu.
Conversely, if you want the custom author archive template to be applied to a specific user, you can simply select your preferred author from the second drop-down menu.
You can add multiple display conditions in case you want the custom author archive template to be applied to two or more authors. Click on SAVE & CLOSE to apply the changes.
Here. You have successfully created the custom author archive page on your WordPress website using Elementor.
Get Elementor Pro Now!
Conclusion
Here is ! That's it for this article which shows you how to create an author archive page in Elementor. If you have any concerns on how to get there flet us know in the Comments.
However, you can also consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation or the one on Divi: the best WordPress theme of all time.
But meanwhile, share this article on your different social networks.
...
