I created a basic page with a NID of 176. My basic page content type contains a field called field_banner_image.
In my templates directory I created a file called page--node--176.html.twig and the template works.
I saw a few threads where you can access the node content via {{ content.field_name }}, however, my content appears to NULL every time.
I managed to output the URL of my image field via:
{{ file_url(node.field_banner_image.entity.uri.value) }}
I feel like there has to be an easier/better way of doing this. Any suggestions? Why is content null in my twig templates?
If your template is named page--node--176.html.twig, it is actually a page template overriding the base page template page.html.twig, so you will have access to all page variables but not those in your node.
Although your node type is called "page", it is still a node, and the template for it would be node--176.html.twig which overrides node.html.twig.
In your node--***.html.twig you will have access to the content variable. Let me know if you need help.
Related
Using the Ghost blog routes.yaml file it is possible to use the collections block to create a custom collection made from some tag(s) and / or other data. You can also tell this collection to use a custom theme template see:
https://docs.ghost.org/tutorials/creating-content-collections/
https://docs.ghost.org/concepts/routing/#content-structure
For instance:
collections:
/example/:
permalink: /example/{slug}/
controller: channel
filter: tag:example-tag
template:
- example
All of the above works and my collection properly uses my new example theme file.
The issue is that unlike the tag page (for example-tag) my new custom collection does not have a readily documented way to work with the title etc.
It does not pull the title / meta description from the tag used to build the collection (which would be great for collections built from single tags). In an attempt to work around that I tried some {{#has}} statements but I can't figure out what context the custom route would fit into.
With the above example routes.yaml the title for the custom collection ends up as 'My Site Name (Page 1)' — and there is no Meta Description.
This issue also extends into the Open Graph data which lists an identical title as well as no description for the custom collection.
My guess is that it may be possible to use a data property attached to the routes.yaml file to achieve this (see: https://docs.ghost.org/concepts/routing/#data) but I haven't found a solution as of now.
While my initial attempts at googling for a solution came up empty, this is the best reference I have seen to the issue:
https://forum.ghost.org/t/dynamic-routing-page-post-data-context-in-default-hbs-nested-navigation-on-custom-collections/4204
https://github.com/TryGhost/Ghost/issues/10082
I found a way to work around.
You create a page called example in the Ghost Admin tool.
Customize routes (instead of collections) in the routes.yaml as following:
routes:
/example/:
controller: channel
filter: tag:example-tag
template: example
data: page.example
The page.example will use the metadata of this page in the Ghost.
This is possible only with workaround described in issue: https://github.com/TryGhost/Ghost/issues/10082
Generally do following:
create page Example (with slug example) and fill metadata title & description you want
in routes.yaml alter your collection definition /example/ add following:data: page.example to link your collection root with specified page
now in your template definition example.hbs you could use e.g. {{#page}} {{content}} {{/page}} tag to insert content from your page. You can do it also in default.hbs template which is included from your example.hbs. So replace: <title>{{meta_title}}</title> in default.hbs with following:
{{#unless page}}
<title>{{meta_title}}</title>
{{else}}
{{#page}}
<title>{{meta_title}}</title>
<meta name="description" content="{{meta_description}}"/>
{{/page}}
{{/unless}}
This will set specific title/description for your collection root pages in general way. It is possible to generate schema.org metadata in the similar way. Unfortunately Facebook and Twitter metadata is not so simple to do because, {{ghost_head}} tag in default.hbs already inserts site metadata to this page. Last note: besides {{meta_title}} and {{meta_description}} I suppose you could use all metadata fields defined here.
In default.hbs I added the following block:
{{{ block "metaTitle"}}}
and eg. in post.hbs I filled that block as follows:
{{!< default}}
<div class="content-area">
<main class="site-main">
{{#post}}
{{#contentFor "metaTitle"}}
<title>{{title}}</title>
{{/contentFor}}
...
For other pages like page.hbs, blog.hbs, author.hbs I did the same. I think that solution is more flexible because we have more control over title value.
So I'm just getting started with Drupal and Drupal 8 and have a hard time understanding accessing twig content. Ideally what I would like to do is require some fields using the structured content.
When a type of structured content is used I would like to load a specific twig template and access the fields by machine readable name. This will allow me to setup template types with specific requirements for content.
I'm struggling with 2 parts and maybe what I want to do isn't possible in drupal. The first part how do I assign a page template based on structured content type?
The second issue is how do print out specific fields. I'm able to print all fields using {{page.content}} but {{page.content.field_name}} prints nothing. I'm very confused how to proceed forward. I know I can use modules and assign them to sections but for structured data types this won't allow for rigid enforcement of data collection like structured content. Some of this content flows outside a single content area so I'd really like to do it in a main layout file.
Thoughts?
For defining page template based on content type:
You can have:
page--front.html.twig - For front page
page--user.html.twig - For user page
page--youtube_videos.html.twig - For content type (here it is: youtube_videos)
For print content fields, you need to goto node.html.twig
For image field: {{ content.field_image }}
For title: {{ label }}
Tag field: {{ content.field_tags }}
I'm currently working on a BigCommerce theme using their Stencil framework. It leverages Handlebars.js for some logic already and I'm trying to use it to show specific html on specific pages.
Looking at the documentation I can see there is a "pages" object and that I should be able to name or URL to do what I need to do.
I cannot figure out the syntax to get the page name or url to run the iff against. I can succesfully get it to do what I want by testing if it's a page content type, but not any of the type properties.
{{#if pages }}
... do foo here
{{/if}}
What I want to do is something like
{{#if pages.url '===' 'about' }}
... do foo here
{{/if}}
{{#if pages.url '===' 'service' }}
... do foo different here
{{/if}}
It looks like you are actually using the wrong Object Model for the data that you are trying to pull. The first word of your handlebars object should be "page" and not "pages". This will pull any content or data from the static pages that you build in the back office. (AKA the WYSIWYG)
Here is a link to the docs of the model that you want. https://stencil.bigcommerce.com/docs/page-content-object
For Example:
{{{page.title}}}
{{{page.content}}}
Note that I am using 3 handlebar on each side to escape the HTML on the WYSIWYG. Let me know if you need any other help.
I'm using SonataBlockBundle in my current project.
I create a SimpleBlock and render it in my twig template with something like
{{ sonata_block_render('name' : 'myBlock') }}.
But the block consists of title and body, is there a way to render title and body separately, like I can do with form fields?
Thank you in anticipation!
The best way to go there would be to create a custom BlockService (see http://sonata-project.org/bundles/block/master/doc/reference/your_first_block.html for instructions about that), with a custom twig template where you will be able to specify your title/body rendering.
If I have a page named 'events' (of which the specialized template will be named 'page-events.php'), is there any way to have a specialized template of a subpage 'events/event-sub-page'?
I can't seem to find how to do it in the documentation here: codex.wordpress.org/Page_Templates.
You would just create a new template called events-subpage.php and build it accordingly. Then when making your page in wordpress, select the template events-subpage.
You can just create the "event-sub-page" page in WordPress, set its parent to the "events" page, and make your custom template file "page-event-sub-page.php" (no need to specify the "events" part in the actual php filename)
Or in my case I wanted "../login" for a specialized login form and "../login/recovery" for password recovery. The template page is simply "page-recovery.php"