0

I have a view called blog_posts, which selects the following fields: title (linking to node), Picture (an image field), Body and Authored on.

I have created a custom fields template views-view-fields--blog-posts.html.twig, which displays each node. Here is the content:

        <!-- blog post -->
        <div class="col col-md-4 col-sm-12 col-xs-12">
            <div class="card blog">
                <!-- Blog image here -->
                <img class="img-responsive" src="{{ file_url(fields.field_picture.0.entity.uri.value) }}">
                <div class="blog-content">
                    <!-- Edit title and info here -->
                    <div class="blog-title">
                        <h6 class="text-capitalize">{{ fields.title.content }}</h6>
                        <ul>
                            <li><i class="ion-calendar"></i>{{ fields.authored_on.content }}</li>
                        </ul>
                        <!-- Add link of full post -->
                        <a href="" class="btn-floating waves-effect waves-light btn-large more-btn custom-btn"
                           data-aos="zoom-in" data-aos-delay="200">
                            <i class="ion-android-more-horizontal"></i></a>
                    </div>
                    <!-- some line of post -->
                    <div class="text-left">
                        {{ fields.body.content }}
                    </div>
                </div>
            </div>
        </div>

Currently it is correctly displaying the title and the body.

The picture field is not displaying. I adapted {{ file_url(fields.field_picture.0.entity.uri.value) }} from a node template where it is displaying a picture correctly. Ho{{ file_url(fields.field_picture.0.entity.uri.value) }}w can I make it work in a view template?

The authored on field, {{ fields.authored_on.content }} should display the posted date of the node.

Finally, I would like to put the URL of the node in the link. Is it possible to get this from the data I have, or do I need to add a field for it?

Thanks for your help,

James

6
  • Views is powerful if you configure it from UI and if you need twig, then put it in the UI as well. To theme a node, switch the View to display content and use a node template.
    – 4uk4
    Oct 2, 2017 at 8:08
  • Sounds like a good idea. Can I set up a node template just for the view? If so, how do I name it? I don't see anything about node templates for views in the docs, just fields. Oct 2, 2017 at 19:25
  • You click on "Show: Fields", change it to "Show: Content". Then you can use a custom view mode, which you style in its own node template node--custom-view-mode.html.twig.
    – 4uk4
    Oct 2, 2017 at 20:09
  • Thanks. So if I have a view called blog_posts, and I want to display it in a block, the template will be called node--blog-posts-block.html.twig? Oct 3, 2017 at 9:37
  • Yes, you can use a lot of different node template names. But what I meant in the last comment was to add a Display mode (view mode) for this, then you can configure the fields in the UI of the content type and you can add the machine name of the view mode to the node template name node--custom-view-mode.html.twig.
    – 4uk4
    Oct 3, 2017 at 9:52

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.