Regain Documentation


Theme Installation

Welcome to Northeme Theme Documentation!

This documentation covers installing and setup your theme and how to use theme features. Assuming that you already have a domain name (E.g. example.com) and web hosting service that WordPress has been installed on it.

If you’ve already installed WordPress, sign in to northeme.com and head to My Account page in order to download your theme.

My Account page lists the themes you’ve purchased. Click Download button to access theme related files and documentation.

Click Download Theme File to download the theme as a zip file. Theme License / Product Key should be entered to Northeme > Theme Update section in order to receive auto-updates.

Option 1 : WordPress Theme Installer

The most convenient and easiest way to install your theme is to use WordPress Theme Installer.

  1. Sign in to your WordPress’ admin area and go to Appearance > Themes. You’ll find the list of themes that have already been installed to your WordPress. Click to Add New button which is located right beside the Themes title.
  2. Next page will be listing the free themes that are being provided by WordPress along with Upload button that allows to upload custom themes. Click to upload button and select the theme zip file that you’ve downloaded from My Account page.
  3. Once the installed, you’re supposed to activate it to start using. Go back to Appearance > Themes and you should be able to see your theme in the installed themes list now. Simply click on Activate button to finalize installation.

Option 2 : Installing via FTP

This is less convenient yet another easy way to install your theme.

Some web hosting companies may keep file upload limit as low as 2MB and therefore you may not be able to install theme file via WordPress Theme Installer (You may ask your hosting provider to increase upload limit).

But there is nothing worry, you can still install the theme via FTP.

  1. First thing you need is your web hosting’s FTP credentials to connect FTP. You can ask this to your web hosting provider if you don’t know it yet.
  2. Afterwards, you’re supposed to use a FTP client to access and browse your website’s FTP content. We recommend to install Filezilla which is multiOS supported and free FTP client :
    https://filezilla-project.org/
  3. Connect to your website’s FTP through Filezilla and go to “wp-content/themes” folder. Upload the unzipped theme folder (unzip the downloaded theme zip file) into themes folder.
  4. Once the entire theme folder is uploaded, you’re supposed to activate it. Go back to Appearance > Themes on your WP dashboard. You should be able to see your theme in the installed themes list now. Simply click on Activate button to finalize installation.

Important : Installation via FTP may require to set file permissions to 755 (read / write). Check WordPress Help for more information.

Installing Live Demo (Premium only)

Installing live demo allows to install theme live demo content on to your WordPress.

Theme live demo has been provided as XML file. You can download it from My Account page on northeme.com by clicking on Download button and select the Live Demo XML.

In order to install XML file, select Tools > Import from your WP dashboard and select WordPress. Install WordPress Importer plugin if WordPress asks you to install and it hasn’t been installed yet. Upload XML file and import everything.

Leave “Download and import file attachments” option unselected if your hosting doesn’t allow you to download large files.

Registering Theme (Premium Only)

Theme registration is important to get automatic theme updates.

Head to Northeme > Theme Updates section and enter your Northeme account e-mail and product key. Once it’s set, you’ll be notified whenever a new update released and you’ll be able to update your theme by single click.

If you need any further information about installing themes please see the following article :
http://codex.wordpress.org/Installing_WordPress

Creating a Page

Pages can be created / managed under Pages menu on your dashboard. Pages is one of the primary sections that allows to build your website’s content.

Click to Add New page to create a new page.

Page Templates

Click to Add New page to create a new page. Some of our themes may offer exclusive page templates other than Default Page.

  • Default Page is a full width page versatile template and it’s the template that you’re supposed to use in most cases. Enable Sidebar option is also provided in order to create a page with sidebar widgets. Page Sidebar can be managed at Appearance > Widgets section. In case you wish to use wrapper shortcodes to build variable width content, Full Width option is provided. Full Width option removes default 1280px container and allows to use the page in full width.
  • Blog template is blog posts listing page. Select this template if you want to create a page that displays all blog posts.
  • Works (Premium only) is also similar to Blog template and allows to create a page that lists all Portfolio posts.
  • About / Contact (NEW) allows to build a contact, about or team members page. You can use all content together or build individual pages.

Additionally Enable Big Heading (Premium only) option is provided. Activating this option will disable page header and will use excerpt instead.

Bottom Editor

Bottom Editor is available yet optional for Blog and Works templates in order to display content beneath the posts grid.

Excerpt

Excerpt field is one of default fields of WordPress and it’s pretty useful field for Regain. If you cannot see excerpt field, activate it by clicking Screen Options button on the top right and opt-in for excerpt. Page and post excerpts will be displayed right below the title if it’s set.

