Sitesao

Urami Documentation

Welcome to our theme documentation. We encourage you to read through carefully while setting up the theme. Here you can find all detailed guide to get started with Urami theme and step by step tailor your website. Enjoy!

GENERAL

We would like to thank you for purchasing Urami. The theme can only be used with WordPress so we will suppose that you are using WordPress for your site. Otherwise, you can learn more about WordPress Information in next section. Before getting started, please make sure you have read carefully this documentation file with all the information and detailed guide you need to install and customize the theme to build your website.

If you are unable to find your answer here, we encourage you to search in our Support Forum. Your question or issue may be answered already. If not, you can post your questions there, our supporters will assist you promptly. Thank you, we hope you enjoy using Urami!

INSTALLATION

In this section, we will get started with technical requirement to use the theme properly and guide to install as well as update the theme in 2 ways.

WORDPRESS REQUIREMENT

Before installing this theme, you must have a working version of Wordpress already installed. To use our theme, please ensure you are running Wordpress 3.6 or higher, PHP5 or higher, and mysql 5 or higher.  If you need help installing Wordpress, follow instructions in Wordpress Codex. Below are some useful links for your WordPress information.

THEME PACKAGE

When you purchase our theme from Themeforest, you need to download Urami files from your Themeforest account. Navigate to your downloads tabs on Themeforest and find Urami. Click download button to see two options: the Main Files contains all the files and the Installable Wordpress Theme contains only the installable WordPress file. Below is the list of files included in the theme package:

DOWNLOADING THE MAIN FILES GIVES YOU ALL THE CONTENT LISTED BELOW

  • Installable and child files Urami.zip file is used to install the theme in WordPress. Urami-wordpress-child.zip file is for developers who want to make changes in code.

  • Documentation – Documentation files will provide you all information to install Urami.

  • Licensing – Lisence for theme and other items used on theme.

DOWNLOADING THE INSTALLALABLE WORDPRESS THEME ONLY GIVES YOU Urami.zip FILE

  • Installable File– Urami.zip file can be quickly installed via WordPress. If you install it via FTP, you need to unzip it first and use the extracted folder.

WORDPRESS INSTALLATION

There are two ways to install Urami in your WordPress site:  Wordpress Installation and FTP Installation

Before installing this theme, please make sure your have Wordpress already installed. For further guide to install WordPress, please find Wordpress Codex. To use our theme, please ensure you are running Wordpress 3.6 or higher, PHP5 or higher, and mysql 5 or higher.

Follow the steps below to install via Wordpress:

  • Step 1: Navigate to Appearance → Themes

  • Step 2: Click Add New then click Upload Theme button.

  • Step 3: Navigate to find the “Urami.zip” file on your computer and click “Install Now”.

  • Step 4:  Once upload, activate the theme. Go to Appearance→ Theme and activate it.

  • Step 5: Then you will see a notification message to activate the required & recommended plugins: Visual Composer plugins. The theme recommendeds the following plugins : Contact Form 7, Revolution Slider and Woocommerce.

NOTE: If you see this message “Are you Sure You Want To Do This” when installing Urami.zip file via WordPress, it means that you have an upload file size limit. Try to install the theme via FTP intead, or contact your host to increase the limit.

FTP INSTALLATION

Follow the steps below to install via FTP

  • Step 1: Login into your hosting space via an FTP software.

  • Step 2: Unzip the Urami.zip file and ONLY use the extracted Urami theme folder.

  • Step 3: Upload  the extracted Urami theme folder in to wp-content→theme folder.

  • Step 4: Activate the newly installed theme, Go to Appearance→ Theme and activate it.

  • Step 5: Then you will see a notification message to activate the required plugins: Visual Composer plugins. The theme recommendeds the following plugins : Contact Form 7, Revolution Slider and Woocommerce.

TRANSLATE THE THEME

Urami is compatible with WPML plugin, thus can be translated into multiple languages. Follow these useful links for detailed guide.

  • WPML Plugin site: WPML plugin is a popular paid plugin for translation. It supports over 40 languages that allows you to translate theme and plugin text to your language.
  • WPML English Support Forum: After buying the plugin, you will get great support from WPML team
  • Translate Widgets: Guide from WPML team to translate widgets

