Trying to get ‘our solutions’ fully listed on the homepage.
I have added a new page called outdoor led screens - this shows on the actual our solutions page, but not on the homepage along with the other options.
I have attached what it looks like in the resources section, what would i need to add or change in order to get all options i create new pages for to appear here?
thanks
I could be wrong, but this doesn’t look like the right part of the code to me.
Are you sure that your home page uses this template? (When you select your home page in the manager, does the dropdown “Uses Template” show this exact template?)
Your home page seems to use the template with the ID 8 (= “Homepage”).
But the screenshot in your first post was from the template with the ID 2 (= “Homepage - Scroll Section”).
So what is the content of the “Homepage” template?
ah that makes sense! found the one that matches up.
it was under base template.
this is the code for the page.
[[$Top]]
<main class="base" data-barba="container" data-barba-namespace="base">
<section class="padded-section px-0">
[[*banner-video:is=``:then=`
[[*banner-image:is=``:then=``:else=`
<div class="padded-section py-0 restrict-width">
<div class="banner bg-dark sixteen-nine" data-aos="subtle-fade-up" data-aos-delay="300">
<img class="banner-bg lazy" src="[[*banner-image:pthumb=`w=200&q=10`]]" data-src="[[*banner-image:pthumb=`w=1600`]]" alt="[[*longtitle:default=`[[*pagetitle]]`]] banner">
<div class="banner-content">
<h1 class="banner-title">[[*longtitle:default=`[[*pagetitle]]`]]<span class="color-blue">.</span></h1>
</div>
</div>
</div>
`]]
`:else=`
<div class="padded-section py-0 restrict-width">
<div class="banner bg-dark sixteen-nine" data-aos="subtle-fade-up" data-aos-delay="300">
<video class="banner-bg no-plyr" src="[[*banner-video]]" autoplay loop muted playsinline></video>
<div class="banner-content">
<h1 class="banner-title">[[*longtitle:default=`[[*pagetitle]]`]]<span class="color-blue">.</span></h1>
</div>
</div>
</div>
`]]
<section class="restrict-width-smaller">
<div class="padded-section pb-0 [[*banner-video:is=``:then=`[[*banner-image:is=``:then=` pt-0`:else=``]]`]]" data-aos="subtle-fade-up" data-aos-delay="500">
[[*banner-video:is=``:then=`
[[*banner-image:is=``:then=`
<h1 class="mt-0">[[*longtitle:default=`[[*pagetitle]]`]]<span class="color-blue">.<span></h1>
`:else=``]]
`]]
[[*content]]
</div>
</section>
</section>
[[getImageList?
&tvname=`content-sections`
&tpl=`content-section.tpl`
]]
[[*image-banner-image:notempty=`
<section class="padded-section image-section bg-image lazy" data-bg="url('[[*image-banner-image:pthumb=`w=1800`]]')">
<div class="restrict-width-smaller">
<div class="padded-section px-0 image-section-content">
<h2 class="mt-0">[[*image-banner-title]]<span class="color-blue">.</span></h2>
<a href="[[*image-banner-link]]" class="btn btn-blue btn-xl">[[*image-banner-btn-title]]</a>
</div>
</div>
</section>
`]]
</main>
[[$Bottom]]
Are you sure? I still think that this doesn’t match the HTML markup of your home page.
Is this the “Template Code (HTML)” of the template with ID = 8 (name = “Homepage”)?
ah ok this is ID=8
[[$Top]]
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-644247426"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-644247426');
</script>
<main class="home" data-barba="container" data-barba-namespace="home">
<div class="sixteen-nine">
<div class="internal">
<video src="[[*banner-video]]" class="no-plyr banner-bg" autoplay loop muted playsinline></video>
</div>
</div>
<section class="padded-section">
<div class="restrict-width">
<h2 class="m-0 text-align-center">[[#3.pagetitle]]<span class="color-blue">.</span></h2>
<div class="padded-section pb-0" data-aos="subtle-fade-up" data-aos-delay="500">
<div class="children-grid">
[[pdoResources?
&parents=`3`
&tpl=`children-grid-item.tpl`
&includeTVs=`banner-image`
&sortby=`{"menuindex":"ASC"}`
]]
</div>
</div>
</div>
</section>
<section class="padded-section position-relative image-section bg-image lazy" data-bg="url('[[pthumb? &input=`assets/img/img-20241206-1035434522.jpg` &options=`w=1800`]]')">
<div class="restrict-width-smaller position-relative">
<div class="testimonial-slider-container">
<div class="testimonial-slider">
[[getImageList?
&docid=`4`
&tvname=`testimonials`
&tpl=`testimonial-slider.tpl`
]]
</div>
<!--
<div class="testimonial-slider-control-container">
<button class="testimonial-slider-control prev"><i class="fa-solid fa-angle-left"></i></button>
<button class="testimonial-slider-control next"><i class="fa-solid fa-angle-right"></i></button>
</div>
-->
</div>
</div>
</section>
<section class="bg-white color-dark padded-section position-relative">
<div class="restrict-width">
<h2 class="m-0 text-align-center" data-aos="subtle-fade-up" data-aos-delay="300">A selection of our clients<span class="color-blue">.</span></h3>
<div class="padded-section pb-0 px-0">
<div class="client-grid" data-aos="subtle-fade-up" data-aos-delay="300">
[[getImageList?
&docid=`4`
&tvname=`clients`
&tpl=`client-grid-item.tpl`
]]
</div>
</div>
</div>
</section>
[[*image-banner-image:notempty=`
<section class="padded-section position-relative image-section bg-image lazy" data-bg="url('[[*image-banner-image:pthumb=`w=1800`]]')">
<div class="restrict-width-smaller">
<div class="padded-section px-0 image-section-content">
<h2 class="mt-0">[[*image-banner-title]]<span class="color-blue">.</span></h2>
<a href="[[*image-banner-link]]" class="btn btn-blue btn-xl">[[*image-banner-btn-title]]</a>
</div>
</div>
</section>
`]]
<script type="text/javascript" src="https://smartarget.online/loader.js?u=7918f1c96f033ebc494bc960dfb456fb84cde695"></script>
</main>
[[$Bottom]]
Hey @jgou a little tip: wrap your code blocks in 3 backticks and after the first backtick set, you can also include the programming language. a) you’ll get better syntax hightlighting and b) some of the code won’t vanish.
It looks like this part of your code
[[pdoResources?
&parents=`3`
&tpl=`children-grid-item.tpl`
&includeTVs=`banner-image`
&sortby=`{"menuindex":"ASC"}`
]]
generates the tiles for the “our solutions” section of the home page.
(This part calls a snippet with the name “pdoResources”.)
The problems seems to be that “pdoResources” limits the result (by default) to only 10 items. You can override that by adding a new property &limit=`0` (which means “no limit”) like this:
[[pdoResources?
&parents=`3`
&tpl=`children-grid-item.tpl`
&includeTVs=`banner-image`
&sortby=`{"menuindex":"ASC"}`
&limit=`0`
]]
that worked, thanks so much!