We recommend to use a rich text excerpt plugin such as :
https://wordpress.org/plugins/rich-text-excerpts/

Custom CSS (Premium Only)

Add Custom CSS rules that will be applied to this specific page only.

About / Contact Template

In order to use this template, select About / Contact from Page template. Once it’s selected, Team and Contact panels will appear.

Team panel allows to add single or multiple elements and reorder them. Each element allows to enter name, job title and description. You can use a single element for building an about page or use multiple elements to create a team members page. Also multiple columns option is available to change layout type.

Contact panel allows to add Google Map, contact form and address info. It’ll appear bottom part of the page if activated.

Each section is optional and can be used altogether to build a common page for about / contact info as well as build individual pages.

Blog

Blog posts can be managed under Posts section at dashboard.

Blog also requires a posts listing page. If you haven’t created a blog posts listing page yet, go to Pages and create a page with Blog Template.

Creating a new post is pretty straight-forward process by setting title and content. Also post excerpt is being used as a secondary title that appears right below title. Excerpt will also be displayed posts listing page as well.

 

Content Width Limiter Shortcodes

Post content width is 650px by default and your entire content will be displayed within main container. In order to use larger container inside a post such as full width image or WP gallery, you’re supposed to use Content Width Limiter wrapper shortcodes :

** Regain Blog doesn’t have variable with option and only allows to use [wrapper] [/wrapper] for full width.

You have content here. Wrapper shortcode can be used anywhere in the visual editor and doesn’t have to be in between or beginning of content.

[wrapper]

My Content / image / video etc. here. Wrapper is 100% wide by default.

[/wrapper]

Your content goes on…

[wrapper width=”image”]

Image width is around 750px to standout your content from main text.

You can use text, image, large, full options as width.

[/wrapper]
[wrapper width=”80%”]

You can also use a custom value as 80% or 800px to customize width

[/wrapper]

Featured Image / Video

Three options provided : Thumbnail, Animated Gif and Video

Thumbnail is default option and also provides optional hover image field. If hover image uploaded, it will show up on hover action.

As for Animated GIF, it’s provided separately in order to display unprocessed original image.

Video supports Youtube, Vimeo URL or embed code directly. You can also use built-in slider shortcodes on this field to display slider as featured image.

Animated Gif and Slider options are only available for Regain premium version

Blog View Options

Blog View Options can be managed at Northeme > Post Layout. You can manage posts listing page settings such as post limit, layout, pagination type and related posts.

Regain Blog (Free Version) offers layout option only.

Works

Works post types comes with your theme to build a portfolio.

In order to list Works posts, you’re supposed to create a posts listing page. If you haven’t created yet, add a new page with Works template at Pages.

Works located right below Posts on your dashboard.

Use Add New Project button to create a new project. Categories are dedicated taxonomy of Portfolio.

Re-Order menu allows to re-organize category and posts ordering by drag&drop interface.

Add New Project

In order to create a new project, go to Add New Project and set a title for your project. Excerpt can be used to define for a sub title and also posts listing page.

 

Composition

Add / Edit Project page offers an exclusive meta box called Composition (Media).

You can use visual editor to build content yet Composition section aims to make easier adding, re-ordering and arranging project assets through a series of options :

  • Insert : This is a dropdown menu includes Image, Video, Text and Slider to add media into the composition. Multiple image upload is allowed.
  • Lightbox : Switching on this option activates lightbox for each image in the composition

Also each element in the composition has individual options panel :

  • Column : By default images will be displayed in maximum width. If you want to display more than one object in a row, this option allows to display the element in Default, 1/2, 1/3, 1/4, 2/3 measures.
  • Image Caption (Image) : Display caption below the image
  • URL (Image) : Assign an URL to image
  • Single row : You may prefer to use smaller column type than default such as 1/2 or 2/3. If this option is activated, this particular will clear other elements coming before and after regardless their column type.

Featured Image / Video

Three options provided : Thumbnail, Animated Gif and Embed Video / Slider

Thumbnail is default option and also provides optional hover image field. If hover image uploaded, it will show up on hover action.

As for Animated GIF, it’s provided separately in order to display unprocessed original image.

Video supports Youtube, Vimeo URL or embed code directly. You can also use built-in slider shortcodes on this field to display slider as featured image.

Works View Options

Works View Options can be managed at Northeme > Posts Layout. You can manage posts listing page settings such as post limit, layout, pagination type etc.

Navigation Menus