You can also use POEdit plugin for translation.

  • Step 1: Locate the .po file In folder "wp-content/themes/Urami/languages" .This file is basically a list of all the text strings used in the Urami Theme files. These text strings are in the English language, and can contain a translation for each text string.
  • Step 2: Open the file with POEdit and translate the texts into your preferred language.
  • Step 3: When complete, you’ll want to save the file twice, as two separate files – a .po file and a .mo file. When you save the files, you must name them according to your language code. Find a list of language codes at WordPress in your Language. As an example, the language code for English (UK) is en_GB, so you would save the translated files as urami-wp-en_GB.po first, then urami-wp-en_GB.mo.
  • Step 4: When that’s done, simply upload the files to WordPress Languages folder "wp-content/languages/themes/"

UPDATE THE THEME

You can update our theme using 1 of the two following:

  1. Update theme using Envato market plugin. If you have any trouble while using auto update (It is likely to be permission issue), you may want to manually update the theme via FTP or Cpanel.
  2. Update theme manually

    Download the latest version of the theme on ThemeForest download page and simply replace the old one via FTP or Cpanel.

PLUGINS

After activating the theme successfully, you will see notification message informing about plugins required and recommended to install along with it. You need to install and activate the required plugins to have the theme functions work properly. For recommended ones, it is up to you to install them regarding your needs.

PLUGINS INSTALLATION

Follow these steps to install plugin in your WordPress site:

  • Step 1: In Admin Panel, navigate to Plugins

  • Step 2: Click Add New button on the top. You will see the list of free WordPress plugins to search and install right from the dashboard. For free plugins such as WooCommerce and Contact Form 7, you can simply search here, check information then click Install Now. For other plugins that is downloaded outside, click Upload Plugin, choose file and hit Install Now

  • Step 3: After installing plugin completedly, go to Installed Plugins. You can see the list of plugins already installed on your site. Click Activate the plugin you need.

VISUAL COMPOSER

Urami  works well with Visual Composer, the popular drag and drop page builder plugin with intuitive interface to build your content at ease. If you plan to use Visual Composer Plugin for your site, check out these source.

Visual Composer WordPress Plugin Documentation for user guide to use the plugin

Visual Composer WordPress Plugin Support System for support upon issues of the plugin

REVOLUTION SLIDER

Urami is completely compatible with Slider Revolution. Its intuitive interface with diversified options and effects will be good choice for you slider. If you plan to use Slider Revolution Plugin for you site, check out these source:

Slider Revolution Wordpress Plugin Documentation for user guide to use the plugin.

Slider Revolution Form Support  for support upon issues of the plugin.

Slider Revolution FAQs for questions about the plugin.

WOOCOMMERCE

Urami works compatibly with Woo Commerce, allows you to create your online shop. If you plan to use Woo Commerce Plugin for your site, check out the source:

Woo Commerce Plugin Documentaion for user guide to use the plugin.

Woo Commerce Plugin Community Forum for support upon issues of the plugin.

Woo Commerce Knowleadge Base for question about the plugin

CONTACT FORM 7

Urami is fully compatible with Contact Form 7, the free form plugin recommeneded to create a nice form for your site. If you plan to use Contact Form Plugin for your site, check out these source.

Contact Form 7 Plugin Page for basic information about the plugin.

Contact Form 7 Plugin Documentation for user guide to use the plugin.

Contact Form 7 Plugin Support Forum for support upon issues of the plugin.

DEMO

When you finished installing our theme, your site will not contain all content like you might see in our live demo. If you want to have sample content on your site, you need to import our demo content by using our One Click Importer or Importing manually via WordPress.

ONE CLICK INSTALL

It will just take you several minutes to install demo data using our One Clic Demo Importer following these steps:

  • Step 1: Install and activate these plugins before you proceed: Visual Composer, Contact Form 7, Revolution Slider, Woocommerce is needed for an online shop.

  • Step 2: Navigate to Appearance→ Import Demo→ Click Import to Import Our Demo Data. Our database is automatic loaded on server.

  • Step 3: It can take a few minutes to import everything. Please be patient and wait for it to complete. Once it loads, you will see a “Success” message at the top of theme options.

NOTE: You can use Regenerate Thumbnails which allows you to regenerate the thumbnails for your image attachments.

.

IMPORT DEMO CONTENT MANUALLY

To imprort the demo content by default WordPress option, please follow the steps below:

  • Step 1: Navigate to Tools>Import
  • Step 2: Select Wordpress system then browse for the .xml file. You can find it following the path wp_Urami>inc>dummy>Urami>XML
  • Step 3: You will be asked to map the authors in this export file to users on the blog. For each author, you may choose to map to an existing user on the blog or to create a new user
  • Step 4: You will then have the option to import attachments, check on the "Download and import file attachments" box
  • Step 5: Click Submit
