Knowledgebase : PHP Templating Reference

The CMS does NOT directly integrate with or interface with your payment processor.

If you have a single join URL you can enter it in your tour admins JOIN URL  setting for your tour. This will link up all join links to use that URL.

If you wish to have multiple payment processor options(Credit Card, Check, Phone, TEXT/SMS) then you'll need to edit the join.tpl file located in your theme area.

Included within your cms templates within

PHP Templates:

/cms_admin/phptemplates/[templatefolder]/tour/join.tpl

Within this template, you'll put the URL and text you want to display for each of the payment options. Take a look at the join pages of some sites and get ideas. Your payment processor will install their script to manage users and should be able to give you more info on the join forms and such. If you need help with customizing this form, let us know and we can recommend 3rd party coders and designers to help you.

Gallery Builder Templates (PHP)  - (For Smarty Based FHG templates visit this link.)

Please follow the example files located in your /cms_admin/phptemplate/site0/gallerybuilder/ folder. You can download the default PHP based FHG templates at this URL: https://support.elevatedx.com/newest_templates.php

Using the included default templates as a guide you will need to edit the HTML of your own template files to include the code from the photos and/or videos smarty files. You’ll need to save your template using the extension .tpl

IMPORTANT –
The images folder must be named the same as the template so photos.tpl has a folder named 'photos'. A template named 'blue_15pics.tpl' would have a folder named 'blue_15pics'

Join Link Code Tags:

This tag will append the join URL you enter in the admin panel for this template. If you prefer not to have the system populate these tags you can hard code your join links into the templates.

<a href="<?= $template["JoinURL"] ?>"></a>

For each spot in the template you want a photo thumbnail to appear, use the following tag set.

<?php LoadTemplate("photo_item.tpl", ["index" => "1"]) ?>


The "index"=>"1" refers to the location of the photo in the template. When you edit a template in the cms admin panel, Location 1 corresponds to this location. Each spot must be defined with a number that corresponds to its Location in the template as defined in admin. For example if you have a gallery with 5 photos, you would have 5 instances of the tag set above,  ranging from "1" to "5".

e.g:
<?php LoadTemplate("photo_item.tpl", ["index" => "1"]) ?>

<?php LoadTemplate("photo_item.tpl", ["index" => "2"]) ?>

<?php LoadTemplate("photo_item.tpl", ["index" => "3"]) ?>

<?php LoadTemplate("photo_item.tpl", ["index" => "4"]) ?>

<?php LoadTemplate("photo_item.tpl", ["index" => "5"]) ?>


The same is done for movies, however, the template being loaded is movie_item.tpl as in the following example:

<?php LoadTemplate("movie_item.tpl", ["index" => 1]); ?>

<?php LoadTemplate("movie_item.tpl", ["index" => 2]); ?>

<?php LoadTemplate("movie_item.tpl", ["index" => 3]); ?>


Common tags that can be used to show content in a template:

Appear Date :  <?= $set["AppearDate"] ?>
Expiration Date :  <?= $set["ExpireDate"] ?>
Title : <?= $set["Title"] ?>
Description : <?= $set["Description"] ?>
Join URL : <?= $template["JoinURL"] ?>
Extra Fields: <?= $set["extrafields"]["FIELDNAME"] ?>
(Where FieldName is the extrafield you have set up for that set)


Models name :  <?= $set['info']['models'][0]['name'] ?>

Or for a list of all models by name:
<?php foreach($set["info"]["models"] as $modelkey => $model) { ?>
<?= $model["name"] ?>
<?php if ($modelkey != sizeof($set["info"]["models"]) - 1) { ?>, <?php } ?>
<?php } ?>

Advanced templating (for Coding Experts)
When generating a gallery, the system creates a file called index_debug.html within the destination folder of the gallery. Viewing this file will give you a complete dump of the information available to the user. Please use this file or a reference if looking to do anything more advanced.

By default, the PHP based theme templates default to showing the first 2 models assigned to a set. If you wish to show more names you can chnage the settingin the template code. 


