Customize Author Box

Hi,

There is no option by default to modify the avatar size on the author box element
– https://demo.tagdiv.com/newspaper/author-box/
Try setting a custom size in the theme files here
– https://www.screencast.com/t/TXRlmwyL17Tm
Please note that this may provide unexpected results, and you revert to default if this is the case.
Font style and size could be changed with Css using the browser inspector as a guide.
Here is a tutorial about using the inspector to identify the elements on the page and their classes in order to create custom code
– https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
In the post page there are options in the theme panel to customize the author card
– https://forum.tagdiv.com/author-card/
– https://www.screencast.com/t/wniYgp1y
Please correct me if I misunderstood something.

Thanks

Hi,

For that there are no options in the theme panel. But you could use something like this to change the properties of the font, exactly like they are on the post page. Or customize it further by adding more properties to the code
– https://www.screencast.com/t/U6w394bK

.author .desc {
font-size: 20px;
}

Thanks

Hi,

For the link in the author box located in in the author page, you could use a code like this to modify the font size
– https://www.screencast.com/t/gjwOFtIbJh

.author .td-author-url {
font-size: 15px;
}

That is the Author box/Authors box element from the page editor. It is available to be used on pages, and as a widget in the sidebar
– https://www.screencast.com/t/nUhc8yFO02
– https://www.screencast.com/t/DcV7wg8gm

Thanks

Hi,

The author Id is created by WordPress. There are many ways of finding this Id
– http://www.wpbeginner.com/beginners-guide/how-to-find-post-category-tag-comments-or-user-id-in-wordpress/
– https://forum.tagdiv.com/topic/author-box-5/
Some elements can be customized with Css and offer the possibility to set a unique class to them. For example you have two block elements of the same type, with no particular way to differentiate them
– https://www.screencast.com/t/I3rLwdhnEH
By setting a custom class to one of them, you can customize it with Css without affecting the other one
– https://www.screencast.com/t/qdr5fkCP
– https://www.screencast.com/t/Wq1xJeAU
There are also many other situations in which this option may be helpful.
Here is a tutorial about uisng teh browser inspector to create custom code, that you can use in the theme panel
– https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Hi,

The description data is taken from the user profile field
– https://www.screencast.com/t/gnMbmXuRP6
It would have to be removed from there. Or you could enter this code in Theme panel->Custom Css
– https://www.screencast.com/t/sTRoZVJp
– https://www.screencast.com/t/yukAy4iyFY

.td_block_author
.td-author-description {
display: none;
}

Thanks

Hi,

In the post page you can customize the font properties in the theme panel here
– https://www.screencast.com/t/w8RhlrWJk
But for the author box displayed in the author page there is no specific option at the moment. The font properties will be inherited from the body general font set here
– https://www.screencast.com/t/soUCVUYDExYk

Thanks

Hi,

There is no option at the moment in the theme panel, to modify the font on that element.
Simple modifications can be made using some custom code.
You can follow this tutorial and use the browser inspector to identify the elements on the page and their classes, in order to create custom code
– https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Or you can specify what exactly you want to do, and I will help you.

Thanks

Hi,

A code like this will provide the result you want, even the font color (you can remove that if not needed)
– https://www.screencast.com/t/Kb1rNlDHBaEK

.td_block_author .td-author-description {
font-family: avenir-light;
font-size: 12pt;
line-height: 26px;
color: #222;
}

Thanks

Hi,
Please add this code in your theme panel-> custom css box.

.td_block_author .td-author-name{
text-transform:none;
}
.td_block_author a:hover{
color:#406e87;
}

Thanks.