I use Ghost 3.0.2
I would like to limit first page (index.hbs) to display only posts with some tags.
I tryed without luck:
{{#foreach posts}}
{{#has tag="es"}}
{{> post}}
{{/has}}
{{/foreach}}
Current code is:
<!-- start content area -->
<div class="main-content-area">
<div class="container post-listing">
{{> loop}}
</div>
</div>
Related
I am new to ghost and tried to include posts on a own page:slug.hbs template with the following code. The posts are shown but the gh-loadmore button is removed in the produced output. How can I use the load more function to display the rest of the posts on this page.
<main id="gh-main" class="gh-main gh-outer">
<div class="gh-inner">
<div class="gh-wrapper">
<section class="gh-section">
<div class="gh-feed">
{{#get "posts" filter="tags:mytag"}}
{{#foreach posts limit="8"}}
{{> loop}}
{{/foreach}}
{{/get}}
</div>
<button class="gh-loadmore gh-btn">Load more</button>
</section>
</div>
</div>
</main>
I'm trying to show pages on my homepage.
In my home.hbs I have
{{!-- The tag above means: insert everything in this file
into the {body} of the default.hbs template --}}
{{#is "home"}}
{{#if #site.description}}
<header class="page-head">
<h2 class="page-head-title">{{#site.description}}</h2>
</header>
{{/if}}
{{/is}}
{{#get "posts" filter="page:true"}}
{{#foreach posts}}
{{title}}
<p>{{excerpt words="33"}}</p>
{{/foreach}}
{{/get}}
Nothing is listed on my homepage. This works for posts but not pages for some reason.
I have the article featured, and it has "Category" tag - is it possible to display these on the homepage?
You're almost there, try this:
{{#is "home"}}
{{#if #site.description}}
<header class="page-head">
<h2 class="page-head-title">{{#site.description}}</h2>
</header>
{{/if}}
{{/is}}
{{#get "pages" limit="all"}}
{{#foreach pages}}
{{title}}
<p>{{excerpt words="33"}}</p>
{{/foreach}}
{{/get}}
Hope this helps :)
How can display featured posts at the top of the front page?
Followed by the remaining posts.
Currently they display at the top of each page of the pagination.
Here's my loop.hbs:
{{! Previous/next page links - only displayed on page 2+ }}
<div class="extra-pagination inner">
{{pagination}}
</div>
{{! This is the post loop - each post will be output using this markup }}
{{#foreach posts}}
{{#if featured}}
<article class="{{post_class}} featured">
<header class="post-header">
<h2 class="post-title">{{{title}}}</h2>
</header>
<section class="post-excerpt">
<p>{{excerpt words="26"}} <a class="read-more" href="{{url}}">»</a></p>
</section>
<footer class="post-meta">
{{#if author.image}}<img class="author-thumb" src="{{author.image}}" alt=" {{author.name}}" nopin="nopin" />{{/if}}
{{author}}
{{tags prefix="on"}}
<time class="post-date" datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMMM YYYY"}}</time>
</footer>
</article>
{{/if}}
{{/foreach}}
{{! This is the post loop - each post will be output using this markup }}
{{#foreach posts}}
{{#unless featured}}
<article class="{{post_class}}">
<header class="post-header">
<h2 class="post-title">{{{title}}}</h2>
</header>
<section class="post-excerpt">
<p>{{excerpt words="26"}} <a class="read-more" href="{{url}}">»</a></p>
</section>
<footer class="post-meta">
{{#if author.image}}<img class="author-thumb" src="{{author.image}}" alt=" {{author.name}}" nopin="nopin" />{{/if}}
{{author}}
{{tags prefix="on"}}
<time clas s="post-date" datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMMM YYYY"}}</time>
</footer>
</article>
{{/unless}}
{{/foreach}}
{{! Previous/next page links - displayed on every page }}
{{pagination}}
Here's my blog: http://netsca.pe/
The only featured post currently is How to Install Ghost on AWS | Amazon EC2 for free - the Complete Guide.
As you can see, it is displayed at the top of the third page of posts, as opposed to at the top of the front page.
I had a read of Stack Overflow: newest post with specific tag on the front page but still can't figure this out.
Also had a read through this: The Ghost Blogging Support Forum: Show Featured post first on index page
but still nowhere.
variations of {{get}} were not successful for me on the latest version of Ghost. What did work was:
<section id="main">
{{#foreach posts}}
{{#if featured}}
html for featured posts
{{/if}}
{{/foreach}}
<div>
{{#foreach posts}}
{{^if featured limit="2"}}
html for regular post loop
{{/if}}
{{/foreach}}
</div>
</section>
This displayed the featured posts on top while another separately styled loop of posts were displayed below.
Firstly credit to #subic from ghost.slack.com who kindly tested my theme and pointed me in the right direction.
After having a read of the lengthy discussion GitHub Ghost Issue: Query (get) helper #4439 recently closed, great news - helpers and filters are being added to Public API v1!
The {{#get}} helper #5619 has just been merged to master (still unstable), so the solution:
{{#get "posts" featured="true" as |featured|}}
{{#foreach featured}}
...
{{/foreach}}
{{/get}}
I have this main layout
<!-- Wrapper-->
<div id="wrapper">
{{#if currentUser }}
<!-- Page wrapper -->
{{> topNavbar }}
<!-- Navigation -->
{{> navigation }}
<!-- Page wraper -->
<div id="page-wrapper" class="gray-bg">
<!-- Main view -->
{{> yield}}
</div>
<!-- End page wrapper-->
<!--{{> rightSidebar }}-->
{{else}}
{{> loginPage }}
{{/if}}
</div>
<!-- End wrapper-->
With the obvious purpose of displaying the login page if users are not logged-in. An unintended effect is when users navigate between certain pages/routes it can occasionally show the loginpage for a half second or two.
I am sure there is a way to do this with subscriptions, but just haven't gotten their in Meteor yet... was wondering if one of the ninjas out there that will look at this and scoff can pass a quick hint.
Thanks!
I have seen How to get rid of Meteor template flickers but I am hoping that there is a way to solve this without routing -- can I add the code to the main templates javascript file?
The problem is, there are not two states of logged in and not. There is also the in between state where the client is logging in. To account for that, there is a {{loggingIn}} helper which you could use as:
<!-- Wrapper-->
<div id="wrapper">
{{#if currentUser }}
<!-- Page wrapper -->
{{> topNavbar }}
<!-- Navigation -->
{{> navigation }}
<!-- Page wraper -->
<div id="page-wrapper" class="gray-bg">
<!-- Main view -->
{{> yield}}
</div>
<!-- End page wrapper-->
<!--{{> rightSidebar }}-->
{{else}}
{{#if loggingIn}}
loading...
{{else}}
{{> loginPage }}
{{/if}}
{{/if}}
</div>
<!-- End wrapper-->
Also on an unrelated note, you can use
{{!-- Spacebars comments do not get into the DOM --}}
instead of
<!-- This still gets into the DOM, but not rendered by the browser -->
In my meteor.js application, some pages have side menu, some pages do not have. This is my layout.html
<template name="layout">
<div class="container">
{{> header}}
<div id="main" class="col-md-3">
{{> yield region="sidenavigation"}}
</div>
<div id="main" class="col-md-9">
{{> yield}}
</div>
</div>
</template>
Let's say I have x template which has side menu, and y template which does not have side menu. When I render x template, everything is good. But when I render y template, because it does not have side menu, the content is pushed to the right expectedly. How can I solve this? Thank you.
Use {{#contentFor region=''}} in the template or page that you want to show the side menu in
eg.
<template name="yourtemplatename">
{{#contentFor region="sidenavigation"}}
..
...
....
{{/contentFor}}
</template>
example https://github.com/EventedMind/meteor-building-an-application-with-meteor-and-iron-router