To create a navigation menu, go to Appearance > Menus and click Create a New Menu link.

You’ll find accordion menu that contains pages, posts, categories, links (custom URL) helper menus to add items to your menu.

Once a menu is created, it must be activated from Display Location. Opt-in for Northeme Main Menu in order to activate it.

Your theme offers Classic Menu option that can be setup at Northeme > Layout. Please note that Classic Menu does NOT offer multi-level menus.

As for multilevel menus, parent menu cannot have an URL. Clicking a parent menu shows sub menu items. Therefore, you may prefer to add a clickable sub item menu. Simply use pound sign (#) as Custom Link’s URL in order to use it as parent menu.

Example :

Portfolio
– All
– Graphic Design
– Illustration

All sub menu item should be added since Portfolio is not linkable item

Wordpress offers extensive options to add new items to your menu. To expand these options, click on Screen Options button that is located at top right of the screen and opt-in for the sections.

For more information about custom menus, check out the following link :
http://codex.wordpress.org/Appearance_Menus_SubPanel

Widgets / Sidebars

Sidebars are tools to add widgets to your pages.

Your theme offers Footer and Page Sidebar and they can be managed at Appearance > Widgets on dashboard.

Footer Widgets

Footer widgets are located as 3 columns on the left side of the footer. It’s recommended to use up to three widgets yet if you use more than three widgets, they will be stacked on the left side of the footer.

nor_245

Setting up Front Page

Visit Settings > Reading page on your dashboard, switch to A static page at Front Page Displays. Select a page from Front Page select box and click Save Changes to set it as home page / front page. Leave Posts Page option unset.

Please note that in order to set a page as home page it must be present at Pages. That being said automatically generated pages such as archive, category or single posts cannot be set as homepage.

Sliders & Galleries

 Built-in Sliders

Built-in Sliders is lightweight solution to build simple sliders.

Slider / Gallery Manager is located at Sliders menu on your dashboard. You can create unlimited sliders and use them via shortcodes.

Create a New Slider / Manage a Slider

Click Add New Slider button or Edit link of a present slider to build a slider.

Slider editing page offers Image and Video buttons to add media to the slider. Embed videos allowed from 3rd party video providers such as YouTube, Vimeo etc. along with WordPress video player for self-hosted videos.

Slider images will be displayed in a lightbox if an image is clicked. Disable Lightbox option allows to disable this action.

Once a slider created, you can add it to any post or page’s visual editor via shortcode. Corresponding shortcodes can be seen on listing page and slider editing page. E.g.

Slider Settings

Slider settings can be managed at Northeme > Plugin & General Options section. Animation speed, icon speed and various settings can be adjusted.

Post & Category Re-ordering

Portfolio and Blog posts can be reordered at Re-Order page which is located under the corresponding post type menu (E.g. Portfolio > Re-order).

Post re-ordering is not being provided for blog posts and they will be re-ordered by date descending as in default.

Categories and taxonomies can also be re-ordered in this section.

Drag&Drop Ordering

Drag&drop your posts and categories to re-order them. Custom Ordering must be selected to apply custom ordering settings. Otherwise select Order by Title, Order by Date (descending) or Order by Date (ascending).

Blog posts cannot be re-ordered.

Translation / Multi-Language

Your theme is ready to translate. Default language files are located in languages folder inside the theme folder. We highly recommend using a child theme and copy languages folder into child theme directory. Using a child theme is required to maintain your changes after theme updates. See Child Theme & Customizations section of this documentation.

In order to activate the new language, rename language files with WordPress Locale code (E.g fr_FR.po and fr_FR.mo). Then, change Settings > General > Site Language to your language and WP_LANG code to wp-config.php file :

define ('WPLANG', 'fr_FR');

 

To translate default language files, you’re supposed to use a 3rd party editor. POEdit is most popular and free option to edit po / mo files:
http://www.poedit.net

As a on-site solution, Loco Translate WordPress Plugin is a great solution to translate the theme from your dashboard instead of working with language files :
https://wordpress.org/plugins/loco-translate/

 

Multilingual Plugins

Our themes are fully compatible with WPML multilingual plugin.

WPML

WPML is one of most popular WP multi-language plugins can be downloaded from WPML website :
http://wpml.org

By default, all post and pages are available to translate and no action required. As for custom post types and particular fields :

  • Custom Post Types : Portfolio and other post types created from Northeme > Appearance > Custom Post Types must be activated first. Go to WPML > Translation Options and select “Translate” for the post types and taxonomies under Custom Posts and Custom Taxonomies sections.
  • If you wish to translate fields such as Tagline, Footer text that are located under Northeme menu at your WP dashboard, you’re supposed to use shortcodes. Your theme offers WPML translation shortcodes – [wpml_translate] – to add multiple translation into those fields.For example :
    [nor_translate lang=’en’]English Footer Text[/nor_translate][nor_translate lang=’es’]Spanish Footer Text[/nor_translate]

 

 

Child Theme & Customization

IMPORTANT :

  • Never modify theme files directly. Always use a child theme to make modifications on theme files to maintain the changes after theme updates.
  • Unfortunately we cannot offer support for customizations. Theme issues caused due to customizations are out of the scope for theme support.

Northeme Framework offers a section for adding custom CSS and Scripts at Northeme > Theme Options > Custom CSS & Scripts.

You can add custom styling rules into Custom CSS to override default theme stylings. Although we offer extensive modifications features at Northeme > Theme Options, it may help for further modifications. You can use Google Chrome’s Inspect Element feature to find out specific classes.

Also, you can install and use CSS modification plugin, SiteOrigin CSS :
https://wordpress.org/plugins/so-css/

Custom Scripts field is offered in order to add scripts into <head> tag. That allows to include any 3rd party or your own scripts to the page :

/* Typekit import */
<script src="//use.typekit.net/XXXX.js"></script>
<script>try{Typekit.load();}catch(e){}</script>

/* Including your custom JS or CSS files without using a child theme */
<link rel="stylesheet" href="/path/to/my_css_file.css" type="text/css" media="all" />
<script type="text/javascript" src="/path/to/my_js_file.js"></script>

 

Using a Child Theme

Download blank child theme template from My Account section on northeme.com and upload it into wp-content/themes folder. Before activating it, make sure that you’ve made the following changes :

  • Child themes cannot work without a parent theme. For example, if you want to install a child theme for Workality Plus, Workality Plus theme must be located in wp-content/themes folder.
  • Since child themes are dependent to a parent theme, you’re supposed to declare the parent theme folder name in child theme’s style.css file.

 

Check out following example :

Default child theme style.css file content should be looking as follows.
Make sure that Template value points to parent theme folder name (E.g. workality-plus-master or reframe-plus-master etc.)  :

/*

Theme Name: Workality Child Theme
Theme URI: http://northeme.com/
Description: Child Theme for Workality Theme
Author: Northeme.com
Template: workality-plus-master
Version: 0.1.0
*/

Shortcodes

Shortcodes are helpers to add rich content to visual editor. Your theme comes with button, alerts, icons, tabs, Google Map, columns and contact form shortcode and can be added through Shortcodes button that is located on visual editor panel :

nor_246

 

 

Content Width Limiter

Content Width Limiter shortcode is quite easy to use tool for managing content width. Selecting Content Width Limiter will add shortcode to the visual editor :

You have content here. Wrapper shortcode can be used anywhere in the visual editor and doesn’t have to be in between or beginning of content.

[wrapper]

My Content / image / video etc. here. Wrapper is 100% wide by default.

[/wrapper]

Your content goes on…

[wrapper width=”image”]

Image width is around 750px to standout your content from main text.

You can use text, image, large, full options for various container width.

[/wrapper] [wrapper width=”80%”]

You can also use a custom value as 80% or 800px to customize width

[/wrapper]

vv

 

Column Shortcodes

Your theme is built with 12 column grid system and Column Type option allows to choose how many columns will be displayed on a row. Half, Two Third, One Third options provided along with standard column count.

Google ChromeScreenSnapz040

 

Small Text / Caption

Wrap text or paragraph with Small Text shortcode to display text in smaller size. Secondary Text color will be used for small text.

Backup & Transfer

Backup

There are dozens of free backup plugins for WordPress out there yet we recommend UpdraftPlus which is one of the most popular backup plugin for scheduled backups :

https://wordpress.org/plugins/updraftplus/

 

Transfer

As for transferring / cloning your entire website, there are several WordPress backup / transfer plugins to make it. Duplicator is a free and easy-to-use option :
http://wordpress.org/plugins/duplicator/

Once the plugin is activated, go to plugin’s page at your dashboard and create a backup & installer. Afterwards upload installer file (install.php) and backup zip file to the root of your new web hosting and browse install.php with your favorite browser. Simply follow the instructions to complete cloning process. More information can be found at Duplicator’s website.

Please note that Duplicator may fail if you have large files to transfer. Although we suggest using Duplicator since it might be successful in most cases, we cannot offer support for transfer issues.