Now you have a website just like our demo, with the pictures replaced by grey images.

THEME OPTIONS

Urami has an advanced Theme Options panel that is loaded with options. We have the options organized into logical tabbed sections, and each option has a description of what it will do on the front end. There are too many options to go over in these docs but please take some time and navigate through each tab to see what we offer. Go to Appearance > Theme Options in your WordPress admin to access the theme options panel. You can also backup your theme options by clicking on the backup tab. That is a great way to move your custom options from site to site. See below for screenshots of our theme options panel. Please note: we are always adding new options so these screenshots may not reflect the most up to date options.

General

In this tab, you can find general settings for layout, preloading and back to top icon.

Logo & Site Identity

Typography

Custom Color

Blog

Woocommerce

Social

Social API

Social Profile

Import and Export

Custom Code

MAIN HEADER SETUP

Navigate to Appearance → Theme Options → Header to access the header options. You will see

Customize your setting for your header including many options bellowing:

  • Display top bar: Enable or disable the topbar. See Social icons to enable the social icons inside it. Set a Top menu from Appearance→ Menus.

If you enable top bar, you need to configure some options as Left topbar content, Phone number, Email, Skype, Right topbar content, Top Social Icon.

  • Sticky Top menu: Enable or Disable sticky of menu.

  • Transparent Main Menu: Enable or Disable main menu background transparency.

  • Ajax Search in menu: Enable or disable ajax search in menu

  • Show breadcrumb: Enable or Disable the site path under the page title.

  • Breakcrumb background: Allow you to select  image by files on your computer or Media Library.

  • Header Color Scheme: there are 2 options: Default & Custom. You can select one option for your header color scheme here.

Navigate to Appearance → Theme Options → Header to access the header options. You will see

ADD THE LOGO & FAVICONS

Urami requires that you upload your logo as an image file. The logo can be any size and can fill up the full content area. Urami is also retina ready so there are additional options to upload a retina logo and specific instructions, that need to be followed for it to display correctly on retina ready devices.

To insert your logo, follow the steps below:

  • Step 1: Navigate to Appearance→Theme Options → Open Logo & Site Identity tabs to access the logo options.

  • Step 2: You will see four logo options  to upload, one is for your own logo, one is for fixed menu logo, one is for transparent menu logo and final is mobile version logo.

  • Step 3: Choose your type of logo you need to insert logo then Click “Select Image” button to select logo by on your computer or Media Library.

NOTE:

  • Mobile Version Logo: This option use when you want to change your logo for mobile devices,if your logo width is quiet long to fit in mobile device screen.

  • Fixed Menu Logo: This optional use when fixed menu.

  • Transparent Menu Logo: This is optional use for menu transparent.

Favicon Options

Custom Favicon: A favicon is a simple square image viewable in browsers for users to identify your website among many tabs. Ideally, it should be a 32×32 pixels or a 16×16 pixels image. Most modern browsers can display a favicon in PNG format but older versions of Internet Explorer may not. To make sure your favicon be shown nicely, it is recommended to be in .ico format. And to custom favico, you can go to Appearance→Theme Options → Open General tab and navigate Favico options.

SET UP MENU

Urami supports custom Wordpress menus, with multiple levels of dropdown support for the main menu. There are 3 areas of the theme where you can assign a menu; the top menu, the primary menu, the footer menu. Each of these menu locations can have a custom menu assigned. Once a menu is created and assigned to the location, it will show up on the site. There are also several theme options to customize the menu. Please see below for the menu locations, how to create a new menu and the menu theme options.

Urami offers 3 different menu locations:

  • Top menu: this is menu that can assigned to the Top menu.

  • Primary menu: this is menu that can assigned to Primary menu.

  • Footer menu: this is menu that can assigned to Footer menu.

MENU THEME OPTIONS

To setup a new menu, follow the steps below:

  • Step 1: Navigate to Appearance→ Menus section of your admin.

  • Step 2: Click the “Create A New Menu” link to make a new menu. Enter the name then hit the “Create Menu” button.

  • Step 3: To add a menu item, select one of your created papges on the left hand side and click “ Add to Menu”. You can also add all kinds of different posts from the left side.

  • Step 4: To add a custom menu item, enter a custom name and link into the “Links” box.

  • Step 5 : Manage your menus by using the drag and drop functionality. To create a dropdown menu, simply drag a menu item below and slightly to the right of another menu item and it will lock into place and create a dropdown section.

  • Step 6 :After setting up your menu, scroll down to the bottom of the page to assign the menu to one of the 3 locations in the Theme Locations box.

  • Step 7: Once its all done, make sure you click the “Save” button.

