<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>landing page &#8211; Foundry Hub</title>
	<atom:link href="https://www.foundryvtt-hub.com/tag/landing-page/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.foundryvtt-hub.com</link>
	<description></description>
	<lastBuildDate>Sun, 28 Mar 2021 01:23:22 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.6.5</generator>

<image>
	<url>https://www.foundryvtt-hub.com/wp-content/uploads/2021/02/cropped-fhub_logo3-32x32.webp</url>
	<title>landing page &#8211; Foundry Hub</title>
	<link>https://www.foundryvtt-hub.com</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Foundry Tips and Tricks &#8211; Let&#8217;s Build a Landing Page!</title>
		<link>https://www.foundryvtt-hub.com/showcase/foundry-tips-and-tricks-lets-build-a-landing-page/</link>
					<comments>https://www.foundryvtt-hub.com/showcase/foundry-tips-and-tricks-lets-build-a-landing-page/#comments</comments>
		
		<dc:creator><![CDATA[MattK]]></dc:creator>
		<pubDate>Tue, 23 Feb 2021 23:10:11 +0000</pubDate>
				<category><![CDATA[Showcase]]></category>
		<category><![CDATA[Foundry]]></category>
		<category><![CDATA[landing page]]></category>
		<category><![CDATA[modules]]></category>
		<guid isPermaLink="false">https://www.foundryvtt-hub.com/?p=100003575</guid>

					<description><![CDATA[Let's learn how to do some cool stuff in Foundry! Let's make a landing page. Note: This is not an exhaustive step-by-step walkthrough. It should get you pointed in the right direction though.]]></description>
										<content:encoded><![CDATA[
<p>An interactive landing page provides players with an immersion building starting point for entering the doorway to your world. Foundry enables us to build beautiful and fully interactive scenes which can provide players a &#8216;home base&#8217; scene to start from. With the right modules and some creative thinking, we can also create a space where players can access a great deal of information in fun and exciting ways. Let&#8217;s take a look at some examples and see how it can be done.</p>



<div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow">
<div class="wp-block-uagb-inline-notice uagb-inline_notice__outer-wrap uagb-inline_notice__align-left uagb-block-0d0d5b5a"><h4 class="uagb-notice-title"><strong>Editor&#8217;s Note</strong></h4><div class="uagb-notice-text"><p>Our first scene is brought to us courtesy of Todori. Todori runs a Pathfinder game, but this kind of page will work with any system compatible with the required modules.</p></div></div>



<div style="height:12px" aria-hidden="true" class="wp-block-spacer"></div>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="FVTT Landing Page" width="1140" height="641" src="https://www.youtube.com/embed/Wu7eKeojAFk?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>Beautiful and functional! Original art template courtesy of Reddit user u/FlereousM, who scoured the interwebs for the art and arranged it <a href="https://www.reddit.com/r/FoundryVTT/comments/gyjduf/current_landing_page_for_my_pathfinder_campaign/" class="rank-math-link" target="_blank" rel="noopener">here</a>. </figcaption></figure>
</div></div>



<p>The key to making this landing page truly interactive, is the use of a few modules.</p>



<ul class="wp-block-list"><li><a href="https://www.foundryvtt-hub.com/package/trigger-happy/" class="rank-math-link">Trigger Happy</a> for clicking on things to activate other things</li><li><a href="https://www.foundryvtt-hub.com/package/forien-quest-log/" class="rank-math-link">Forien&#8217;s Quest Log</a> for the quest log system</li><li><a href="https://www.foundryvtt-hub.com/package/inlinewebviewer/" class="rank-math-link">Inline Web Viewer</a> for accessing an interactive website through journals</li><li><a href="https://www.foundryvtt-hub.com/package/lootsheetnpc5e/" class="rank-math-link">LootSheetNPC5e</a> for the loot chest if you&#8217;re in 5e. It&#8217;s available for other systems like Pathfinder2E and 3.5e as well.</li></ul>



<p>Trigger Happy is a powerful module, and if you are not familiar with how to use it, we recommend you start <a href="https://github.com/League-of-Foundry-Developers/fvtt-module-trigger-happy" class="rank-math-link" target="_blank" rel="noopener">here</a>.  Here is a sample of Toldori&#8217;s landing page triggers for the Trigger Happy module:</p>


<pre class="wp-block-code"><span><code class="hljs language-php"><span class="hljs-comment">// Click to change the scene</span>
@Token&#91;AndoranMap] @Trigger&#91;click] @Scene&#91;Andoran]

<span class="hljs-comment">// Click to open character sheet</span>
@Token&#91;YorikCard] @Trigger&#91;click] @Actor&#91;Yorik]
@Token&#91;PartyLoot] @Trigger&#91;click] @Actor&#91;Party<span class="hljs-string">'s Loot Chest]

// Click to call macro that opens up Forien'</span>s Quest Log
@Token&#91;LandingBook] @Trigger&#91;click] @Macro&#91;QuestLog]

<span class="hljs-comment">// Click to open up journal</span>
@Token&#91;InnerSea] @Trigger&#91;click] @JournalEntry&#91;httpspathfinderwikicom]</code></span></pre>

<pre class="wp-block-code"><span><code class="hljs language-php"><span class="hljs-comment">// The macro used to open up Forien's Quest Log</span>

QuestLog.render(<span class="hljs-keyword">true</span>);</code></span></pre>


<p>The key to the creation of triggers is to use the module&#8217;s &#8216;transparent token&#8217; to cover the area of an image you wish to trigger with, then make sure that you toggle the token to be &#8220;Invisible&#8221; to the players. Combining this with using the &#8220;@Trigger[click]&#8221; inside the journal entry will create an illusion for your players that they are interacting with things placed on the scene. The transparent token, macros and a helpful README will appear in your compendium after activating the module. Follow the provided instructions (and check youtube for additional helpful videos) and you will be activating things in no time!</p>



<p>Huge thanks to Todori for sharing this fantastic landing page!</p>



<div class="wp-block-uagb-inline-notice uagb-inline_notice__outer-wrap uagb-inline_notice__align-left uagb-block-6f4fda84"><h4 class="uagb-notice-title"><strong>Editor&#8217;s Note</strong></h4><div class="uagb-notice-text"><p>Our second showcase comes to us courtesy of Cystere.Orling, who uses some animation along with teleporting to turn their landing page into a launching point scenes players can navigate to on their own. A big shout out to Cystere.Orling for sharing their idea!</p></div></div>



<div style="height:12px" aria-hidden="true" class="wp-block-spacer"></div>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="InkedTheCityHasNoSay VTTLandingPage" width="1140" height="641" src="https://www.youtube.com/embed/Ujsnj3_Beck?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div><figcaption>Inspired by u/DragonbeardNick from the following <a href="https://www.reddit.com/r/FoundryVTT/comments/l08llk/landing_page_for_my_upcoming_eberronai_game/" class="rank-math-link" target="_blank" rel="noopener">Reddit post</a></figcaption></figure>



<p>This landing page makes use of two modules.</p>



<ul class="wp-block-list"><li><a href="https://www.foundryvtt-hub.com/package/parallaxia/" class="rank-math-link">Parallaxia</a> for the scrolling player images. Additional information on how to use this module can be found <a href="https://gitlab.com/reichler/parallaxia" class="rank-math-link" target="_blank" rel="noopener">here</a>.</li><li><a href="https://www.foundryvtt-hub.com/package/multilevel-tokens/" class="rank-math-link">Multilevel Tokens</a> for the teleportation effect. This module also has a great deal of possible uses. Start <a href="https://github.com/grandseiken/foundryvtt-multilevel-tokens" class="rank-math-link" target="_blank" rel="noopener">here</a>.</li></ul>



<p>Cystere.Orling says:  I got the scrolling image idea from this <a href="https://www.reddit.com/r/FoundryVTT/comments/l08llk/landing_page_for_my_upcoming_eberronai_game/" class="rank-math-link" target="_blank" rel="noopener">post</a> by <em>u/DragonbeardNick</em> and when I asked him how he had the images cycling through what appeared to be an image wider than the screen, he said that it was one long image. For the scrolling I created a tile that was the height of the image I used (using <a href="https://www.photopea.com/" class="rank-math-link" target="_blank" rel="noopener">photopea</a> to simply put five separate player images onto one wide image) and the width of the poster. I used the very long image of five as the &#8220;fill&#8221; image for the tile so when I placed it, it appeared stretched to fit. Then when I selected the tile and activated parallaxia, the image became its actual size and only showed what is currently in view (or in frame), so it appears that it is cycling through.</p>



<div style="height:12px" aria-hidden="true" class="wp-block-spacer"></div>



<p>Check out the modules, pull together some fantastic art, and start creating! See what you can build and post your results in the forum for everyone to see! </p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.foundryvtt-hub.com/showcase/foundry-tips-and-tricks-lets-build-a-landing-page/feed/</wfw:commentRss>
			<slash:comments>6</slash:comments>
		
		
			</item>
	</channel>
</rss>

<!--
Performance optimized by W3 Total Cache. Learn more: https://www.boldgrid.com/w3-total-cache/?utm_source=w3tc&utm_medium=footer_comment&utm_campaign=free_plugin

Object Caching 76/760 objects using Memcached
Page Caching using Disk: Enhanced 
Minified using Disk
Database Caching 1/45 queries in 0.009 seconds using Memcached (Request-wide modification query)

Served from: www.foundryvtt-hub.com @ 2026-05-30 08:21:59 by W3 Total Cache
-->