Capitan Systems Limited

Best viewed on a device with a bigger screen...
Tel: 0208 051 7906

HTML Template

To customise the HTML template go to Capitan > Settings > Edit HTML Template.

Capitan LAMP system, which means that you'll see some PHP snippets in your default template. Don't worry if you have no previous experience with PHP as you shouldn't need to edit these snippets. And as long as you have a basic understanding of general coding syntax we can keep you on track here.

Note: Capitan > Settings can only be accessed by the SuperAdmin user.


CSS Template

To customise the CSS template go to Capitan > Settings > Edit CSS Template.

To customise the framework Sass variables go to Capitan > Settings > Edit Sass Variables.

Capitan extends on Bootstrap to provide CSS framework, so you have access to all of the familiar Bootstrap's utilities and components out of the box.

Your installation comes pre-loaded with Sass files which will enable you to easily theme both the Bootstrap and Capitan framework.

Note: Capitan > Settings can only be accessed by the SuperAdmin user.


Staging Environment and Developer Utilities

We've included some useful utilities to make designer/developer's jobs easier. URL string variables can be used to invoke these environments and utilities.

  • capdev=your_dev_code
    • ie: https://www.yourdomain.com/?capdev=your_dev_code
    • Forces the CSS cache to clear by adding a random string to your CSS file URL.
    • Forces checkout to run in sandbox mode.
  • capcss=your_dev_code (in conjunction with capdev)
    • ie: https://www.yourdomain.com/?capcss=your_dev_code
    • Invokes the CSS staging evironment by appending the file name of the appointed CSS for the page by appending the file name with '_DEV'. For example: if the page appoints /css/template.css then capcss will override the path to the /css/template_DEV.css.
  • /templates/template_DEV.php?pageref=page_url
    • ie: https://www.yourdomain.com/templates/template_DEV.php?pageref=index
    • Invokes the HTML staging evironment, forcing your DEV HTML template to be loaded for the requested in url.

PHP Quick Intro

A PHP snippet must start and end with specific tags

<?php // the opening tag  
?> // the closing tag

The type of action which you'd like PHP to perform needs to be placed between the opening and closing tags. The only action you need to know about is 'echo', which basically translates to 'insert this into the page here'. It is important that the action must be followed by a semi-colon, which tells PHP that its the end of the instruction.

<?php echo 'hello'; ?>
This would insert the word 'hello' into the page, wherever you have put the PHP snippet.

Dynamic content is delivered via variables which have a set name and a variable value.

<?php echo $CAP_COMPANY_NAME; ?>
The variable name is $CAP_COMPANY_NAME
The variable value is 'Capitan', which is this installation's 'Company Name'

This example would insert the word 'Capitan' into the page.

Capitan PHP snippets:

Specific to the item being viewed:

$CAP_ITEM_TITLE
The title of the page coming from the item's 'SEO Title'

$CAP_ITEM_DESCRIPTION
The description of the page coming from the item's 'SEO Description'

$CAP_ITEM_KEYWORDS
The keywords for the page coming from the item's 'SEO Phrases & Keywords'

$CAP_ITEM_ROBOTS
Data for Meta Tag "robots", ie: 'index, follow'. Based on the item's 'Included in Sitemap' setting and public availability.

$CAP_OG_EXTRAS
Additional Open Graph Meta Tags for the item. Automatically configured for certian types of Module Item.

$CAP_ITEM_URL
The canonical URL for the item. Automatically generated based on the item's 'URL' and it's location in the website hierarchy.

$CAP_ITEM_CSS
The path to the CSS resource. Defaults to /css/template.css but can be overriden by the item's 'Custom CSS Template' setting

$CAP_ITEM_FILES

$CAP_ITEM_JS

$CAP_ITEM_MASTHEAD

$CAP_ITEM_WZ1

$CAP_ITEM_WZ2

$CAP_ITEM_WZ3

$CAP_ITEM_WZ4

$CAP_ITEM_CONTENT

Specific to the installation profile:

$CAP_COMPANY_NAME

$CAP_COMPANY_WEBSITE

$CAP_COMPANY_ADDRESS1

$CAP_COMPANY_ADDRESS2

$CAP_COMPANY_CITY

$CAP_COMPANY_REGION

$CAP_COMPANY_COUNTRY

$CAP_COMPANY_POSTCODE

$CAP_COMPANY_EMAIL

$CAP_COMPANY_TEL

$CAP_COMPANY_TAX

$CAP_COMPANY_REG

$CAP_COMPANY_FACEBOOK

$CAP_COMPANY_TWITTER

$CAP_COMPANY_INSTAGRAM

$CAP_COMPANY_LINKEDIN

Capitan utilities:

$CAP_JS_CORE

$CAP_TOOLS_OPENINGTAGS

$CAP_TOOLS_BREADCRUMBS

$CAP_TOOLS_ACCESSKEYS

$CAP_TOOLS_SEOSUMMARY

Capitan main navigation:

##################################################################################
## CONFIGURE navTree(PARENT, SUBLEVELS, EXTRA DATA, EFFECTS)
##################################################################################

## PARENT: nav,float or Capitan page CID. IE: 'float'
## SUBLEVELS: specify how many sub-levels should be included. Integer: IE: 3
## EXTRA DATA: Include item icon, preview, button. Boolean: ICON|PREVIEW|BUTON. IE: 'true|fase|true'. (default: none)
## EFFECTS: popup link and sub-nav transition options. POPUP|FX. IE: 'true|animated fadeIn'
## POPUP: Boolean (default: false)
## FX: Specify animate.css classes for sub-nav transition. (default: none)

<?php echo $FE_CORE->navTree('nav',2,'','false|animated fadeIn'); ?>

HTML PHP CSS Sass Data Assets. Design theme

Access Key Enabled Navigation
Keywords for: Capitan Knowledge Base: HTML and CSS template development

HTML, PHP, LAMP, CSS, Sassdata assets, Design, theme, Capitan, website design, website development, web design, web development, website platform, web builder, website builder, website, design, platform, e-marketing, e-invoicing, content management, CRM, London, EC1V 9EE