[Resolved] Custom Author Box

Home Forums Support Custom Author Box

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1413405
    Ashin

    I’d like to use a custom author box on pages, not posts. The below codes work for posts. Could you please let me know what changes has to be made to make it appear on pages.

    The below code is added as Elements Hook with ‘Posts’ as location. I’d like to use ‘Pages’ as location, but when I do that nothing happens. It works perfectly on posts.

    <div class="author-box">
    	<div class="avatar">
    		<?php echo get_avatar( get_the_author_meta('user_email'), '96', '' ); ?>
    	</div>
    	<div class="author-info">
    		<h5 class="author-title" itemprop="author" itemscope itemtype="http://schema.org/Person">
    			<span itemprop="name"><?php printf( get_the_author_meta( 'display_name') );?></span>
    		</h5>
    		<div class="author-summary">
    			<p class="author-description"><?php echo wp_kses( get_the_author_meta( 'description' ), null ); ?></p></div>
    		<div class="author-links">
    			<a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ); ?>" title="Read more">...</a>
    		</div>
    	</div>
    </div> 
    

    And here is the CSS.

    .author-box {
    	padding: 3%;
    	padding-bottom: 10px;
    	margin-top: 60px;
    	font-size: 0.9em;
    	background-color: #fff;
    	display: -webkit-box;
    	display: -ms-flexbox;
    	display: flex;
    	-webkit-box-align: center;
    	-ms-flex-align: center;
    	align-items: center;
    	border-radius: 5px;
    	box-shadow: rgba(23, 43, 99, .14) 0 7px 28px !important;
    }
    .author-box .avatar {
    	width: 250px;
    	height: auto;
    	border-radius: 100%;
    	margin-right: 30px;
    }
    h5.author-title {
    	margin-bottom: 0.1em;
    	font-weight: 600;
    }
    .author-description {
    	line-height: 1.6em
    }
    .author-links a {
    	margin-top: -1.5em;
    	font-size: 2em;
    	line-height: 2em;
    	float: left;
    }
    @media (max-width: 768px) {
    	.author-box {
    		padding: 20px;
    		padding-bottom: 0px;
    		margin-top: 100px;
    		flex-direction: column;
    		text-align: center;
    	}
    	.author-box .avatar {
    		margin-right: 0;
    		margin-bottom: 10px;
    		width: 100%;
    		margin-top: -35px;
    	}
    	.author-box .avatar img {
    		max-width: 100px;
    	}
    	.author-links a {
    		float: none;
    		align-self: center;
    	}
    	.author-description {
    		margin-bottom: -1.1em;
    	}
    }

    What needs to be changed for these two codes to work on Pages, not Posts.

    #1413753
    David
    Staff
    Customer Support

    Hi there,

    which Hook are you using ?

    #1413907
    Ashin

    Appearance –> Elements — > Add New Element. On the popup, I choose ‘Hook’.

    #1413990
    Leo
    Staff
    Customer Support

    And what’s the name of the hook are you choosing in the hook drop down menu?

    #1414003
    Ashin

    generate_after_content

    #1414168
    Tom
    Lead Developer
    Lead Developer

    What about it isn’t working, exactly? Is anything showing up at all?

    #1414196
    Ashin

    None showing up. I’m using the same code in 3 other sites. It’s working on all. But in those, I’ve added it to the bottom of ‘Posts’. Now, I’d like to add this to the bottom of ‘Pages’.

    #1414733
    David
    Staff
    Customer Support

    Can you link us to a page where it is meant to be displayed

    #1414781
    Ashin

    I just tried the codes once again and it miraculously worked. Not sure what was wrong before.

    #1414791
    David
    Staff
    Customer Support

    Could have been Page Caching on your server.
    Glad to hear its resolved.

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.