Here  is a screenshot that shows you the various areas and descriptions of the menu section described above.

CREATE MEGA MENU

Urami has built-in mega menu that can be enabled in the mail menu. It can have 1-6 columns, be full width, have custom column width setting, take any widget and have icons/images next to menu items and more. Please see below for information on how to set this up. If you need information on how to create a reqular menu, please see the appropriate section of our documentation

  • Step 1: Navigate to Appearance > Menus section of your admin and select to create a new menu, or edit a current men that you already have.

  • Step 2: Only first level items can enable the Mega Menu. Click the “arrow icon” next to any parent level menu item to expand the option box. You will see an option to “Enable Mega Menu”, check the box.

  • Step 3:  Select the “Mega Menu Columns” that will be displayed. Also choose if you want “Full Width Mega Menu”.

  • Step 4: Second level menu item will show the title text above each column. To add a second level item inside the Mega Menu, select one of your pages on the left hand side and click “Add to Menu”, or add a post or a custom link from the left hand side. To make it a second level, drag the menu item into place, below and to the right of the first parent level.

  • Step 5: The Third level will be the smaller menu items in each column. To add a third level, repeat step 5 above and drag and drop the new menu item into place, below and to the right of the second level.

  • Step 6: Second & Third level menu items can have a widget area assigned.(You need save menu before do this step). Create a new widget section by going to Appearance > Sidebar Generator and clicking “+ Add New Sidebar”. Give the new widget area a name and save it. Then navigate to Appearance > Widgets to add widgets to the section. Once you add your widgets and save it, go back to the menu section and select the name of the new widget section in the "Display Sidebar in Menu" dropdown field

  • Step 7: After setting up your menu, scroll down to the bottom of the page to assign the menu to the “Primary Menu” location in the Theme Locations box. Once its all done, make sure you click the “Save” button.

 

Here is a screenshot that show you the various areas and description of the menu section described above.

PAGES

Pages are backbone of your website, and most likely you will set up several of theme. Pages  are blank canvas that allow you to add content with our shortcode elements. There are different page templates to choose from, each serving a purpose to help you build finish the site.

CREATE A NEW PAGE

You can create any number of pages with content. All of this is done in the pages section of your wordpress admin.

  • Step 1:  In Admin Panel, choose Page, click “Add New” on the top then enter your page title. If you need to know more about Pages in Wordpress, use the Help tab in the upper right of your screen.

  • Step 2: In Page Attribute box on the right side, choose your Parent page. It is set be default as no parent. Pages are usually ordered alphabetically, but you can choose your order by entering a number(1 for first, etc) in Order field.

  • Step 3: Also Page Attribute box, choose your Page Template in dropdown list. See below Page Templates list for more detail.

  • Step 4: Start editing your page content in the editing field. You can choose to edit your content using Visual or Text editor. To build content for your page you will need our provided Shortcodes.

  • Step 5: Make other settings for the page in meta-boxes the editing field. Once you get your setting done. Click “Publish” your page.

Here is a screenshot that shows you the various areas and descriptions of the pages setting describes above.

PAGE OPTION

Each  page you create has a full set of options that allow you to customize its header, footer and style. Below are the list of page options included in the Page Settings box.

  • Content Page no Padding:  This is a checkbox. If you checked; content of page with no padding top and padding bottom.

  • Main sidebar: allow you to select sidebar for page with 2 or 3 columns. And that doesn’t support for Full Width template.

  • Extra sidebar: this is options help you to select sidebar for pages with 3 columns.

  • Header Style: You can select your header style. In our theme we supported 2 styles: Center, Below.

  • Topbar: This is option help you Enable/Disable top bar.

  • Transparent Main Menu: This option allow you to enable/disable main menu background transparency.

  • Page Heading: You can enable/disable page heading or custom page heading. We supported 2 page heading; Heading,  Use Revolution Slider

  • Page Heading Background Image: this option allow to custom heading background image. Please  click “Select Image” button to upload image by your computer or Media Library.

  • Page Heading Title: This title is used to display on the Headline. If you leave it blank, “Title” will be used.

  • Page Heading Sub-title: This sub-title is used to display below Title on the Headline.

  • Footer Widget Area: this options help you want to use the mail footer that contains all the widgets areas. Click Global/Show/Hide to use Footer Widget Area.

  • Footer Menu: this options support you want to use menu in main footer. Click Global/Show/Hide to use Footer Menu.