In the PHP based templates e.g. update_table.tpl is the call to load the model list template:
<?php LoadTemplate("globals/model_list.tpl", ["set" => $set, "modellimit" => "2", "class" => "tour_update_models"]); ?>

modellimit" => "2" is what controls how many names show

Description:

This is the standard function used to load a subtemplate from a regular CMS template. It differs from a regular PHP call such as include by:

1) Variables that are declared within the existing template won't get assigned in the subtemplate UNLESS they are explicitly passed along.

2) Global variables (viewed by adding debug=1 to the members/template URL) declared by the CMS engine are available within the subtemplate automatically.

Common Location:

/cms_admin/phptemplate/<templatefolder>/functions/standard.tpl

Usage:

<?php LoadTemplate("template_sections/template.tpl"); ?>

<?php LoadTemplate("template_sections/template.tpl", ["varname" => 1]); ?>

Arguments

1) The first argument is the path to the template that should be loaded.

2) The second argument is a list of variables that should be included into the global scope once this template is included.

Within the second example above, an array is passed along with ["varname" => 1]. Within template.tpl, a variable name called $varname will be available, and its value is set to 1.

Description:

This will print an image for a specific set that is passed to it.

Common Location:

/cms_admin/phptemplate/<templatefolder>/functions/standard.tpl

Usage:

<?php foreach ($sets as $set) { ?>

<?php StdImage(array("set" => $set, "usepriority" => "14,20,21,22,23,24,25", "alt" => "", "class" => "update_thumb thumbs")); ?>

<?php } ?>

Arguments

There is only one argument that is passed to StdImage(), however, it is an associative array with the following possible elements:

set: This is an array containing all of the metadata for a set (which comes from the CMS)
usepriority: These are a list of thumbnail slots that the function should look for and use, separated by commas.
If multiple priorities are listed, use the first priority within the image, and use subsequent priorities as rollover images.

In the above example:
14,20,21,22,23,24,25

The system will show a priority 14 thumbnail, but when the user mouses over the thumbnail, the images will cycle through a priority 20,21,22,23,24 and 25 image before returning to a priority 14 image.

alt: This is the alt tag that should show on the image.
class: These are the CSS classes that will apply to the image.

Output

Here's an example of the output this function will do:

<img id="set-target-133" alt="" class="update_thumb thumbs stdimage" src="/members_php/content//contentthumbs/760.jpg" src0="/members_php/content//contentthumbs/760.jpg" src1="/members_php/content//contentthumbs/9275.jpg" src2="/members_php/content//contentthumbs/9276.jpg" src3="/members_php/content//contentthumbs/9277.jpg" src4="/members_php/content//contentthumbs/9280.jpg" src5="/members_php/content//contentthumbs/9279.jpg" src6="/members_php/content//contentthumbs/9278.jpg" cnt="7" v="0" height="170" width="235">

The standard CMS template has JavaScript functionality that takes all image tags with the class "stdimage", and rotates through src0, src1... src6 when the user mouses over the image.

This guide provides documentation and steps for setting up a NEW area using our PHP templates available here:

https://support.elevatedx.com/newest_templates.php

New Elevated X CMS Pro Design Themes (PHP)

Contemporary (Default) (contemporary-default Build 9): Contemporary (Default)

Classic (classic Build 13): Classic Totally Tubular (totallytubular Build 5): Totally Tubular
Elegant Modern (elegantmodern Build 5): Elegant Modern Going Solo (goingsolo Build 5): Going Solo Sleek Modern (sleekmodern Build 4):
Sleek Modern


We always recommend installing new templates into a 'dev.' subdomain so you can work on these areas while your existing area runs on the older templates.

1) Download the zip file for the templates you wish to use and extract the zip file to your local computer from the page above.

2) Inside the extracted folder you'll find 5 folders(cms_admin,members,tour,trial,vod) the area files are located inside the various area folders.
The files for the tour templates are located in the 'tour' subfolder.
The files for the members area are located in the 'members area subfolder.

3) Upload these files from the various area to your new area on your dev.subdomain.

