How to create a Node Info Bar (or Node Info Block)?

Question

I want to create a teaser with 3 sections:

1. Title Section.

2. Information Section (Info Bar):

   1. When this Node Writed? (Date & Time).
   2. Whom is writed this Node: (Author of Node).
   3. What category consist this: (taxonamy or category).
   4. How Many Viewed (Node View Statistics).
   5. How many add Comment (Comment Statistics).

3. Show only "Read more" Linke: at the bottom of a node teaser and remove or unset other links like the "Add New Comment", "2 New Comments", "2 Comments" at the end of a node teaser, because I dont think it makes good sense for people to comment on something that they haven't read yet.

I want to achieve something like the following picture:

Answer 1

Okey, you wanted a parallel full stack solution, here it is:

You create a new content type:

You should hide the "view count" field from the form display:

Here is the display for teaser:

You need to do some node preprocess in your custom theme (test.theme):

function test_preprocess_node(&$variables) {
  if ($variables['node']->bundle() == 'my_bounty_content' && $variables['teaser']) {
    _test_preprocess_my_content_teaser($variables);
  }
}

function _test_preprocess_my_content_teaser(&$variables) {
  $variables['content']['field_category'] = $variables['elements']['field_category']['0']['#title'];
  $variables['content']['field_view_count'] = $variables['elements']['field_view_count']['0']['#markup'];
  $comment_count = $variables['node']->get('field_comments')->comment_count;
  $variables['content']['comments_count'] = $comment_count ? $comment_count : 0;
}

You also need the functionality to increase the node view stats by each visit. Put this code into your custom module '.module' file:

/**
 * Implements hook_entity_view().
 */
function base_entity_view(array &$build, \Drupal\Core\Entity\EntityInterface $entity, \Drupal\Core\Entity\Display\EntityViewDisplayInterface $display, $view_mode) {
  if ($entity->getEntityTypeId() == 'node' && $entity->bundle() == 'my_bounty_content' && $view_mode == 'full') {
    $view_count = (int) $entity->get('field_view_count')->getString();
    $entity->set('field_view_count', ++$view_count);
    $entity->save();
  }
}

And finally create a new template file for your content teaser in your custom theme directory under 'templates' directory:

node--my-bounty-content--teaser.html.twig

<article>
    <h2>
        {{ label }}
    </h2>
    <ul class="meta">
        <li>{{ author_name }}</li>
        <li>{{ date }}</li>
        <li>{{ content.field_category }}</li>
        <li>Viewed: {{ content.field_view_count }}</li>
        <li>Comments: {{ content.comments_count }}</li>
    </ul>
    <div>{{ content.body }}</div>
    <a href="{{ url }}">{{ 'Read more'|trans  }}</a>

</article>

After this, you only need to list your nodes with teaser view. STILL the views module is the best solution for this, I didn't wrote custom code for this. If you need, let me know I will both post hardcore, and views example for that.

Adding custom theme, library, css is NOT included here.

Remember to clear cache between testing new hooks, templates and so on.

Answer 2

Views module covers pretty much everything you want. You only have have to solve "node views count" somehow (extra field, hidden from display).