E-junkie Help >

E-junkie Template Engine



E-junkie has a Templating Engine to generate Shop/Product pages easily using EJTemplate.php. E-junkie Template is used for rendering , E-junkie Wordpress Plugin, E-junkie integration in E-junkie IO, E-junkie PHP Shop Script, and E-junkie Javascript Shop Script.

Syntax

We have 3 kind of template syntax.

Global Variables

View Cart URL {EJ.ViewCartUrl} Renders clients view cart url

Products JSON {AllProducts} Renders JSON value of all the products in the current context.

Conditional Templating

Shop Page {IfShop}....{/IfShop} Renders the html code inside the tags if the current page is a shop page or tags page.

Product Page {IfProduct}....{/IfProduct} Renders the html code inside the tags if the current page is a product page. IfProduct html code will be removed when shop page is rendered and vice-versa.

Shop Level Variables
Avaibale when Shop/Tag page is rendered

All the variables are present in Shop example.
{Products}...{/Products} works in loop for generating all the products.
All the product level variables are also present inside the {Products}...{/Products} loop, you can simple use them using {Product.XXXX}, XXXX being the Product property.

Pagination {Pagination}....{/Pagination} Renders the pagination using the template inside the tags.

Product Level Variables
Avaibale when Product page is rendered

All the variables are present in Product example.

Common Variables
Avaibale when both Shop or Product page is rendered

Tags {Tags}...{/Tags} Renders the available tags using the template present inside it. {Tag.Active} renders "active" when the current tag is selected.

Product Form {Product.Form}...{/Product.Form} Renders the form or button code for Cart to work. Make sure you have all the Product.Form child tags present(as provided in example). This works in both shop and product pages.

Examples

Shop Template

<!-- Generate View Cart -->
<div>
    <h1>Demo Shop</h1>
    <a href="{EJ.ViewCartUrl}" onclick="return EJEJC_lc(this);"></a>
</div>

<!-- Generate Tags -->
<div>
    {Tags}
	    <a class="{Tag.Active}" href="{Tag.Url}">{Tag.Name}</a>
    {/Tags}
</div>

<!-- Generate Products -->
<div>
{Products}
	<a href="{Product.Url}">
		<div>
    		<img src="{Product.Thumbnail}">
    		<h4>{Product.Name}</h4>
        	<span>{Product.Currency} {Product.Price}</span>
            <p>{Product.DescriptionShort/60}</p>
		</div>
	</a>
{/Products}
</div>

<!-- Generate Pagination -->
<div>
{Pagination}
	<a class="{Pagination.Active}" href="{Pagination.Url}">{Pagination.Number}</a>
{/Pagination}
</div>

Product Template

<!-- Product Basic Details-->
<h3>{Product.Name}</h3>
<p>{Product.Tagline}</p>
<p>{Product.Description}</p>
<p>{Product.Currency} {Product.Price}</p>

<!-- Product Images -->
<div>
{Product.Image1}<img src="{Image}">{/Product.Image1}
{Product.Image2}<img src="{Image}">{/Product.Image2}
{Product.Image3}<img src="{Image}">{/Product.Image3}
{Product.Image4}<img src="{Image}">{/Product.Image4}
{Product.Image5}<img src="{Image}">{/Product.Image5}
</div>

<!-- Product Type -->
{ProductSpecs}
<div>
    {ProductSpecs.Bundle}<p>Product Bundle</p>{/ProductSpecs.Bundle}
    {ProductSpecs.Code}<p>Instant Code Delivery</p>{/ProductSpecs.Code}
    {ProductSpecs.File}<p>{ProductSpecs.File.Size} <b>{ProductSpecs.File.Type}</b></p>{/ProductSpecs.File}
</div>
{/ProductSpecs}


<!-- Product Cart Form or Button -->
{Product.Form}
    {DropDown}
    <p>
        <span>{DropDown.Label}</span>
        <select name="{DropDown.Name}">{DropDown.Options}</select>
    </p>
    {/DropDown}
    {TextField}
    <p>
        <span>{TextField.PlaceHolder}</span>
        <input type=text name="{TextField.Name}" placeholder="{TextField.PlaceHolder}">
    </p>
    {/TextField}

    {BuyNowButton}
        <button type="submit" onclick="javascript:return EJEJC_lc(this.parentNode);">ADD TO CART</button>
    {/BuyNowButton}
{/Product.Form}

<!-- Product Details -->
{Product.Details}

<!-- More Details and Demo Link -->
<a href="{Product.HomepageLink}">More Details</a>
<a href="{Product.DownloadLink}">Try Demo</a>

<!-- Affiliate Section -->
{IfAffiliate}
<div>
    <h4>Become Affiliate</h4>
    <div>
      <p>Like this product?</p>
      <p>Spread the word about it and <b>earn {Affiliate.Percentage}%</b> of the purchase price on sales you refer. </p>
      <a href="{Affiliate.Url}">Join our affiliate program</a>
    </div>
</div>
{/IfAffiliate}


<!-- Related Products -->
{RelatedProducts}
<div>
    <div>
        <h4>More products</h4>
    </div>
    {RelatedProduct}
    <div>
        <a href="{RelatedProduct.Url}">
            <div>
                <img src="{RelatedProduct.Thumbnail}">
                <h4>{RelatedProduct.Name}</h4>
                <span>{RelatedProduct.Currency} {RelatedProduct.Price}</span>
            </div>
        </a>
    </div>
    {/RelatedProduct}
</div>
{/RelatedProducts}
Was this article helpful?
Yes, thanks!
Not really

Can't find what you're looking for?

Contact Us