Matisse Documentation

Get Support

INTRODUCTION

Matisse – Creative WordPress Theme

Created: 21.09.2015
Latest Update: 21.09.2015
By: Umbrella
Email: info@umbrella.al

Matisse Thumbnail

We present you Matisse. A plain clean WordPress theme designed for one purpose in mind: Show off.

Show off your portfolio, present your best artwork on a creative way which still holds a corporate touch on itself. Plenty page templates that make Matisse great for both agencies and freelancers. The project page offers you both case study for bigger projects and slider for larger high resolution images.

You can use the theme for whatever your purpose is, but we reccomend it to: – Designers, Architects, Photographers, Conceptual Artists etc

FEATURE LIST

Responsive Design
4 Header styles (Default, Top Slide, Right Slide, Fullscreen)
2 Logo Types (Image, Text)
Retina Display
Social Networks
2 Skin types (Light, Dark)
Brand Color selector
Google fonts
Font Awesome
12 Page templates (Default, About, About me, Blog, Clients, Contact, Home, Services, Team, Team 2, Testimonials, Works)
Including search page, archive page, 404 page
6 Display Portfolio Grids
2 Post types (Post, Portfolio)
5 Post formats (Standard, Image, Gallery, Video, Audio)
2 Portfolio types (Slider, Case study)
Footer Sidebar
4 Custom widgets
Shortcode Generator (Build Shortcodes easily using our UI)
Dummy Content Included
PSD files included
Child Theme Ready
SEO friendly HTML5 Markup
Translation Ready (.mo and .po files included)
Powerful Option Panel(Theme Settings, Header, Footer, Branding)
Video Support on sliders
Build with Bootstrap 3, masonry, animate.css, Royal-slider etc.

SETUP

Just upload matisseUmbrella.zip via theme uploaded on your wp-admin and you’re ready to go.

If you get any error after you installed the theme than this could happen:

1.Because you uploaded the theme as a Folder and you where using FTP Text Mode, use Binary Mode instead

2.Or delete the Theme folder and install .zip file which is in this package

For any unknown reasons there is a problem uploading and installing the theme, please contact Umbrella support team.

Step 2

IMPORTING CONTENT

We have placed a demo .xml file and you can use that to import the Demo content on your site. To do so we strongly recommend to have a fresh copy of WordPress with no Content at all, or you can download WordPress Reset plugin and reset your WordPress content.

This is because you might have Pages and Posts with the same ID (which usually occurs when you do the import process multiply times) and your current pages together with Demo pages will make your back-end a mess.

So go to Tools – Import and click WordPress, there should be a Dialog asking you for permissions to install the Import Plugin.

After the plugin get installed, on the File Dialog point the demo.xml file which is located at the Package File you got from Themeforest.After you pointed out the Demo XML click “Upload and Import”.

2014-10-13_1914

2014-10-13_1916

THEME SETTINGS

Theme settings- Is separated in 4 section (Theme Settings, Header, Footer, Branding). In each of those section you can find specific options and configuration. Other options for pages are inside the specific area (pages, posts etc)

Theme settings

The Main settings area is separated in 2 tabs (404, custom code)

404 Tab

Back to home page label text

404 Background image

Background image overlay

Custom code

Add custom css

Add custom javascript

Header

Header-Settings

Choose menu type

Fav icon – Add website favicon

Logo Type – Choose logo type

Logo – Add logo as an image

Logo – Add logo as text

Retina Logo – Make retina logo

Logo Font – Choose logo font

Logo Size – Choose logo size

Logo Color – Choose the color of the logo

Footer

FooterSettings

Footer Text – Add the footer text

Social networks – Add social networks

Branding

Skin – Choose website skin

Brand color – Choose brand color

Website Font – Choose the website font

Disable effects – Disabling in scroll animations and effects

HOW TO CREATE THE MAIN MENU

Matisse has one (The main) menu that you can set.

The options for the main menu styles are in Theme options->Header

The steps to create a menu are:

Menus can be found in appearance->menus
1. Create a menu.
2. Add items to menus
3. Go to manage locations
4. Select the menu
5. Click save

HOW TO CREATE A PAGE

Go to Pages and create a new page post by clicking on “Add New” button.

Add the Page title and its featured image

Select the template for the page and start configuring the fields for that page

PAGE & TEMPLATES

Matisse has 12 page templates. All of them has their own options and styles for you to create your own unique website.

For each template the options are listed below

Default Page

page

Overlay – Add overlay to featured image

Enable Scroll Icon – Enable scroll icon on slider

Enable footer sidebar – Enable footer sidebar on page

About

About template is separated in 4 tabs (Slider, Content, Staff, Page options)

Slider Tab

aboutSlider

Slider – Add image/video slides with a text and a link

Overlay – Add overlay to slide

Autoplay slider – Allow slider to auto play

Delay – Autoplay delay in milliseconds

Disable Slider – Disable slider

Content Tab

Title – Add title

Short description – Add short description

Content – Add content

Image – Add image

Partners – Add partners near the content

Layout – Choose content layout

Staff Tab

aboutStaff

Staff – Add staff members with their Name, position, social network, image

Page Options Tab

Enable Scroll Icon – Enable scroll icon on slider

Enable footer sidebar – Enable footer sidebar on page

 

About Me

aboutme

Name label – Add the name label