CREATE HOME PAGE

Setting up your home page is the same as setting up any other regular pages except that you need to specify in the settings which page will be your main home page.

To set up your homepage, you just need to create your pages as usual. Then please follow these steps to set up homepage

  • Step 1: Navigate to Setting→ Reading.

  • Step 2:  On Front page displays options. Click choose A static page options.

  • Step 3: Choose the page you want as your home page from the dropdown list.

  • Step 4: This is also the same spot you select the Blog page as the post page.

  • Step 5: Click “Save Changes” to complete your setting.

CREATE BLOG

There are 2 ways to create a page that shows your blog post: using Post Page or using shortcode. Use Post Page if you just need a page to show all blog posts. Simply follow these steps:

  • Step 1: Create a new page, you can name it "Blog" then save change.

  • Step 2: Navigate to Setting→ Reading. On Front page dislaysoption, choose the page you just created from dropdown list to set as Post Page. You can also choose how many posts you want to show per page.

  • Step 3: Click “Save Changes” to complete your setting.

If you want to show certain blog categories in a page, use our shortcode as follow:

  • Step 1: Create a new page, you can name it "Blog".

  • Step 2: In Backend Editor, click "+" icon to Add New Element

    , find Post shortcode. With this shortcode, you can choose from different Layouts, set number of post per page, change order by date or alphabet, choose which categories to show up and many other options.

  • Step 3: Click “Save Changes” to complete your setting.

CREATE A BLOG POST

After you already got a blog page, turn to create some blog posts. Urami offers several blog post types: standard, image, video and galerry. Follow the steps below to create a blog post:

  • Step 1: In your Admin Panel, go to Post, navigate to Add New.

  • Step 2: Enter your title and choose Post Format from Format box on the right side which shows different post format options: Standard, Image, Video, Audio, Quote, Link and Gallery.

  • Step 3: Add your post content in Editing field. You can use our Shortcode to build your content where needed.

  • Step 4: Add Cateogories for the post from the Categories box on the right side. You can add new category or choose from existing cateogories. Check the box to select Categories for your post. Add relevant Tags for your post in the Tags box, set Featured image on the right side and other setting from the sections below Editing field.

    If you need detailed guide about post settings in Wordpress, please find in Wordpress Codex.

  • Step 5: All done, click Publish to publish your post.

CREATE SHOP PAGE

To build your online store with Urami, please make sure you have installed WooCommerce. There are 2 ways to create a page that shows your products: using Shop Page or using shortcode. Use Shop Page if you just need a page to show all products. Simply follow these steps:

  • Step 1: Create a new page, you can name it "Shop" then save change.

  • Step 2: Navigate to WooCommerce > Setting > Reading. In Productstab, click on Dislay. In Shop Page option, choose the page that you created as Shop Page. Here you will also find options for displaying categories and sorting products.

  • Step 3: Click “Save Changes” to complete your setting.

If you want to show certain product categories in a page, use our shortcode as follow:

  • Step 1: Create a new page, you can name it "Shop".

  • Step 2: In Backend Editor, click "+" icon to Add New Element

    , in WooCommerce tab, you can see different type of product shortcodes. With thess shortcodes, you can choose to show all products (using Products shortcode), top rated products, best selling products and many other useful shortcodes.

  • Step 3: Click “Save Changes” to complete your setting.

SHORTCODES

Almost every pages of Urami were built with shortcodes. We included in the theme tons of shortcodes that empower you to create your pages without coding knowledge required. Urami shortcodes can be generated also in Visual Composer page builder that will save you lots of time and effort. Please follow these steps to add shortcode to a new page:

  • Step 1: In your Admin Panel, go to Page, navigate to Add New or any page you want to add shortcode.

  • Step 2: Right under the page title, you will find the button to switch between classic editor and Backend Editor of Visual Composer. Choose to use Visual Composer Backend Editor

  • Step 3: click button to add new shortcode. You will see a list of shortcode. Choose the one that you need then save changes.

List of custom shortcode included in Urami theme

SUPPORT

We are always ready to support you with issues related to Urami theme. If you need any help or have feedback for the theme, please contact us at our Support Forum. Our supporters will assist you promtly. Finally, thanks for purchasing Urami and we hope that you will love the theme as we do.