Documentation

OneClip

OneClip was created as a Joomlal 3.5+ template with Quickstart for corporate, agency, nonprofit or freelancer purpose that requires blog, portfolio, and newsletter. Other than the minimalistic single page design, it also has a blog (based on core articles, not K2) and portfolio section. This is a mulitipurpose OnePage responsive template will help your business grow, give the opportunity to present your Kickstart/company product, services or business. Inside Quickstart only you will find mulitool, drag & drop SP Page Builder Pro, so you can easily customize everything, also Coming Soon Page & 404 Page. QuickStart gives you 5 unique pre-designed pages. It uses Joomla 3.5, SP Simple Portfolio and Helix 3 Framework (with Bootstrap 3 inside). Full of features and flexible design can be used to create any other website. The clean layout follows current design trends, and offers both a boxed and open layout as well. This is the best inbox solution to build an awesome web-site for your clients.

OneClip OnePage Single Page Joomal 3.6 template

Spending several minutes reading following manual may save lot's of your time and avoid forum questions with obvious answers. Following guide contains the basic configuration settings for the Joomla 3 template. This template has been based on Helix3 Framework so please check related >>manuals <<.

Technical requirements

It is strongly recommended that you always use the latest stable version of Joomla to ensure all known bugs and security issues are fixed. Template will only function properly on Joomla 3.5 (3.6) and newer versions.

To prevent problems with used components and installation freezes (never ending) use following settings:

  • PHP 5.5/5.6/7 (we do not support 5.3)
  • MySQL(i) 5.5+
  • PostgreSQL 9+

To use QuickStart please use these php settings :

  • memory_limit --> at least 64M (128 MB)
  • max_execution_time --> at least 240 (by default is set to 30 seconds only.)
  • Magic Quotes GPC off

In most cases those values can be changed in php.ini or .htaccess file. Please contact your web hosting service provider to be sure your server complies with the requirements or to ask them where/how to change those settings.
About used browser we suggest to use latest version of Firefox, Safari, Chrome or Internet Explorer 10+. Please remember that Internet Explorer versions 8 and older are NOT supported anymore by Microsoft company.

Template vs Quickstart differences

The Quickstart package is a complete demo website. It's basically a fully functional and entire Joomla! 3 package containing the CMS itself, components, modules, chosen template, Helix3 framework plugin with all the configurations and data that we used on the demo site. You can use it to recreate/restore demo site appearance. You don't have to use demo content to build your own website, demo-dummy content is only for showing a features of current template and included components. After all you can remove it.
Standalone template package (~2 MB) doesn't include any modules/components nor demo content. If you manually installed the template on your existing setup, you will have to manually create each article and install & set all modules to suit your needs using our example settings. Also subpages created via SP Page Builder should be restored or created from scratch. So if you are not advanced user please install the template Quickstart on your testing ground/environment, just to get more insights on sample content and advanced usage. You will be able check each setting or used demo content.

In most cases JoomShaper Template package include overridden of several components views, for example: Acy Mailing and SP Page Builder. 

Note! We recommend that you download Joomla and/or Quickstart only from the official websites. If you download the installation package from other than the official one, there is a risk of malicious code in the setup files. We do not support illegal, mostly infected, copies.

Note! Inside QuickStart there is a full version of SP Page Builder Pro installed already. But during purchase of template membership you didn't get a update possibility of this component from Joomla! back-end. To get standalone PRO version with all current updates you have to purchase it from that page: https://www.joomshaper.com/page-builder

 