Position label – Add the position label

Short Description – Add a short description

Overlay – Add overlay to featured image

Enable Scroll Icon – Enable scroll icon on slider

Enable footer sidebar – Enable footer sidebar on page

 

Blog

blog

Page Description – Add page description

Featured Posts – Choose maximum 3 featured posts

Display type – Choose how to display posts in page (All , Categorized)

Overlay – Add overlay to featured image

Enable Scroll Icon – Enable scroll icon on slider

Enable footer sidebar – Enable footer sidebar on page

 

Clients

clients

Clients – Add clients / partners

Overlay – Add overlay to featured image

Enable footer sidebar – Enable footer sidebar on page

Contact

Contact page is separated in 3 tabs (Map, Contact form, info and options)

Map Tab

map

Disable Map – Check to disable google map

Zoom level – Available levels from 0 to 19

Disable zoom – Disable zoom in map

Custom Marker – Add custom marker

Map – Google map

Contact Form Tab

contactForm

Receiver’s email – Add the receiver’s email address

Disable contact form – Check to disable contact form

Contact form short code – Contact form shortcode  Note: use this field for plugins that use shortcode for contact forms

Full name label – Full name – contact form label

Email Label – contact form label for Email

Phone Label – contact form label for  Phone

Message Label – contact form label for  Message

Rest Label – contact form label for Reset button

Send Label – contact form label for Send button

Success Message – contact form label for Success Message

Fail Message – contact form label for Fail Message

Info a options tab

contactDetails

Add contact information

Enable Scroll Icon – Enable scroll icon on map

Enable footer sidebar – Enable footer sidebar on page

 

Home

homeSlider

Slider – Add image/video slides to page

Overlay – Add overlay to slider images

Autoplay slider – Allow slider to auto play

Delay – Autoplay delay in milliseconds

Hide Thumbnails – Hides the slider thumbnails

Enable footer sidebar – Enable footer sidebar on page

Services

Services – Add service with title, image, content

Overlay – Add overlay to featured image

Enable footer sidebar – Enable footer sidebar on page

Team 1

team

Team – Add team members with images, social networks, name, position

Enable footer sidebar – Enable footer sidebar on page

Team 2

team

Team – Add team members with images, social networks, name, position

Enable footer sidebar – Enable footer sidebar on page

Testimonial

Testimonial – Add testimonial with image, content , author

Overlay – Add overlay to featured image

Enable footer sidebar – Enable footer sidebar on page

Works

works

Featured Portfolios – Select featured portfolios

Display Type – Choose how to display portfolios

Sort Type – Choose how to sort portfolios

Enable Scroll Icon – Enable scroll icon on slider

Enable footer sidebar – Enable footer sidebar on page

HOW TO CREATE PORTFOLIOS

Go to Portfolio and create a new portfolio post by clicking on “Add New” button.

Add the Portfolio title, content and its featured image

Options for portfolio are listed below:

portfolios

Layout – Choose layout (Case study, Slider)

Case study – Cover Image – Add cover image

Portfolio – Add images or videos

Enable footer sidebar – Enable footer sidebar on page

 

HOW TO CREATE POSTS

Go to posts and create a new post by clicking on “Add New” button.
Add a post title and it’s content. Be sure to add a featured image to each post so they can be listed on blog page.
From the right sidebar you can select the format of the post. It can be Standard, Image, Video and audio.
Post Formats

postFormat

Each post format has its own fields that are used for that post

Categories
Create categories by pressing on “+ Add New Category”.
Then check any or multiple categories for the post. Categories will be used to filter posts and also manage the posts by categories.
Tags
You can also add tags to posts to make them more SEO friendly and help users while surfing on your site.

Here are some general post fields:

singleFields

WIDGETS

Matisse has  4 custom widgets

Information  – In this widget you can display as many information as you want with the proper icon. It is basically used for contact information but it can be used also for other information details

Instagram – This widget will display your latest instagram images. It needs your user ID and the access token to connect with instagram. To get them please visit

https://instagram.com/developer/authentication/?hl=en

Social Network – In this widget you can display social networks and link them so the user can access them

Twitter widget – This widget will display the latest tweets form a twitter page. It need some authorization to connect with twitter. To get them please visit

https://dev.twitter.com/oauth/overview

HOW TO USE THE SHORT-CODE GENERATOR

In every content from wordpress created or custom content (WYSIWYG) you can use our short code generator.

If you want to add toggles, tabs, buttons, notifications just click on the icon in the content and the shortcode generator will appear.
Ex: If you want to create tabs, just click on the icon and when the shortcode generate appears click on “Add row” and the fields will appear. Fill those fields and when you are done just click on get shortcode.

7

HOW TO TRANSLATE THE THEME

First you need to know if you want to use multilingual or just in one language.

If you want to use the theme with multi languages the best choice would be wpml plugin
If you want just to translate the theme then you can use the po files.

To use the po files you need to use the poedit application and open the po file that is located in the lang folder.
After the translation is done save the file and you need to define that translation in wp-config.php so the next time the site loads it will load with the new translation
It needs a line of code in wp-config.php
define (‘WPLANG’, ‘um_lang’);

HOW TO GET THE PSD FILES

There are two options to get the psd files.

Go to http://themes.umbrella.al/psd/
And add the purchase key.

Or contact the umbrella support team and request the psd files.