On the left side of the screen you will see the menu with various options and on the right side you will see website preview. Any settings you change in the Customizer will affect entire website, which means all posts and pages, so we are referring to them as global customization settings.
Each change you make will automatically update website preview (page will be refreshed). When you are satisfied with the result click ‘Save & Publish’ and do not forget to make final preview outside customization frame and logged out of WordPress to see how the site would look like to your visitors.
The important feature of Vivo is that any global setting can be overridden on any single post or page using Override Global Settings section which you will find on the bottom of editor page.
You will learn more about this overriding soon. Now, let’s explore customization settings.
You’ll see the changes in the preview panel to the right. When you’re done, click Save and Publish.
Display site title and tagline
True / False
Select if the site title and tagline (set in Site Identity panel) will display next to main logo.
Site title HTML tag
p / h1 / h2 / h3 / h4 / h5
Page width
Wide / Boxed 1200 / Boxed 1400 / Boxed 1600 / Boxed 1800
Here you can select the width of the entire page content.
Accent Color (primary)
Hexadecimal color code or color picker
Accent color is used as a color for links, icons, etc. If you define it, the accent color will influence the general color scheme of the site.
Alternate Color (secondary)
Hexadecimal color code or color picker
Another color which influences general color scheme of the site is alternate color. Alternate color can be assigned as a color for buttons, icons, etc. If you define it, all elements with assigned alternate color will be affected.
Template skin, background color and text color
Color scheme, or Hexadecimal color code or color picker
Select main template colors for background and text throughout the site. Note that these colors can be overwritten on individual sections and elements.
Template background image
Attachment ID or URL
Page background image is a static image which serves as a site background if defined.
Sidebar position
No Sidebar / Left / Right
This option enables you to define if the sidebar will be visible globally or not.
By customizing this option, user can globally enable (place it on the right or left side) or disable sidebar. Sidebar content can be edited under Appearance > Widgets (from main WordPress menu).
You can choose one of three predefined sidebar layouts:
Enable sticky sidebar
True / False
Select if the sidebar will be sticky (scroll down with page content) or not.
Sidebar title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the widgets in the sidebar.
Sticky sidebar top position
Number in pixels
Define the spacing between sticky sidebar and top of the page (or sticky header if it’s enabled).
Sidebar width
Number in percentage
Define the width of the sidebar in percents (e.g. 1024px or 30%).
Sidebar responsive breakpoint (in px)
Number in pixels
Defines screen resolution when sidebar is displayed as defined. On smaller screens sidebar will be displayed below content.
Custom JS
Custom JS code
This option enables you to define global Custom JS code. Enter any JS code you want here and it will be embedded in the element of all pages throughout the site.
This is where you should paste your custom site wise JavaScript, such as Google Analytics script.
Reset theme settings
This is not really a setting, so no override. Reset button will just reset all global settings to default values.
Body Font
No Change / Any Google font
Body text font. Using this setting you can set the main font family that’ll be applied throughout the website. Vivo uses Google webfonts.
Body text transform
Default / UPPERCASE / Capitalize / lowercase
Body Font Weight
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Body font style
None / Italic / Oblique
Heading font
No Change / Any Google font
Heading text font. Using this setting you can set the font family for Main Headings.
Heading text transform
Default / UPPERCASE / Capitalize / lowercase
Heading font weight
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Heading font style
None / Italic / Oblique
Example:
Supertitle font
No Change / Any Google font
Heading Supertitle text font. Using this setting you can set the font family for supertitles in Main Headings.
Supertitle text transform
Default / UPPERCASE / Capitalize / lowercase
Supertitle font weight
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Supertitle font style
None / Italic / Oblique
Example:
Subtitle font
No Change / Any Google font
Heading Subtitle text font. Using this setting you can set the font family for subtitles in Main Headings.
Subtitle text transform
Default / UPPERCASE / Capitalize / lowercase
Subtitle font weight
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Subtitle font style
None / Italic / Oblique
Example:
Button font
No Change / Any Google font
Button text font. Using this setting you can set the font family for all buttons.
Button text transform
Default / UPPERCASE / Capitalize / lowercase
Button font weight
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Button font style
None / Italic / Oblique
Button shape
Hard Rounded / Soft Rounded / Square
Menu font
No Change / Any Google font
Using this setting you can set the font family for menus.
Menu text transform (first level)
Default / UPPERCASE / Capitalize / lowercase
Menu text transform (other levels)
Default / UPPERCASE / Capitalize / lowercase
Menu font weight (first level)
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Menu Font Weight (other levels)
Default / Lighter / Normal / Bold / Bolder / 100 / 200 / 300 / 400 / 500 / 600 / 700 / 800 / 900
Default headline height
None / Thin / Regular / Thick / Fullscreen
Select the height for default headline. Select ‘none‘ to disable default headline.
Default headline parallax speed
None / Slow / Normal / Fast
Set the parallax speed for default headline.
Default headline overlay
Select dark or light, and opacity
Here you can select if default headline will have overlay.
Default headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size in default headline.
Default headline title tag
p / h1 / h2 / h3 / h4 / h5 / h6
Select the title tag in default headline.
Default headline width
Wide / Wide, boxed menu 1200 / Wide, boxed menu 1400 / Wide, boxed menu 1600 / Wide, boxed menu 1800 / Boxed 1200 / Boxed 1400 / Boxed 1600 / Boxed 1800
Here you can select the width of the default headline.
Default headline style, background and text color
Color scheme, or Hexadecimal color code or color picker
Select color scheme for the default headline.
Show in page superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in page subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of default headline.
Page share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline or superheadline.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Page share icons size
Extra small / Small / Normal / Large / Extra large
Page share icons style
Outline / Filled / Borderless
Page share icons shape
Circle / Square / Rounded square
Page share icons color scheme
Select color scheme
Display preloader
Yes/No
Preloader color scheme, background and text color
Select color scheme
Preloader transition
Fade / Fade & move up / Fade & move down / Fade & move left / Fade & move right / Fade & scale up / Fade & scale down / Fade & blur
Preloader animation
Square / Dots / Circle / Dotted square / Line / Multiline / Classic
Preloader logo
Attachment ID or URL
Here you should select logo that will display on preloader.
Preloader text
Any text
Archive layout
Standard, with title on top / Standard with image on top / Columns / Zig-zag / Simple
Vivo offers five layouts for blog archive pages. Please take a look at the following examples of these layouts:
This setting will affect layout of the main Blog page, as well as the Archive, Category, and Tag pages.
Single post animation
No Animation / Fade In / Move Up / Move Left / Move Right / Move Down / Zoom in / Zoom out / Fade In - Move Up / Fade In - Move Left / Fade In - Move Right / Fade In - Move Down / Fade In - Zoom in / Fade In - Zoom out
Set the posts’ animation on archive page load.
Headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show in superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of the posts.
Show excerpt
Choose an option
Select if the excerpt will be visible on the archive page.
Show after content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content on archive page.
Share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Share icons size
Extra small / Small / Normal / Large / Extra large
Share icons style
Outline / Filled / Borderless
Share icons shape
Circle / Square / Rounded square
Share icons color scheme
Select color scheme
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Read more button style
None / Outline / Filled / Clean
Read more button icon
Select an icon
Read more button size
Small / Medium / Normal / Large
Read more button shape
Circle / Square / Rounded square
Read more button color scheme
Select color scheme
Single post settings page
Select page from the dropdown
Use static page with content as a template for all single posts. Select the page which serves as a template.
Blog post layout
Standard / Columns
Vivo offers two layouts for single posts – standard and columns. This setting lets you choose default layout for all single posts.
Here is an example of standard layout
And here is a columns layout.
Headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show in superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of the posts.
Show after content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Share icons size
Extra small / Small / Normal / Large / Extra large
Share icons style
Outline / Filled / Borderless
Share icons shape
Circle / Square / Rounded square
Share icons color scheme
Select color scheme
Author info style
None / With image / Without image
Show in previous/next post navigation
Featured image / Label / Title / Date
Archive layout
Standard, with title on top / Standard with image on top / Columns / Zig-zag / Simple
Vivo offers five layouts for portfolio archive pages. Please take a look at the following examples of these layouts:
This setting will affect layout of the main Portfolio page, as well as the Archive, Category, and Tag pages.
Single post animation
No Animation / Fade In / Move Up / Move Left / Move Right / Move Down / Zoom in / Zoom out / Fade In - Move Up / Fade In - Move Left / Fade In - Move Right / Fade In - Move Down / Fade In - Zoom in / Fade In - Zoom out
Set the posts’ animation on archive page load.
Headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show in superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of the posts.
Show excerpt
Choose an option
Select if the excerpt will be visible on the archive page.
Show after content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content on archive page.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Share icons size
Extra small / Small / Normal / Large / Extra large
Share icons style
Outline / Filled / Borderless
Share icons shape
Circle / Square / Rounded square
Share icons color scheme
Select color scheme
Read more button style
None / Outline / Filled / Clean
Read more button icon
Select an icon
Read more button size
Small / Medium / Normal / Large
Read more button shape
Circle / Square / Rounded square
Read more button color scheme
Select color scheme
Portfolio slug
Page slug
This field should contain the slug of the page that serves as a template for Portfolio custom post type.
By default, Portfolio custom post type has the slug “portfolio”. In order to change the slug, create a static page with desired slug, and add its slug to this field. Once you save the changes in Customization panel, navigate to Settings >Permalinks, and click ‘Save Changes’.
That way, new slug in the URL will be generated for Portfolio pages.
Portfolio category slug
Page slug
This field should contain the slug for Portfolio category custom post type.
The slug added to this field will display on Portfolio category pages. Once you save the changes in Customization panel, navigate to Settings >Permalinks, and click ‘Save Changes’.
That way, new slug in the URL will be generated for Portfolio category pages.
Single portfolio settings page
Select page from the dropdown
Use static page with content as a template for all single portfolio posts. Select the page which serves as a template.
Single project view
Standard / Columns 1 (media, content + meta) / Columns 2 (media, meta / content) / Columns 3 (media, content / meta)
Vivo offers several layouts for single portfolio posts. This setting lets you choose default layout for all single posts.
Single project headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show in superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of the posts.
Show after content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Share icons size
Extra small / Small / Normal / Large / Extra large
Share icons style
Outline / Filled / Borderless
Share icons shape
Circle / Square / Rounded square
Share icons color scheme
Select color scheme
Author info style
None / With image / Without image
Show in previous/next post navigation
Featured image / Label / Title / Date
Search template page
Select page from the dropdown
Use static page with content as a template for the search page. Select the page which serves as a template.
Search list headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show in search layout superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in search layout subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of the posts.
Show excerpt
Choose an option
Select if the excerpt will be visible on the search page.
Show in search layout after content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Search list share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Search list share icons size
Extra small / Small / Normal / Large / Extra large
Search list share icons style
Outline / Filled / Borderless
Search list share icons shape
Circle / Square / Rounded square
Search list share icons color scheme
Select color scheme
Read more button style
None / Outline / Filled / Clean
Read more button icon
Select an icon
Read more button size
Small / Medium / Normal / Large
Read more button shape
Circle / Square / Rounded square
Read more button color scheme
Select color scheme
Custom page 404
Select page from the dropdown
Use static page with content as a template for the 404 error page. Select the page which serves as a template.
Page 404 style
Color scheme, or Hexadecimal color code or color picker
Page 404 background image
Attachment ID or URL
Headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show after content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content on the shop list.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Share icons size
Extra small / Small / Normal / Large / Extra large
Share icons style
Outline / Filled / Borderless
Share icons shape
Circle / Square / Rounded square
Share icons color scheme
Select color scheme
Single product settings page
Select page from the dropdown
Use static page with content as a template for all single posts. Select the page which serves as a template.
Headline title size
Extra Small / Small / Medium / Normal / Large / Extra Large / Huge
Select the title size of the posts’ headline.
Show in superheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Show in subheadline
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display in superheadline and subheadline of the posts.
Show after single product content
Breadcrumbs (Yoast) / Date / Author / Author photo / Share / Tags / Categories / Comments number / Comments link / Excerpt
Select which of the options will display after post content.
Make sure to click on CTRL on your keyboard in order to select more than one share options.
Share options
Copy url to clipboard / Facebook / Twitter / Linkedin / VK / WhatsApp / Mail / Reddit / Tumblr / Pinterest / Blogger / EverNote / GetPocket / HackerNews / FlipBoard / Google Bookmarks / Diaspora / QZone / Weibo / RenRen / XING / Skype / Line.me / Telegram.me / Viber
Make sure that share options are included in subheadline, superheadline or after post.
Share icons size
Extra small / Small / Normal / Large / Extra large
Share icons style
Outline / Filled / Borderless
Share icons shape
Circle / Square / Rounded square
Share icons color scheme
Select color scheme
Single product related products columns
1 / 2 / 3 / 4 / 5 / 6
Single product related products rows
1 / 2 / 3 / 4 / 5 / 6
Theme’s .pot file is located in /wp-content/themes/your-theme-name/languages folder.
Please use PoEdit – https://poedit.net/ to translate the .pot file and create respective .po and .mo files.
Please name .po and .mo files e.g. potname-nl_NL.po and potname-nl_NL.mo (nl_NL is the language code for dutch and potname is the name of the .pot file you have started from – it corresponds to text domain of the theme). For other languages’ codes, please refer to the following link: Internationalization.
In order to place .po and .mo files properly and not have them deleted when you update the theme, upload them to \wp-content\languages\themes folder. If you don’t have languages folder in your wp-content directory, please proceed and create one. Then create themes folder, and paste the files in it.
Alternatively, you can upload the .po and .mo files to your theme’s /wp-content/themes/your-theme-name/languages folder. In that case name them only using the language code (for example nl_NL.mo and nl_NL.po)
Also make sure to translate the theme’s plugin .pot file, located in \wp-content\plugins\your-theme-name\languages folder.
The steps are the same as for the theme, except the files should be named bt_plugin-nl_NL.po and bt_plugin-nl_NL.mo (with appropriate language code).
For plugin’s .po and .mo files, you should place them in \wp-content\languages\plugins folder.
You can set the site language of your WordPress installation on Settings > General. WordPress will automatically use the right language files if they exist.
For more info, refer to the article Child Theme.
The best way to start is to install demo content. If you want to install one page demo please refer to the article: Installing Demo Content. You will be able to see how all elements on the single page are set.
1. First of all, navigate to the Bold Page Builder and edit desired section. Insert in required Custom Tab Element ID attribute:
2. Then in Appearance > Menus add a new Custom Link and as a URL insert custom ID atribute with #.
For example: #about
Once the new theme version is available, user who purchased the theme should get an email note from the Envato (ThemeForest).
There are three ways to update the theme:
Download newest theme version from ThemeForest Download section. Since you already have the theme installed, you can download just ‘Installable WordPress file only’.
In case you want to use this method, we suggest that you use Filezilla to access your server. Here is the article that explains how Filezilla works.
You need to extract theme file from the zipped folder you downloaded, and upload it to /wp-content/themes folder on your server. You will be prompted to overwrite the existing files. Select ‘Yes’, and the theme will update.
*The example is the zip file from Medicare theme but the process is the same for all themes.
This method is available since WP version 5.5. Please follow these steps:
Enable automatic theme update with the Envato Market Plugin. Once you install and activate this plugin, every time a new theme version becomes available, you will be able to update it with just one click.
You will need to go to the WordPress Updates page and navigate to the Themes section. The new version will be included in the section just like the themes from the WordPress repository.
* Whichever of these three methods you use for theme update, you will have to update theme plugin (and possibly some other required plugins) as well.
For plugin updates, you will get notification on your dashboard when new version is available.
If you made any changes in the source code you’ll need to reapply them to the new version of the theme or they will be lost.
To prevent this, you can use child theme.
All settings in Customize panel and your content will be preserved.
In order to ensure that the theme you purchased / want to purchase is RTL supported, you can check on our themes’ profiles on ThemeForest.
These themes have CSS defined for RTL layout, so when you change site’s language in Settings >General on your dashboard (or via language switch if you have multilingual site), the RTL layout will automatically apply to certain elements.
Some elements in Bold Builder that have alignment option (such as Icons, Images, Columns, etc…) will need to be rearranged manually to fit the RTL layout.