Thank you for choosing BERG
There are two ways to install WordPress theme, make sure you have downloaded your theme from themeforest.net and unpacked the files.
- Using FTP client, login to the server where your WordPress website is hosted
- Using FTP client, navigate to the /wp-content/themes/ directory under your WordPress website’s root directory
- Using FTP client, upload the BERG directory to themes directory on your remote server
- Login to WordPress admin
- Go to admin panel Appearance > Themes > Add New > Upload Theme
- Click on “Choose File” and select BERG.zip
- Click on “Install Now”
Required / recommended plugin(s) installation and activation
Just right after installation you will be prompt to install required plugins, this is not obligatory but you will not have some of the compatibilities they offer like Visual Composer or Reservations plugin. We recommend installing them. Additionally there may be some suggested plugins we support but are not included in the theme. Theme support WPML for multilinguality. For ordinary translation you can used po/mo method with free Poedit app or Loco translate plugin.
Once you have the theme installed, plugins activated, we can start working on the theme itself.
For you convenience we have demo importer built in the theme. Go to Theme Settings (admin bar / or side panel) and choose Demo import than choose of the demos and Import
Demo starts to import and in few seconds (may take up to few minutes) you will have everything ready. All thats left to do is to replace the content (images/texts) with your own and you are ready to go.
All images viewed in this live preview are for demo purposes only and are not included anywhere in the downloaded package or in the demo data import. The posts images and content excerpts come from a variety of sources.
If you believe that your work has been copied in a way that constitutes a copyright infringement, please contact us now at email@example.com and we will remove them immediately.
There are two homepage versions (homepage templates), they may look somehow similar as they share some visuals but in many cases features from one page are not available in the other one an vice versa. There are common settings for both, these are explained bellow, their exclusive settings & featured are listed in their corresponding sections.
Select home background:
- Static backgrounds -> uses standard featured image
- Parallax background -> uses standard featured image and adds parallax effect to it
- Fullscreen slider -> you need to upload 2 or more images for the effect to take place, once this option is chosen, image uploader will appear underneath
- Revolution Slider (RS) -> make sure you have RS installed, activated and slider created. If you do after choosing this home background you will be able to select the RS slider from the dropdown list
- Video background -> lets you use YouTube as your background, simple copy&paste the YouTube clip link in to the designated area and you are done.
Navigation – Open / Close
- Depending on your choice, navigation will be closed or open upon the page load. If not altered, it uses default setting from Theme Settings -> Navigation
Footer – Default / Enable / Disbale
- Depending on your choice, footer will be present or not. If not altered, it uses default setting from Theme Settings -> Footer
How to create footer content? [link]
Home (template) exclusive features
- Page Content – content you compose here displays in the lover part of the site no matter the placement of the navigation bar, the content can be created with built in WordPress TinyMCE or Visual Composer (VC), make sure you are in Backend Editor if you want to use VC.
- Navigation position – top/center – depending on your choice, footer will be present or not. If not altered, it uses default setting from Theme Settings -> Footer
- Navigation background opacity – depending on you choice it will make the navigation background either transparent or solid color
- Select mobile home – lets you choose the dedicated mobile home page. You need to create the page first, it is just a normal page with Mobile Home template assigned to it.
Home 2 (template) exclusive features
- Page Content – content you compose here displays in the side panel (left), the content can be created with built in WordPress TinyMCE or Visual Composer (VC), make sure you are in Backend Editor if you want to use VC.
- Home header – header that appears on the Homepage, ie. Hello, Welcome etc.
- Home button text – text displayed on the button
- Home button link – link for the button
- Mobile version – in this template you have a choice of using responsive version or selecting custom made mobile page.
Left panel settings
- Home logo image – this logo is exclusive to the left panel only and is different to the found in Theme Settings -> Appearance
- Logo padding – padding lets you control the position of your logo in the left panel only
- Logo align – lets you place logo in desired position
- Footer text – is a simple text display as a footer exclusively in the left panel, it is different to Theme Settings -> Footer
- Show reservation – lets you use reservation button on the homepage, exclusively on the left panel
- Reservation text button – your button text ie. Book your table
- Reservation type – OpenTable / Custom – theme support OpenTable (if chose please provide your open table ID) or custom (in this case provide custom link to whatever page you feel right)
- Data format – this is a date format used for our reservation form used with OpenTable only
- Time format – this is a time format used for our reservation form used with OpenTable only
i: Link to the reservation form used with OpenTable (is used) is always in the same form: http://yourdomain.com/#reservations You may for example need to link to the reservation from a widget or navigation with use of custom link.
ii: If button left empty it will not be dsiplayed
Navigation – text color & logo version
- Depending on your choice different version will be used for you “hamburger menu style”, styles are defined in Theme Settings -> Navigation If you do not alter these it will use default setting.
Mobile Home Page
There are two types of mobile homepage in berg. One is responsive (auto) and there is nothing you need to do, it just works. It gets rid of certain things and some may not like it so there is another type based on a page with mobile home template assigned to it & selected on your homepage.
- Create a blank page and name it ie. mobile-home
- Assign mobile home template to it.
- Populate it with content using Visual Composer, to put image background use page Featured Image option. Save.
- Go to your “normal” homepage and under settings at the bottom Home Settings -> Select mobile homepage choose the page you have just created
It will appear as your mobile homepage from now on, it can have different, custom crafted content to your desktop homepage.
There are 4 templates for your menu (each template determines different look). To create a menu page, you need to create a normal page and assign page template to it.
- Food Menu List
- Food Menu List NEW
- Food Menu Square with Images
- Food Menu Square with Without Images
Depending on the template chosen there are additional settings, explained below, some settings applies only for specific template.
- Menu categories – lets you select and arrange categories to display in your food menu, choose which category you would like to use and drag and drop in the correct order too.
- Navigation – lets you select navigation options, which are determined in Theme Settings -> Navigation
- Intro section – lets you use intro section [read more about intro here]
- Footer – lets you decide to display your footer or not
i. please note that categories uses parent / child relatons ie. Mains (parent), Pasta (child), Fish (child) etc. [read further for more info]
ii. if no category is selected all categories will be used
Creating food menu categories
Food menu -> Categories fill in the name, slug (optional) and description (description is displayed underneath the category name), upload an icon image too (optional, image icon is used by Food Menu List NEW template), make sure you select “File URL” and hit “insert into post” to upload the picture, save at the end. If a category have a parent please indicate it too.
Create as many categories as possible.
Creating food menu items
Food menu -> Add food menu item fill in the details, add images etc. Content here can be created with Visual Composer or WordPress TinyMCE. There are some single menu item settings explained below
- Featured image – image displayed in food menu archive (food menu view)
- Title – is the title of the menu item
- Post content – content created here is the main content displayed on the singe menu item view
- Excerpt – is displayed in food menu archive (food menu view), if left blank excerpt will generated from Post content
- Menu item gallery – manage or create your gallery here
- Food icon – add icon appearing next to to the menu item title
- Badges – badges / labels are created with shortcodes yopress-> badges or labels and are placed in front of the menu item title
- Price / additional info – text area for price or additional info
i. Make sure you assign your menu item to a category, or it will not be displayed
ii. If field / text are is left empty it will not be displayed
iii. There are some more general settings in Theme Settings -> Food menu [read further to learn more]
Arranging categories / menu items
If you want to arrange categories or/and menu items in a specific order you can either
- Go to that page and drag and drop categories you have set to use in a particular order, this lets you only arrange categories
- If you want to arrange items within specific category you need to go Food menu – > Reorder Food Menu Item this lets you manage both categories and menu items. You simple drag and drop menu items and/or categories. Pleas note that you cannot move menu items from one category to another.
Theme settings -> Food menu
There are some general settings that applies for all menus.
- Category filters – lets you determine to display filters or not
- Sticky filters – lets you have the filters visible after you scroll you page half way or so, for navigation convenience
- Food link title – lets you choose what happens upon title click, if you are taken to single menu page or not.
- Icon & badge on archives – lets you choose to display icons/labels on archive view instead of on your single item page only
- Social share icons on a single product – decide to have share options on/off on single item page
i. Social options follow rules set in Theme Settings – > Social
There are two contact templates. Contact and Contact 2. Go to Theme Settings -> Contact & map to manage / adjust. Choose which template settings you are working with firstly.
BERG support OpenTable reservation system with our custom form or/and Reservations plugin. Depending on your choice you need to do more setting up.
If you want to use open table you need to use Home 2 template for you homepage and select OpenTable and provide your OpenTableID. If you want to use other system, you can do so by selecting Custom and provide link to any other booking system.
If you want to use Reservations plugins, make sure you have installed and and activated, go do Reservations plugin setting up and you can use it straight away.
If you want to link to OpenTable reservation form make sure you are using link in this form, make sure you are changing your URL, it follow this http://yourdomain.com/#reservations you can use it to link from navigations, buttons, posts, links, facebook etc.
Create normal page and assign portfolio template to it. There are 2 portfolio templates
Portfolio grid / masonry settings are as follows
- Portfolio categories – lets you select which categories to use for this portfolio, if left empty, all categories will be used
- Items per page – define how many items will be displayed before loading more
- Single portfolio version – choose the look / layout of your singe portfolio item [read further to learn more]
- Filters – decide to show filters or not
- Categories – lets you display categories on the portfolio view
- Overlay color – choose color and transparency level of the hover color
- Hover text color – choose color of the text when item is hovered
- Number of columns – choose between 2, 3 or 4 columns
- Intro section – lets you choose your intro section [read more about intro section further]
Additionally there is Masonry layout settings – lets you set your very own order of the layout, if left empty there is a default order set
Creating single portfolio item
Portfolio -> Add portfolio item fill in the title, post content and add you featured image as well as gallery images if needed, make sure you assign the item to a category or it will not be displayed. You can crete content with Visual Composer or TinyMCE built into WordPress.
Portfolio item needs to be assigned to a portfolio category. Portfolio -> Categories -> Add fill in the details there
Vertical Slider [About]
Visual slider is used for the About section in our demo, it can be used for any purpose, you need to create a page, assign Vertical Slider template to it, next create category, indicate that category on the page you have created and lastly create Vertical slider items.
Vertical Slider -> Add vertical slider item fill in title and content, add your featured image, choose format type: video or image. If vide is chosen you need to provide link to YouTube clip you would like to use.
Make sure you assign a category to it and save.
To create category Vertical Slider -> Categories -> Add new
There are 4 blog templates. Each template determines the blog archive layout / look and the settings between templates may vary. There is global blog settings Theme settings -> Blog and additional settings based on the template used. You may create as many different blogs as required.
- To create a blog you need to create a page Pages -> Add new and assign one of the blog templates, publish page.
- You also need categories to feed the blog with Posts -> Categories -> Add give the title of the category, optional slug and add.
- Finally you need posts (articles) to assign them to categories, and these categories are used to feed blog(s). [Read further about posts]
Blog (page )settings explained bellow
- Page title – it is your blog title, the heading can be hidden Theme Settings -> Appearance -> Show header on page -> Off
- Page content – serves no function here, leave it blank / empty
- Featured image – is used as a source for Intro section if enabled
- Blog categories – categories selected here will be displayed on your blog, if left empty – all categories will be used
- Posts per page – defines the number of post per page, before “load more” button action
- Show excerpt – choose to show excerpt or not, excerpt text area
- Excerpt length – define the number of words to display
- Show author – decide to show of hide author of the post
- Show date – decide to show or hide the publication date
- Show categories – decide to show or hide category (ies) the post is assigned to
- Show “read more” button – decide to show or hide read more button
- Overlay color on hover – choose color and level of transparency for hover color
- Sidebar position – define the sidebar placement, if enabled
- Select sidebar – choose which sidebar to use, you can create custom sidebars in Appearance -> Custom Widget Area
To create single post Posts -> Add New fill in the details Title and Post content, assign post to category and publish. Make sure you add featured image if you want to display image on the page blog.
There are general settings for post in Theme Settings -> Posts
There are two single post template version, “Side by side” and “Image on top” you can choose a default one Theme Settings -> Posts -> Select post template but you can also choose this on a per post base.
Footer – > Add new create your footer with Visual Composer or built in WordPress TinyMCE. Once you are happy with the result make sure you got Theme Settings -> Footer and enable footer.
Please note footer post added as the last one will be used, so you may have few footers, only the latest one will be used. Footer can be enabled/disabled on a majority of pages.
Intro section – Theme Settings -> Intro section
It is a section that displays a picture or color at the start of all pages (almost, and if enabled), it is important to understand that you have global settings (Theme Settings -> Intro section ) and some additional settings available per page, on that particular page. Into section always uses featured image as a source for the image. Settings explained bellow.
Type of intro
- No intro – displays no intro at all
- Half screen intro – intro that takes up half “size” of you monitor / viewport.
- Fullscreen intro – is it a full screen intro, that cover the “size” of you monitor / viewport.
- Custom height – lets you define the height of the intro section in pixels ie. 500px
Opacity at the start
- Intro section is “covered” with a solid color. This color has it level of transparency (see-through) and this setting let you define the start level, you may have it set more or less transparent. The closer the number to 100 the more transparent the color is, and the picture is more visible. The smaller the number is the less visible the image becomes.
Opacity at the end
- Same as above, but this time we define the end-state, the level of transparency after the scroll. The closer the number to 100 the more transparent the color is, and the picture is more visible. The smaller the number is the less visible the image becomes.
- Choose how to text, that you provide on the actual page(s) position it self. You may have it left, center or right.
Intro overlay (per page setting)
- Lets your define the color of the overlay above the image used.
- The title that appears on the intro section, can be left empty.
- The content that appears on the intro section, can be left emtpy
Team is a simple page presenting your team members as well as nice looking background image with parallax effect.
To create page team Pages -> Add new and assign Team template to it, featured image is used as a background image for the section. Go further to Theme Settings -> Team fill in the details and “add team member”, add as many as required, you can rearrange members by dragging and dropping them in the position you wish. To remove hit “remove item”.
There are only few settings here:
- Text align – lets you position text, left, center or right is you option
- Overlay color – define the color and its transparency over the featured image used on the page with “Team” template assigned
Theme settings – > Appearance upload light logo image and dark logo image, these logos are used based on your further choices
Translation / WPML
Install the plugin and translate using it. Learn more about WPML https://wpml.org/documentation/
Additionally, if you do not want to create multilingual website but translate the theme into one language there is an easy way to do it, get yourself a copy of free Poedit app (Mac/Win), download po/mo file from wp-content/themes/BERG/languages and translate it. Once you are done translating it, save it in this manner xx_XX ie. pl_PL for Polish or de_DE for German, upon saving you will have two files po and mo. Upload back to the folder, once you change your language under Settings -> General -> Language your site will be using translated files.
If you are using WooCommerce make sure you have the latest version installed as it contains translation for most languages and there is no need to do it yourself.
Update FAQ from 2.x.x to 3.x.x
Support & info
If , after reading this doc you still have some questions please use our support system, open a ticket there.
We do not provide support in comment section of themeforest, we do not offer customization services as a part of our support. We may be able to help but it is not a rule. If you want to hire us go for it firstname.lastname@example.org
If you are opening a ticket please be specific, describe your problem as detailed as possible, provide, if possible:
- OS version you are using
- browser version and its version
- if the problem is only present on your computer or multiple machines
- if it is mobile related, please tell if it is iOS (if so what model, OS version & browser and its version)
- screenshots are always a good idea
- provide URL if site is online
- provide temp pass / login to you site is possible – make sure you check the pass / login before sending it to us
We do our best to reply within 24hrs, if you do not get a response within 48hrs please e-mail us email@example.com with your ticket ID
YOSOFTWARE 2016 | 18.02.2016