This document covers the installation and use of this theme and reveals answers to common problems and issues - I encourage you to read this document thoroughly if you are experiencing any difficulties.
To install this theme you must have a working version of WordPress already installed. For information in regard to installing the WordPress platform, please see the WordPress Codex - http://codex.wordpress.org/Installing_WordPress
Firstly, unzip the Memento_WordPress_Theme.zip file to a directory on your computer. It contains a folder named memento.zip file. Open this archive and upload the memento folder to your server via ftp to the /themes/ directory on your Wordpress installation. (wp-content > themes)
Go to your Wordpress admin, and in the Appearance-panel, choose Add New Themes. Click Add new. Upload the memento.zip. Not upload the Memento_Wordpress_theme.zip file, but only the memento.zip file, if you have a "missing stylesheet" issue you are uploading the wrong file!
Installing WordPress http://codex.wordpress.org/Installing_WordPress
Once you have uploaded the theme, activate your theme in Appearance > Themes.
Using Themes http://codex.wordpress.org/Using_Themes
You can install sample content by importing our live preview settings, that you can find in our support forum.
You can also import all images we used for our live preview (except the images taken by Fotolia with a regular license, we can't redistribuite them)
To start with Meménto Theme you have to:
It's important that Wordpress is set up to display a static page as home page. You set this in Settings > Reading. Chose 'static page' and select the page you created for the home in the select menu.
The theme has a lot of slideshow-variants to choose from.
After this go in Appearance > Theme Options > Sliders tab. In "Configure slider" chose the slider you want to set and click on the configure button
Now, in the "Slides" tab you can:
In the home page you can play with a lot of features.
You can set the page using:
In the support forum you can find a lot of videotutorials that can help you to set the home page, the sliders and you can also learn how we make the home pages of our live preview. Follow this topic to verify your purchase and access to the support forum!
You can set how many rows use for your footer and set the style for the footer layout.
Shortcode to display the social icons
[social type="facebook" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="twitter" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="skype" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="google" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="linkedin" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="flickr" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="quora" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="lastfm" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="dribble" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="pinterest" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="deviantart" href="#" target="_blank" color="#000" hover="#00f" size="45px" ] [social type="yahoo" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="youtube" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="wordpress" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="vimeo" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="blogger" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="myspace" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="tumblr" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="apple" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="behance" href="#" target="_blank" color="#000" hover="#00f" size="45px"] [social type="bing" href="#" target="_blank" color="#000" hover="#00f" size="45px"]
In the home v.1 we use a footer with 3 widget areas. In this areas we used:
You do not need to enter any content on this page. This will be your blog index page, and will list your blog posts in chronological order.
You can customize the layout and appearance of the blog page in Appearance > Theme options > Sections> Blog Settings:
In Appearance > Theme Options > Home page > Blog you can set the options for the Blog in home page: how many articles to show, the title for this section and so on.
NOTE: In Appearance > Widget you can find the preset sidebar for the blog page. Drag and drop the widgets in the Blog sidebar to customize the sidebar of your blog.
Portfolio-posts are custom post types, and can be categorized.
To create your portfolio page:
Then, change the settings of the preset portfolio:
NOTE: In Appearance > Widget you can find the preset sidebar for the portfolio page. Drag and drop the widgets in the Portfolio sidebar to customize the sidebar of your portfolio page. You have to use the "More Projects" widget if you want to use the full description portfolio or another type of portfolio.
In this theme you can create unlimited portfolio.
In the support forum you can find a videotutorial that can help you to set your portfolio. Follow this topic to verify your purchase and access to the support forum!
Gallery page is made by custom post types and is very easy to set.
NOTE: In Appearance > Widget you can find the preset sidebar for the gallery page. Drag and drop the widgets in the Gallery sidebar to customize the sidebar of your gallery pages. If you use the filterable gallery, you have to use the "Gallery categories" widget!
Then you can create your gallery:In theme options > sections > gallery you can find the other settings for the gallery. You can turn on/off the horizontal filterable effect, turn on/off the gallery in the home page and so on.
[testimonials]
to display all testimonials;
In this theme you can create unlimited contact form.You can create a default contact form, like the form in our live preview, or a custom form.
Create a custom contact form
%field%
in the body of the e-mail (Contact Form Configuration). For example, if you add a field phone, in the body you have to add %phone%
.Create a default contact form
NOTE: If you'd like to use left floated input fields you could add the class [code]full[/code] to each field: click to "Edit" and add [code]Full[/code] in the Class form, as shown in the pictures below.
Also, if you want to enter a small icon inside the field, in the "icon" field add the name of the icon, for example [code]icon-user[/code>.
Faq page is made by custom post types and is very easy to set.
[faq]
in the editor of the page;Follow the same procedure for all your faqs.
In our live preview, in the Faq page we have the faqs and a shortcode with a call to action for the customer support. The code is:
[faq] [border] [call title="Not found the <span>answer?</span>" incipit="feel free to contact our customer service for free support" phone="800.034.881"]
Have different pages with different FAQS
[Faq]
shortcode, use the shortcode [faq category=""]
and inside the "" enter the slug of the category you want to chose (example: [faq category="shipping-questions"]
).
In this way you can create unlimited faqs page to display different faq categories. You can also use more categories in the shortcode, using the "comma": [faq category="shipping,discount"]
This is a list of some shortcodes of this theme. Insert this code in the editor of your page.
In the support forum you can find a videotutorial that can help you to use the shortcodes. Follow this topic to verify your purchase and access to the support forum!
Border (use it to separate the content with a border)
[border]
Space (use it to add some space between the elements)
[space]
Clear (use it after columns and icon boxes)
[clear]
Call to action
[call title="Not found the answer?" incipit="feel free to contact our customer service for support" phone="800.034.881"]
Dropcap
[dropcap]your text[/dropcap]
Quote text
[quote]your text[/quote]
Highlight text
[highlight]your text[/highlight]
Styled lists
[list type="star"] <li>item</li> <li>item</li> <li>item</li> [/list]
Symbols: Star / arrow / check / add / info
Success box
[success]your text[/success]
Arrow box
[arrow]your text[/arrow]
Alert box
[alert]your text[/alert]
Error box
[error]your text[/error]
Notice box
[notice]your text[/notice]
Info box
[info]your text[/info]
Custom buttons
[button_icon icon="arrow|arrow-left|calc|gift|offer|remove"]your text[/button_icon]
Custom buttons with left icons
[button_icon icon="arrow|arrow-left|calc|gift|offer|remove" sense="rtl"]your text[/button_icon]
Big colorful buttons
[button color="green|blue|magenta|red|orange|yellow" width="large" href="#"]your text[/button]
Small colorful buttons
[button color="green|blue|magenta|red|orange|yellow" width="small" href="#"]your text[/button]
500+ different buttons! Check this page for all color variants. You have to take the color name without the
.btn-, for example:
.btn-view-over-the-town-3
Code of the button with this color:
[button color="view-over-the-town-3"]Text under the button[/button]
Add also an icon to the button, using this icons! You need to take only the name of the icon, without the icon-
text.
Some examples:
[button color="ultraviolet-rays-1" icon="user"]User[/button] [button color="indian-night-5" icon="refresh"]Refresh[/button] [button color="identification-4" icon="shopping-cart"]Checkout[/button] [button color="hem-5" icon="trash"]Delete[/button] [button color="indian-night-5" icon="comment"]Comment[/button] [button color="indian-night-5" icon="cogs"]Settings[/button] [button color="friends-and-foes-2" icon="info-sign"]More info[/button]
Attributes:
href
- Url address of the link of the buttoncolor
- Color of the button, example color="view-over-the-town-3"
icon
- Name of the icon you want to add, example icon="info-sign"
size
- Size of the button, example size="14px"
icon_size
- Size of the icon, example icon_size="14px"
Icon boxes
[section icon="bag" title="your title"] your text [/section]
Icons:
Tick / bag / pictures / letter / box / bubble / bulb / calendar / cart / chart / clipboard / coffee / diagram / doodles / gear / info / globe / gift / label / moleskine / monitor / mphone / news / open / pc / pencil / phone / postit / qmark / refresh / shopbag / statistics / testimonial
Icon boxes (black style)
[section icon="card-black" title="Your Title" title_size="h4"] your text [/section]
Icons: card-black / brush-black / monitor-black / chart-bar / box / case / chart-line / bookmark / checkbox-checked / phone-black / contact / info /
Tabs
[tabs tab1="Tab 1" tab2="Tab 2" tab3="Tab 3"]
[tab id="tab1"]This is tab1[/tab]
[tab id="tab2"]This is tab2[/tab]
[tab id="tab3"]This is tab3[/tab]
[/tabs]
Toggle
[toggle title="This is title"]Your Content...[/toggle]
Price box
[price title="Standard Plan" price="45.0 $" href="#" buttontext="More info" color="white"] <li>Morbi est elit, imperdiet sit amet</li> <li>Lorem ipsum seget, egestas in leo.</li> <li>Morbi est elit, imperdiet sit amet</li> <li>Lorem ipsum seget, egestas in leo.</li> [/price]
Table
[table color="white"] <table style="width: 100%;" cellspacing="0" cellpadding="0"> <thead> <tr> <th style="width:20%"></th> <th style="width:20%">Free</th> <th style="width:20%">Mini</th> <th style="width:20%">Standard</th> <th style="width:20%">Premium</th> </tr> </thead> <tbody> <tr> <th class="features">Features 1</th> <td>1</td> <td>unlimited</td> <td>[x]</td> <td>-</td> </tr> </tbody> </table> [/table]
Youtube video
[youtube width="640" height="385" video_id="wSBIcNmCAX0"]
Vimeo video
[vimeo width="640" height="360" video_id="3109777"]
Dailymotion video
[dailymotion width="640" height="360" video_id="xgis0k"]
Dailymotion video
[dailymotion width="640" height="360" video_id="xgis0k"]
Nivo slideshow
[slider effect="random" width="640" height="380"]
wp-content/themes/bolder/images/nivo-slider/001.jpg
wp-content/themes/bolder/images/nivo-slider/002.jpg
wp-content/themes/bolder/images/nivo-slider/003.jpg
wp-content/themes/bolder/images/nivo-slider/004.jpg
wp-content/themes/bolder/images/nivo-slider/005.jpg
[/slider]
Effects: sliceDown / sliceDownLeft / sliceUp / sliceUpLeft / sliceUpDown / sliceUpDownLeft / fold / fade / random / slideInRight / slideInLeft / boxRandom / boxRain / boxRainReverse / boxRainGrow / boxRainGrowReverse
Feed slider
[feed_slider]
url
- Feed Url, XML filenumber
- number of feeds you want to showMembers only content - private content
[members_only]
role
- who can see this content?chose from administrator, editor, author, contributor, subscriber. message
- Il messaggio da mostrare nel caso l'utente connesso non abbia il livello necessario a vedere il contenuto. Opzionale
Example of the code:
[members_only role="subscriber" message="You must be a registered user to see this content!"]this is the private content[/members_only]
To stylize your images, add lightbox effect and so on:
[image size="small" lightbox="true"]http://url.to/image.jpg[/image]
Recent posts
[recentpost items="3"]
Popular posts
[popularpost items="3"]
Google map
[googlemap src="" width="300" height="280"]
Social icons
[social type="facebook|rss|twitter|youtube|yahoo|vimeo|flickr|blogger" href="" title=""]
Testimonial slider
[testimonials_slider speed="500" timeout="7000"]
Newsletter form
[newsletter_form action=""
method="GET|POST"
name="fullname"
email="email"
name_label="your name"
email_label="your name"
submit="Subscribe"]
In this theme you find 9 preset sidebar:
The default sidebar is the preset sidebar that you can find in your pages when you set a page with "sidebar right or left" layout without to select a sidebar to assign.Put a widget in the default sidebar to display it in your page instead of the static wordpress sidebar with blogroll,search and so on.
You can also create unlimited sidebar:
12 custom widgets are provided with the theme. These are:
This theme is ready for localization via .po/.mo files, and works with the WPML plugin.
If you are not familiar with translating Wordpress themes, I recommend reading this article: http://codex.wordpress.org/Translating_WordPress
This theme uses wp-nav-menu for building menus. You find this in Appearance > Menus.
For more info on how to setup your menu in wp 3.0, see http://codex.wordpress.org/Appearance_Menus_SubPanel
When you added all pages to your menu, you can drag/drop and order pages.
If you want to add a small icon with your navigation link, add a icon shortcode inside the square parenthesis near to the Navigation Label:
In this page you can find the list of the icons you can use.