How to install Quickstart

  1. Unfortunately, it is not possible to install the Quickstart package inside an existing Joomla installation via the Extension Manager. Why? Because the Quickstart also includes the Joomla! CMS itself. This package is strictly for use with a new Joomla! installation to provide you with a duplicate of our demo for that particular template.
  2. You can install Quickstart just like a typical Joomla 3.x installation process (step by step).
  3. Download from our site package : TemplateName_quickstart_j3.zip.
  4. Unzip Quickstart package to get separate folders and files before sending them to server.
  5. Upload the extracted files and folders to your web server - for that task please use SFTP/FTP tool - in most cases it will be public_html folder.
  6. Create a MySQL database and assign a user to it with full permissions. In most cases we suggest to use a new/fresh database (MySQL) for all QS installations.
  7. Open your browser and navigate to your main domain (i.e. http://mydomain.com), or to the appropriate subdomain (i.e http://mydomain.com/new), depending where you have uploaded the Joomla installation package.
  8. You will be taken to the first screen of the Joomla Web Installer.
  9. Please do not use "admin" as a your default Super Admin Username (!). Use something more unique during installation process (security reasons!).
  10. Default Demo sample data will be automatically installed on your server.
  11. After successful installation change our demo texts, menu items and images.
    Please also read our article -> I’ve installed Quickstart, So what’s next?

 

The Quickstart installation problems

Because QS includes many extensions and their settings it request good PHP settings. Check mentioned above technical requirements.

If during QuickStart installation on localhost you have never ending installation, please check your PHP settings (suggested values above) and if those settings will not help please make small customization:

  • Open in your text editor the following files: installation\sql\mysql\joomla.sql and installation\sql\mysql\sample_data.sql
  • Find all instances of ENGINE=InnoDB and change/replace to ENGINE=MyIsam
  • Now return in your installation procedure one step back and try again.
  • Use MySQL in choose field not MySQLi if you still have problems with database step.

No images from demo

demo img smThe images shown in the live preview are for demonstration purposes only and are not included in the download package. Due to license QuickStart package contains mostly only image placeholders (Grey background blocks with JoomShaper logo inside).
Unfortunately we cannot include in Quickstart package all photos from original Template Demo. We assume that our customers have (or should have) their own photos, which better fit to real website purposes. First online impression is the most important, so please use high quality and legal photos.

 

The Manual template installation is preferred if you just want to install the template to an existing website which already has some content. However, keep in mind that when you install the template to an existing website, you will also have to reconfigure used modules because the new template has different module positions. But we always suggest to install QuickStart on temporary location, like sub-domain, to check all settings and demo content.

 

Template Demo Settings

If you installed only template (not Quckstart !) you can import template demo settings. Template settings doesn't include settings of modules nor components. Helix3 template allows you to Export-Import its settings from "Advanced" tab. It means that you have to download a >>settings file<<, then unzip , next select whole text, copy and paste inside Import field of your template. It includes all basic settings of Template only !. If you're using Quickstart you doesn't have to do this, default settings are already there.

import export

Typography

In template demo we used Google Font named: Source Sans Pro for whole demo site typography.
Check template Typography tab inside template settings, of course you can set your own font-family. More information about Typography you can find >> here <<. Remember that not all Google Fonts support multiple scripts (like Latin, Cyrillic, and Greek for example). Use them if you need to use diacritical marks/chars, native language letters.

 

Icons in OneClip

In this template we used scalable vector icons: FontAwesome 4.4 . They can instantly be customized — size, color, drop shadow, and anything that can be done with CSS. There are typography icons - so to use them right, you have to use class names. Font Awesome & OneClip are designed to be used with inline elements (we like the < i > tag for brevity, but using a < span > is more semantically correct).   Guide how to use FontAwesome you will find in this Manual.

Template Update

Before you go ahead with the update please check template changelog on product page. It is the best practice to backup both your files and database regularly and especially before making some serious updates. We recommend using free backup component for Joomla! like Akeeba Backup. Typical template update process is easy. You can manually reinstall new template using a new package. Second option can be done from Extensions: Update but request from you filling two fields License Key and email in template "Update settings" tab.

Layout - Module Positions

The following screen-shot highlights the default layout module positions that we used in current template. By using Layout builder in Helix3 users will be able to move positions or change their size in the grid. Our in-build layout builder from template settings provide the opportunity to add new positions, columns, rows wherever you need as much as moving elements.

These are the all available template module positions which you can use:

  • title
  • top1
  • top2
  • top3
  • logo
  • menu
  • search
  • slide
  • user1
  • user2
  • user3
  • user4
  • left
  • right
  • feature
  • slider
  • position1
  • position2
  • position3
  • position4
  • position5
  • position6
  • position7
  • position8
  • bottom1
  • bottom2
  • bottom3
  • bottom4
  • breadcrumb
  • footer1
  • footer2
  • comingsoon
  • offcanvas
  • pagebuilder
  • 404
  • debug

It means that you can use all on them on layout grid. If you need more, you have to add new name inside: templates\shaper_oneclip\templateDetails.xml

Menu Settings, Colors & Type

In current template in "Top" Menu section we used:

  • Main Menu (type: Mega Menu only)
  • search icon.

Of course you don't have to use all demo items/elements.

For example pretty easily you can disable Off Canvas [=] menu from desktop view only.

menu2

Color of menu items is controlled by template.css but you have to use custom css code inside custom.css file (more info here) to change/override used colors:

.sp-megamenu-parent > li > a { color: green;}
.sp-menu-item > a:hover, .sp-megamenu-parent > li > a:hover { color: yellow; }
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a {color: grey;}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > a:hover {color: purple;}
.menu-fixed .sp-megamenu-parent > li > a {color: blue;}
.menu-fixed .sp-megamenu-parent > li > a:hover {color: red;}


In Agency template variation
there is a fancy [=] [x] Menu  

You can easily switch to classic MegaMenu (with all menu items visible) and hide fancy menu using only 2 lines of custom CSS code:

body.variation-agency #sp-menu .sp-megamenu-parent {display:block}

body.variation-agency #sp-menu .show-menu {display:none;}

 

Please read where to put css code: https://www.joomshaper.com/documentation/helix3/custom-code-settings

 

Search icon (next to menu)

About Search icon and whole feature - it's default search module which extra styles, this view was overridden by template. And this core module was published on Menu position. Note! It should have "oneclip-top-search" Module Class Suffix.

 

 

How to use One page Menu links

Because this is OnePage layout it has its own rules.

  • Home menu item must have "home" inside Custom CSS Class field   (Menu: Edit item -> Helix Megamenu Options)
  • All external page/url for example Blog or Portfolio menu item must have "no-scroll" name inside inside Custom CSS Class field   (Menu: Edit item -> Helix Megamenu Options)

Without them template system will not work properly.

OnePage links (menu items) are internal links to IDs names. By including an anchor tag within a page, you can place links in the body of your post which when clicked allow the reader to smooth jump to another location on the page. The anchor link only works when you are jumping to a specified spot on the same webpage. If you want a link to jump a specific location on a different page, you'll need to replace #anchor with the component view or full URL for the page. Remeber about mentioned above "no-scroll" CSS Class.

  • If you are using page created in SP Page Builder (Pro) write unique ID Section names for each row. We suggest to use short names, you can use "-" between words.
  • If you are using Helix3 Layout use default section ID names.

One Page Links - Joomla 3.6 Template

List of used extensions

In JoomShaper OneClip Quickstart (Demo content) we used both Joomla! core and additional extensions. Here is a full list of them:

  • SP Page Builder Pro - Pro version is built-in in QuickStart only (JoomShaper.com)
  • SP Simple Portfolio (component + module from JoomShaper.com)
  • AcyMailing Starter (component + module from Acyba.com)
  • Articles - Latest (Joomla core module)
  • Articles - Categories (Joomla core module)
  • Banners (Joomla core module)
  • Breadcrumbs (Joomla core module)
  • Custom HTML (Joomla core module)
  • Login (Joomla core module)
  • Search (Joomla core module)
  • Tags - Popular (Joomla core module)
  • Menu (Joomla core module)

Of course you can install your own modules or components. But gold rule is one: less is more, also in security sector.

Module Manager View - with list of all used and published modules

Default Homepage Layout

Default homepage like all variants in demo of OneClip template were created using SP Page Builder Pro component. The following screenshot shows the layout of "Home" page (Corporate variant) with list of the addons used in the demo content configuration.

 Creative HomePage Variant

The following screenshot shows the layout of "Home" page (Creative variant) with list of the addons used in the demo content configuration. Whole layout was made using SP Page Builder Pro, included in Quickstart only.

 

App Landing HomePage Variant

The following screenshot shows the layout of "Home" page (App Landing variant) with list of the addons used in the demo content configuration. Whole layout was made using SP Page Builder Pro, included in Quickstart only.

App landing homepage - Joomla 3.6

 

Newsletter