How can I produce a layout like on the following web page in CMSMS?
https://library.elementor.com/landing-page-wedding/
Obviously multiple pages are shown right after each other by scrolling down.
How can multiple content pages be added together to form one single scrolling page?
Multiple pages shown as one single long page
Multiple pages shown as one single long page
I am using CMSms 2.2.19
Re: Multiple pages shown as one single long page
These tutorials might help you:
https://cmscanbesimple.org/blog/multipl ... query-tabs
https://cmscanbesimple.org/blog/smooth- ... -an-anchor
Ps. instead of CGSimpleSmarty module, use http://dev.cmsmadesimple.org/projects/smartyext !
https://cmscanbesimple.org/blog/multipl ... query-tabs
https://cmscanbesimple.org/blog/smooth- ... -an-anchor
Ps. instead of CGSimpleSmarty module, use http://dev.cmsmadesimple.org/projects/smartyext !
- + - + - + - + - + - + -
LATEST TUTORIAL AT CMS CAN BE SIMPLE:
Migrating Company Directory module to LISE
Migrating Company Directory module to LISE
- + - + - + - + - + - + -
Re: Multiple pages shown as one single long page
I use Navigator to build the page divs and anchors, then jQuery to populate and, optionally, lazy load them:
Navigator template for building the divs:
Then another one for building the script:
Call the first one with a Navigator tag excluding the current page, and loadprops=0, where the content should go, and the second one the same way in <__script__> tags after jQuery is loaded. The content pages should either have a blank template that just contains {content} and any layout html needed, or you'll need to add ?showtemplate=false to the url called with .load()
You can then get fancier by adding lazy loading, navigation links, etc. The Eat (free) and Eat Pro themes on easythemes.ca use the above, the paid version having lazy load.
Navigator template for building the divs:
Code: Select all
{if isset($nodes)}
{foreach $nodes as $node}
<span id="anchor-{$node->alias}" class="anchor"></span>
<div id="{$node->alias}">
{* content will be loaded here by jQuery *}
</div>
{/foreach}
{/if}
Code: Select all
{if isset($nodes)}
{foreach $nodes as $node}
$( "#{$node->alias}" ).load( "{$node->url}" );
{/foreach}
{/if}
You can then get fancier by adding lazy loading, navigation links, etc. The Eat (free) and Eat Pro themes on easythemes.ca use the above, the paid version having lazy load.
Not getting the answer you need? CMSMS support options
Re: Multiple pages shown as one single long page
Thanks for your answers. Seems to be heavy stuff. At least a lot of what I read sounds quite alien to me. I will give it a try. Let's see how far I get.
I am using CMSms 2.2.19