Example:
Upload the files from the 'members' folder to the area you want the members area to be located on your dev.subdomain.com area.

4) Upload the the template files located inside the cms_admin/phptemplate/ to your cms_admin/phptemplate folder on your server.

5) Create(or ask your host to create for you) a symlink to your existing members/content/ folder inside your new dev member's area named 'content'

6) Create a new tour ID entry that references the new templates by using the import setting drop-down menu inside the "add a new tour" dialogue of the tour admin.(Selecting the templates you wish to use). Make sure you naviaget tot he admin home page after adding the tour and click the "set defaults" link if present.

7) Edit each areas' 'cmsinclude.ini.php' file in a text editor and modify the fields for this area. You'll nee to make sure the following entries are correct for your area:(Replace x with the ID number of the new site you are working with.
SITE ID=X

and if you are editing a new tour, also edit the tour DI to match your new tour ID you created.

TOUR ID= X

Also, please make sure to update the following:
$_SERVER[DOCUMENT_ROOT]/cms_admin

with your servers path to the cms_admin.

(You can always find the 'path to cms_admin' by going to your admin panel home page, locate the warnings area and click the link for "Click here for an Expanded/Detailed View" then scroll down to the 4th entry from the bottom, "Path".  across form it you will see the path to admin that you will want to copy and replace the '$_SERVER[DOCUMENT_ROOT]/cms_admin' line of your 'cms_admin' file.

Save and re-upload to your server. Then you should be able to access the areas.

When you first visit the area, you'll be prompted to either log into the admin panel(if you are not currently) or click a link to create a new area entry in the system by clicking the link. Please read the instructions and follow them.

If you run into any trouble please open a support ticket and we'll get back to you as soon as possible at http://support.elevatedx.com/

Note: This article covers custom coding that is not provided or covered by CMS support. This is meant to be a guide for custom coders to swap out the existing player in favor of another player or their own solution.

In the PHP templates, the main spot where the movie player loads is in a file called:

gallery/movie_player.tpl

You'll see a block of code that looks like this:

mwm = Math.min($("#mediabox_parent").width(), wdth);
mhh = Math.round(mwm * hdth / wdth);

txt = '<div id="mediacontainer" style="min-height:' + mhh + 'px; max-width:' + wdth + 'px; max-height:' + hdth + 'px;">'
txt = txt + '<video width="100%" height="100%" id="mediabox"'

if (uimage != "" && uimage != undefined && ("<?= $templatefields["flashvarsgalleryautoplay"] ?>" == "0"))
{
		txt = txt + ' poster="' + escape(uimage) + '" ';
}

txt = txt + '>';
for(i = 0; i < lst.length; i++)
{
		txt = txt + "\n" + '<source type="' + lst[i].type + '" src="' + lst[i].src + '" />';
}

if (trackfile != "")
{
		txt = txt + "\n" + '<track kind="metadata" class="time-rail-thumbnails" src="' + trackfile + '"></track>';
}

txt = txt + '</video>';
txt = txt + '</div>';

$("#mediabox_parent").html(txt);

$( window ).resize(function() {
		mwm = Math.min($("#mediabox_parent").width(), wdth);
		mhh = Math.round(mwm * hdth / wdth);
		$("#mediacontainer").css("min-height", mhh + "px");
});

passobj.success = function(media, node, player) {

	if ("<?= $templatefields["flashvarsgalleryautoplay"] ?>" != "0")
	{
		media.play();
	}

	media.addEventListener('play', function(e){

		if (started == 0)
		{
				for(i = 0; i < picarr.length; i++)
				{
						if (media.src.indexOf(escape(picarr[i].path)) > 0)
						{
						url = "stattrack.php?pagename=image&id=" + picarr[i].id + "&cg=" + picarr[i].setid + "&type=" + picarr[i].type + "&mt=" + picarr[i].name;
						$.get(url);
						}
				}

				started = 1;
		}
	});

	media.addEventListener('ended', function(e){
		started = 0;
	});

	<?php if (isset($trial)) { ?>

		media.addEventListener('ended', function(e){

		document.getElementById('mediabox_parent').style.display = 'none';
		document.getElementById('hpromo').style.display = 'block';

		if (document.getElementById("postroll_url"))
		{
				document.getElementById("postroll_url").href = "<?= $trial["videourl"] ?>";
		}

		});

	<?php } ?>
};

passobj.features = ['playpause','progress','current','duration','tracks','volume', 'timerailthumbnails','fullscreen'];

$('#mediabox').mediaelementplayer(passobj);

Here's a breakdown of what this does:

mwm = Math.min($("#mediabox_parent").width(), wdth);
mhh = Math.round(mwm * hdth / wdth);

txt = '<div id="mediacontainer" style="min-height:' + mhh + 'px; max-width:' + wdth + 'px; max-height:' + hdth + 'px;">'
txt = txt + '<video width="100%" height="100%" id="mediabox"'

if (uimage != "" && uimage != undefined && ("<?= $templatefields["flashvarsgalleryautoplay"] ?>" == "0"))
{
		txt = txt + ' poster="' + escape(uimage) + '" ';
}

txt = txt + '>';
for(i = 0; i < lst.length; i++)
{
		txt = txt + "\n" + '<source type="' + lst[i].type + '" src="' + lst[i].src + '" />';
}

if (trackfile != "")
{
		txt = txt + "\n" + '<track kind="metadata" class="time-rail-thumbnails" src="' + trackfile + '"></track>';
}

txt = txt + '</video>';
txt = txt + '</div>';

The way mediaelements.js works is that it relies on the system having an HTML <video> tag in place. An example code being built would look like so:

<video width="100%" height="100%" id="mediabox" poster="/path/to/image.jpg">
	<source type="video/mp4" src="/path/to/video.mp4" />
</video>

All of the code above the video block is building out this HTML manaully. Mediaelements.js requires this, however, some players have a programmatic interface to pass along video source information.

Depending on how your replacement player works will determine how you'll build out this information.

$("#mediabox_parent").html(txt);

This is the actual code that swaps in the generated video tag. We have a <div> with an id of "mediabox_parent" that the video tag code is inserted into.

$( window ).resize(function() {
		mwm = Math.min($("#mediabox_parent").width(), wdth);
		mhh = Math.round(mwm * hdth / wdth);
		$("#mediacontainer").css("min-height", mhh + "px");
});

This is handler code that will shrink down the video window when you resize the browser window. Something like this may or may not be necessary for a player replacement for it to be responsive.

passobj.success = function(media, node, player) {

	if ("<?= $templatefields["flashvarsgalleryautoplay"] ?>" != "0")
	{
		media.play();
	}

	media.addEventListener('play', function(e){

		if (started == 0)
		{
				for(i = 0; i < picarr.length; i++)
				{
						if (media.src.indexOf(escape(picarr[i].path)) > 0)
						{
						url = "stattrack.php?pagename=image&id=" + picarr[i].id + "&cg=" + picarr[i].setid + "&type=" + picarr[i].type + "&mt=" + picarr[i].name;
						$.get(url);
						}
				}

				started = 1;
		}
	});

	media.addEventListener('ended', function(e){
		started = 0;
	});

	<?php if (isset($trial)) { ?>

		media.addEventListener('ended', function(e){

		document.getElementById('mediabox_parent').style.display = 'none';
		document.getElementById('hpromo').style.display = 'block';

		if (document.getElementById("postroll_url"))
		{
				document.getElementById("postroll_url").href = "<?= $trial["videourl"] ?>";
		}

		});

	<?php } ?>
};

This does three things.

    1. Once the mediaelements.js player is open, it determines whether or not to autoplay.
    2. Once a movie is played, the does a callback to stattrack.php to record the movie as viewed. If you don't use the stats plugin, this functionality does not matter.
    3. In a trial area, once the movie is done, hide the movie div, and display an element that upsells them on a full membership. This only applies to trial areas and can be excluded otherwise.

passobj.features = ['playpause','progress','current','duration','tracks','volume', 'timerailthumbnails','fullscreen'];

Before creating the video player option, this is a feature that determines what options to load. This can be disregarded for your own player, however, you'll want to make sure your settings are included here.

$('#mediabox').mediaelementplayer(passobj);

This is the instantiation of the mediaelements.js player on top of the regular HTML5 video player you created up above.

In order to replace the player on the PHP templates, you will need to:

  1. Make sure to have any includes to the new scripting file on the top of movie_player.tpl as needed.
  2. Take out this existing chunk of code that creates the <video> tag and starts the mediaelements.js code
  3. Add in new relevant player code that creates and assigns the new player. You will want to almost certainly make sure the new player is created within the #mediabox div.

Templating Elevated X using the PHP Templating Language

About PHP:

PHP is a popular general-purpose scripting language that is especially suited to web development. The Elevated X CMS itself is written in PHP.

What this means for you is that the Elevated X CMS provides data which is available within your own PHP template files. These template files control the formatting of this data.


PHP Syntax:

You can find out more about PHP syntax here:
http://php.net/

If you're getting started with PHP, w3schools has a tutorial on it here:

http://www.w3schools.com/php/


Template Files:

By default, the template that the system uses is based on the name of the file that's being called.  For instance:
gallery.php uses /cms_admin/phptemplate/<templatefolder>/gallery.tpl
index.php uses /cms_admin/phptemplate/<templatefolder>/index.tpl
category.php uses /cms_admin/phptemplate/<templatefolder>/category.tpl

Tours generally use the file tour1.tpl or tour.tpl

Where <templatefolder> is the template folder currently in use. By default, new installs use the folder "site0" for standard templates, and "site0_mobile" for mobile templates.

 
Data:

Within the Elevated X PHP template system, we have a set of variables that are available for use within the templates.

To see the list of variables available, you can access our object browser by adding:

debug=1

to your URL. Examples of this are:

e.g: http://yoursite.com/members/?debug=root
e.g: http://yoursite.com/members/gallery.php?id=171&type=vids&debug=root

Or on our live demo:

http://allaccess.elevatedx.com/members_php/?debug=1


By adding this to your page URL as a PHP argument, you'll be able to see all of the variables available to your templates, along with some documentation on what each variable does.If there is a plus sign (+) next to the variable, you can expand it to see information about what information is stored in that variable.

Within your templates, you can take these variables, and dump them to the screen. One way of doing this is:
<pre>
<?php print_r($plugins); ?>
</pre>

In this case, this will dump a list of plugins that are available and enabled on your system.

Another example is:
<pre>
<?php print_r($sets); ?>
</pre>

If you're on a page that lists scenes, this will dump a list of scenes that are available on this page.



Includes:

Our CMS templates do not include the entire page's logic within one single template file.  Instead, we split the logic into separate files that can be then "included" into the template using the include tag.

Here's an example from index.tpl:

<?php foreach ($sets as $set) { ?>
  <div class="latest_updates_wrapper">
    <?php LoadTemplate("template_sections/update_table.tpl", ["set" => $set]); ?>
  </div>
<?php } ?>


Here's what this piece of code does:

    •    <?php foreach ($sets as $set) { ?>: This tag cycles (or loops) through what is known as an array.  In this case, the array is $sets. In each cycle, the loop creates a variable called $set. $set denotes a single scene.

    •    <?php LoadTemplate("template_sections/update_table.tpl", ["set" => $set]); ?>.  This will call out to a separate template.  It will pass along the variable $set, so it can be used in that sub-template.

    •    <?php } ?>: This closes the loop


Elevated X commands that will help:

1) highlevelcachedebug=1

By adding this to a page URL, you will see vital caching information, such as which template folder is in use:

e.g: http://allaccess.elevatedx.com/members_php/?highlevelcachedebug=1
e.g: http://allaccess.elevatedx.com/members_php/gallery.php?id=171&type=vids&highlevelcachedebug=1

Here, you'll be able to see that the "phpfolder" for this site is "site0".  This maps to the path:
/cms_admin/phptemplate/site0/

within the CMS.