Creating Custom HTML Themes

Fluid Galleries allows you to fully edit your theme's html code. We recommend that this feature only be used by those with HTML know-how.

You'll need to use a few special tags to help you insert dynamic data into your HTML code, or render optional blocks of HTML code.

Tag Types

Variable Tags are used to insert simple data such as your Title, MetaDescription (HTML safe).

<html>
    <head>
        <title>{Title}</title>
    </head>
    <body>
        ...
    </body>
</html>

HTML Variable Tags are identical to normal Variable Tags, except the output from HTML variable tags will be rendered as HTML.

<div class="description>
    {{Description}}
</div>

Block Tags are either used to render a block of HTML for a set of data, or conditionally render a block of HTML.

<html>
    <body>
        <ol id="pages">
            {block:Pages}
                <li> ... </li>
            {/block:Pages}
        </ol>
    </body>
</html>

Basic Variables

{Title}	The HTML-safe title of your website entered on the setting screen.
{MetaDescription}	The HTML-safe description of your website entered on the setting screen. Meant to be used inside of a Meta tag.
{MetaKeywords}	The HTML-safe keywords relating to your website entered on the setting screen. Meant to be used inside of a Meta tag.
{Favicon}	Your website's Favicon URL entered on the setting screen.
{TypekitID}	The typekitID entered on the setting screen.
{CustomCss}	Any custom CSS code added in the "Advanced" panel on the theme editor screen.

Navigation

{Home}	The home/splash page URL
{FirstPageURL}	The URL of the first page
{FirstViewablePageURL}	The URL of the first Portfolio or Text page

Request

{block:IfRootRequest} {/block:IfRootRequest}	Rendered when viewing the home/splash page (e.g. yourdomain.fluidgalleries.co)
{block:IfPageRequest} {/block:IfPageRequest}	Rendered when viewing a page (e.g. yourdomain.fluidgalleries.co/your-page)
{block:IfAssetRequest} {/block:IfAssetRequest}	Rendered when viewing an asset (e.g. yourdomain.fluidgalleries.co/your-page/123)
{block:IfNotRootRequest} {/block:IfNotRootRequest}	Rendered when not viewing the home/splash page (e.g. yourdomain.fluidgalleries.co)
{block:IfNotPageRequest} {/block:IfNotPageRequest}	Rendered when not viewing a page (e.g. yourdomain.fluidgalleries.co/your-page)
{block:IfNotAssetRequest} {/block:IfNotAssetRequest}	Rendered when not viewing an asset (e.g. yourdomain.fluidgalleries.co/your-page/123)

Pages

{block:CurrentPage} {/block:CurrentPage}	Rendered for the current page.
{block:Pages} {/block:Pages}	This block gets rendered for each page.
{block:Portfolio} {/block:Portfolio}	Rendered for Portfolio pages.
{block:Text} {/block:Text}	Rendered for Text pages.
{block:MenuLink} {/block:MenuLink}	Rendered for Menu Links.
{block:SubMenu} {/block:SubMenu}	Rendered for SubMenus.
{block:IfCurrentPage} {/block:IfCurrentPage}	Rendered if page is current page
{TotalPages}	The total number of pages.
{Index}	The number of the page (1 - 999)
{PageID}	The page's unique ID number
{PageURLName}	The page url name
{Name}	The page name
{URL}	The URL of the page

Text Page

{Title}	The Text Page's title
{{Body}}	The Text Page's body (Use double braces since this tag will output HTML)

Menu Link

{block:EmailLink} {/block:EmailLink}	Rendered if email link
{block:URLLink} {/block:URLLink}	Rendered if url link
{LinkURL}	Rendered if url link
{Target}	Rendered if url link
{Email}	Rendered if url link
{Subject}	Rendered if url link

SubMenu

{block:SubPages} {/block:SubPages}

This block gets rendered for each page inside the submenu.

Portfolio

{FirstAssetURL}	The URL of the first asset
{{Description}}	The Portfolio description (Use double braces since this tag will output HTML)
{TotalAssets}	The total number of Portfolio Assets (1 - 999)
{TotalAssetsWithZero}	The total number of Portfolio Assets (01 - 999)

Assets

{block:CurrentAsset} {/block:CurrentAsset}	Rendered for the current asset.
{block:Assets} {/block:Assets}	This block gets rendered for each asset.
{block:Image} {/block:Image}	Rendered for Image assets.
{block:YouTubeVideo} {/block:YouTubeVideo}	Rendered for You Tube Video assets.
{block:VimeoVideo} {/block:VimeoVideo}	Rendered for Vimeo Video assets.
{block:IfCurrentAsset} {/block:IfCurrentAsset}	Rendered if the asset is the current asset
{block:IfCoverAsset} {/block:IfCoverAsset}	Rendered if the asset is the cover asset
{AssetIndex}	The asset number (1 - 999)
{AssetIndexWithZero}	The asset number (01 - 999)
{AssetID}	The asset's unique ID
{AssetURL}	The URL of the asset
{PreviousAssetURL}	The URL of the previous asset, if it exists
{NextAssetURL}	The URL of the next asset, if it exists
{Title}	The asset title
{Description}	The asset description
{block:Caption} {/block:Caption}	Rendered if there is a Title or Description
{Width}	The asset's original width
{Height}	The asset's original height
{Small}	The URL of the asset's small thumbnail image (200 x 200 max)
{SmallRectangle}	The URL of the asset's small rectangle thumbnail image (200 x 150)
{SmallSquare}	The URL of the asset's small square thumbnail image (200 x 150)
{Medium}	The URL of the asset's medium thumbnail image (400 x 400 max)
{MediumRectangle}	The URL of the asset's medium rectangle thumbnail image (400 x 300)
{MediumSquare}	The URL of the asset's medium square thumbnail image (400 x 400)
{Large}	The URL of the asset's large image (900 x 900 max)
{Original}	The URL of the asset's original image

Image

{Alt}

The image alt tag

You Tube Video

{VideoID}

The you tube video's video ID

Vimeo Video