Homepage
Main navigation
Main content
Additional information
October Tricks
Login / Sign up
Quality Guidelines
About
GitHub
Propose new content
October CMS resources and help articles
Simple and to the point. Optimized by the community.
×
Login / Sign up
Quality Guidelines
About
GitHub
Propose new content
Edit trick
Changes will be published after manual review
Title
Give your trick a describing title. Do
not
start with «How to...».
Your trick
Keep it short and concise! Markdown is supported.
<h3>How to display post author on your blog post page</h3> <p> At some point you probably needed to create some kind of widget with post author data like it's displayed on other blogging platforms such as Medium or as usually seen on many Wordpress blogs. </p> <p> Dive in to learn how to exactly get user data from post and display them on your CMS page </p> <hr> <img src=""> <p>Let's assume that you have some experience working with OctoberCMS and you already have CMS page with blog post component in place. </p> <p> If you haven't worked with RainLab.Blog plugin before, please go ahead and read the <a href="https://octobercms.com/plugin/rainlab-blog" target="_blank">official documentation</a>. </p> <h4> Post page </h4> <p> We are using bootstrap as css framework which won't be a problem teaching you how to display user data but your design might be different so keep that in mind. </p> <p>Basic display of post data</p> ~~~~~~~~~~~~~~~~~~~~~ <section id="single-post"> <div class="container"> <div class="single-row row"> <div class="single-col-1 col-xl-7 col-lg-7 col-md-8 col-sm-12 col-10"> <!-- POST TITLE --> <h1 class="post-title"> {{ post.title }} </h1> <hr class="post-title-separator"> <!-- POST PUBLISH DATE --> <p class="post-date">{{ post.published_at | strftime('%d.%m.%Y')}}</p> </div> <!-- POST CONTENT --> <div class="single-col-2 col-xl-7 col-lg-8 col-md-10 col-sm-10 col-10"> {{ post.content_html|raw }} </div> </div> </div> </section> ~~~~~~~~~~~~~~~~~~~~~ <p> As you can see from the code above it's simple and we get to show basic post data such as title, published at date, and post content. If you are having issues with date format try installing twig extension plugin. </p> <p> Now, let's say you want to display name, and avatar of the post author. If you tried working with OctoberCMS and Blog plugin it's really simple. All you need to do is access user property inside post model. </p> ~~~~~~~~~~~~~~~~~~~~~ <section id="single-post"> <div class="container"> <div class="single-row row"> <div class="single-col-1 col-xl-7 col-lg-7 col-md-8 col-sm-12 col-10"> <!-- POST TITLE --> <h1 class="post-title"> {{ post.title }} </h1> <hr class="post-title-separator"> <!-- AUTHOR DATA --> <img style="border-radius: 40px;display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px;" src="{{ post.user.avatar.path }}" height="80px;"/> <p class="post-date">By: style="color: #ef0d33"> {{ post.user.first_name }} {{ post.user.last_name }} </a> </p> <!-- POST PUBLISH DATE --> <p class="post-date">{{ post.published_at | strftime('%d.%m.%Y')}}</p> </div> <!-- POST CONTENT --> <div class="single-col-2 col-xl-7 col-lg-8 col-md-10 col-sm-10 col-10"> {{ post.content_html|raw }} </div> </div> </div> </section> ~~~~~~~~~~~~~~~~~~~~~ <p> If you are curious what is inside User model you can use code section on CMS page to find out. It's best to use onEnd function as that's when page and components are loaded fully. For example: </p> ~~~~~~~~~~~~~~~~~~~~~ function onEnd(){ dd($this->post->user->attributes); // This will give you user data } ~~~~~~~~~~~~~~~~~~~~~ <p> Hope this helps you understand how RainLab.Blog Post component works </p>
References
Add additional online resources to your trick
×
Name
URL
×
Name
URL
+ Add reference
Topics
If your trick fits more than one topic select multiple. Select at least one.
Backend
Plugin Development
CMS
Twig
Themes
Deployment
Tags
You can use existing tags or create new ones. Add at least one.
Submit for review
Cancel
We use cookies to measure the performance of this website. Do you want to accept these cookies?
Accept
Decline