Contents

1. How to change Google map pin location

2. Blogger Shortcode

3. Services Lost Background after their Number changed.

4. Cannot Edit Merged Columns' Content

5. How to Edit Shop Page Header

6. How to Edit Links in Login and Register pop-ups

7. How to create Woocommerce Account page.

8. FTP details are requested when installing the theme/plugin.

9. How to change "Details" button text in the list of Events.

10. How to activate standard VC shortcodes (Single image)

11. "Are You Sure You Want To Do This?" / "The Link has expired" when trying to install the theme

12. Theme Widget Areas

13. How to Add Image Slideshow instead of Featured image

14. Google map error "Oops! Something went wrong. This page didn't load Google Maps correctly.."

15. How to Personalize a Posts Page

16. How to add a new font

17. How to add uploaded font to HTML theme

18. Bundled Plugins License & Activation Questions

19. Fatal error: Call to undefined function mb_strtolower() in..

20. How to edit/remove Get in touch form in slider.

21. How to Edit Slider on the Shop Page

22. How to translate months names in Content Timeline Plugin

23. How to Disable a Blue Bar over Slider

24. How to get header logo bigger

25. How to set up Google Maps without API key

26. How to Edit "More Info" Button Text (section under the slider)

27. How to Manage Room details

28. How to enable Visual Composer on custom post types (team, services etc)

29. Services background disappears.

30. How to change Services icons.

31. Enabling pinch to zoom on mobiles

32. How to edit the banner image and wording on the shop pages.

33. How to modify the header banner on the Shop page

34. How to Edit/remove the Form over the Slider.

35. How to Change the Number of Products on Shop page

36. How to Сhange Googlemap Location (address)

37. How to edit "Make an Appointment" in slider

38. How to add Appointment Button in Menu

39. Service/Team pages give 404 error

40. I can't translate the word "Share:".

41. How to edit "GET Your Transportation Quote" text and buttons over the slider.

42. How to Сhange Link on Enroll Now button in Header

43. How to translate "Send us a message" Title of Contact us form

44. How to add a New Font

45. How to remove white border over the slider

46. How to change footer background image

47. How to edit/translate "All posts" page title.

48. How to change a footer background image

49. Theme options are lost after the the child theme activation.

50. How to Add a New Font

51. How to add the Google Map API in the HTML theme

52. How to use .pot file to translate the theme.

53. How to set up Wordpress Social login plugin

54. How to Remove Events in the Header Slider

55. How to Add New Fonts (Customizer)

56. How to edit/remove "Emergency" text in header

57. ThemeREX Services Shortcode

58. How to solve "Fatal error: Allowed memory size of xx bytes exhausted (tried to allocate xx bytes)".

59. How to translate "Home" in breadcrumbs

60. How to change team member excerpt

61. How to Customize Layouts

62. How to Edit Homepage Banners under Slider

63. How to Add Another Social icon

64. "Error load data from file" when installing dummy data.

65. Google map error "Oops! Something went wrong. This page didn't load Google Maps correctly.."

66. How to change the text/link of Enroll now button

67. How to add Team member/team group pages and other post types to the menu.

1. How to change Google map pin location

By default, the address (pin location) is defined in Theme Options -> Footer settings. However, you can change it to a custom one by prepending another marker to your map:

This way you can add multiple markers if required.

2. Blogger Shortcode

ThemeREX Blogger is a custom shortcode for Visual Composer, which can output a blog post section anywhere on your site.

It's available under the ThemeREX tab, when adding a new visual composer element.

The shortcode can pull data from regular blog posts, as well as custom post types and pages. You can also narrow down the selection by specifying a post category, tag, or post ID.

In order to find an ID of a specific post or page, open it up in the admin panel, and in the URL address locate the part where it says "post=xx". The "xx" would be the number of your post.

E.g., on the image above, the post ID is 3131.


3. Services Lost Background after their Number changed.

If you need another number of service items (custom), not 3 as on the demo, the background color may be lost:
 

There are styles added in the theme just for 3 columns (for demo purposes), however you can add background for each service item via each service item element settings:


4. Cannot Edit Merged Columns' Content

If you merged pretty large number of columns (e.g. 7) and when you hover over elements of columns in Visual Composer and there are no option panels for editing, please go to Theme Options -> Other -> Additional css/html -> Your custom css code and paste the following lines:

.trx_sc_column_item { width: 49% !important; }

Save the changes. This should solve the issue.

5. How to Edit Shop Page Header

In order to modify/remove the following header:

Please go to Theme Options and pick Woocommerce Stream in a top drop-down:


You will find text, image under Header tab:


6. How to Edit Links in Login and Register pop-ups

You can change  "Terms & Conditions" link in Registration pop-up in soapery\templates\_parts\popup-register.php file, line 11:

To change "Problem with log in" link in the Login pop-up, please edit soapery\templates\_parts\popup-login.php file, line 22:


7. How to create Woocommerce Account page.

Please go to Pages -> Add new and add "My account" element using Visual Composer.

Then you can select the page you created in Woocommerce -> Settings -> Accounts-> My account page:


8. FTP details are requested when installing the theme/plugin.

The issue is connected with file permissions/ownership. 

Please edit wp-config.php file and add the following lines:

define('FS_METHOD', 'direct');
define('FS_CHMOD_DIR', 0770);
define('FS_CHMOD_FILE', 0660);

The screenshot shows where exactly it should be placed in the file: http://prntscr.com/ghshy3

In case you still have issues, please provide me with your Wordpress username/password and FTP details in the support ticket. 

Thank you!

9. How to change "Details" button text in the list of Events.

In order to change the name of events button from "Details" to your custom text,

please edit wp-content\themes\kidsplanet\fw\js\core.init.js file, line 1172:

10. How to activate standard VC shortcodes (Single image)

When you are using WPBakery Visual Composer plugin with our themes, some default VC shortcodes are removed and/or replaced by custom ones with the extended features.

Here is the example how to activate the standard VC shortcode.

To enable  Single Image shortcode, you need to open the following file in the File manager

\wp-content\themes\theme_name\(fw)/shortcodes\shortcodes_vc.php and delete the following text on line 133:

 vc_remove_element("vc_single_image");

Then save the file and make sure it is uploaded to the server.

11. "Are You Sure You Want To Do This?" / "The Link has expired" when trying to install the theme

If you are installing your theme from the WordPress theme installer, but get a message that says "Are you sure you want to do this?" , this means that your web server is configured with PHP settings that are too low to allow the theme ZIP file to upload. Specifically, PHP is configured to a maximum file upload size limit at 8 megabytes or less. The theme ZIP is about 14.5 megabytes in size. Thus, the web server is rejecting the upload. WordPress is giving you a rather ambiguous message in response. This is not a theme fault or bug.

There two ways to solve this problem.

You can verify your PHP configuration limits by installing a simple plugin called WordPress phpinfo().

Recommended PHP configuration limits are as follows:

They are required for dummy data installation.

12. Theme Widget Areas

Our themes support 7 widget areas where you can place your content, which includes:

Here's how they look like on a webpage:

How to Place a Widget into a Widget Location?

  1. Add a Widget into a Widget Area

Go to Appearance -> Widgets. Pick a widget you need, and drag it into one of the widget areas:

  1. Select Widgets in the WordPress Customizer

Go to Appearance -> Customize and open the General Settings panel if you want to select widgets for the whole website, or Blog for selecting widgets for the blog page.

  1. Select Widgets in Theme Options (Only for Separate Pages)

If you want to specify a widget set for a separate page, open that page in the admin panel and in the 'Theme Options' choose which widget set to show for which widget location.

Creating Additional Widget Areas

In some cases you may want to create an additional widget area to place your content. This is useful when you have different widget sets for different pages.

In order to do that, go to Appearance -> Widgets, enter the name and description for your new widget area, and click the 'Add' button.

Now it will appear among other widget areas on your site, and you can select it for every widget location in your theme.

13. How to Add Image Slideshow instead of Featured image

1) Disable featured image for all single room pages in Theme Options -> Single room options: 

2) Add the slider in Visual Composer to each single room page. Make sure you enable "Custom slides" in order to add slides to the slider:  


14. Google map error "Oops! Something went wrong. This page didn't load Google Maps correctly.."

Google maps has changed the standard plan policy on June 22, 2016 requiring the API key to make the map work: https://googlegeodevelopers.blogspot.com.au/2016/06/building-for-scale-updates-to-google.html This feature has been integrated into each theme update. So the steps below will help you to get rid of the error and make the map work on your website: 

1. Make sure you use the most recent theme version. Check the 'Change log' section on the theme description page to find out about the last version release.

2. Generate the Google Map API key following this link https://developers.google.com/maps/documentation/javascript/get-api-key?hl=en

3. Navigate to Theme Options -> Service section in your admin (or Appearance -> ThemeREX Addons -> API http://prntscr.com/gshf8j) , add the key into the Google Map API key field and click 'Save Options'. With that done, if the API key is generated properly, you will see the map working on the site.

15. How to Personalize a Posts Page


WordPress has been always known for its powerful blogging system. In our themes, we have expanded it even more to give you a larger control over your blog.

 There are two ways to set up and customize a blog page on your site, and here we'll cover both of them.

 

Setting Up the Posts Page in the Customizer

 Defining a Page as the 'Posts Page'

 The first thing we need to do is to define a page as the Posts Page in the admin dashboard.

 In order to do this: 

  1. Create a new page by going to Pages -> Add New, and save it.

  2. Go to Settings -> Reading and in the 'Front page displays' section, select your newly created page from the dropdown list:

 

 Customizing the Posts Page in the WordPress Customizer

 In order to customize your Posts Page, go to Appearance -> Customize -> Blog archive.

 The options you'll see there give you a detailed control over the appearance of your blog page. Here are a few of them: 

 This covers the first method of creating and customizing a blog page.

 It is suited for the default posts page on your site, however if you want to add another one, create it using the second method.

 

 

Creating a Posts Page via Blog Archive Template (Alternative Method)

 

There is another way of creating a Posts page.

 It's better suited for additional posts pages, which can be used to display a particular post type, post category, etc. Here's how you do it: 

  1. Create a new page by clicking Pages -> Add New.

  2. In the Page Attributes section on the right, select the 'Blog archive' template

  1. Save the page.

 Now if you open it in your browser, you'll see that it displays the list of posts, just as a blog page should do.

 Posts Page Settings in Theme Options

 The page created with a blog archive template can be additionally customized in Theme Options of the page.

 The Theme Options settings overwrite the Customizer values. This allows you to create a fully personalized Posts page, which would be different from the default Posts Page assigned in Settings -> Reading.

 In order to see available settings, open your blog page and click on the Content tab in the Theme Options section:

 

 

The settings would include: blog style, post type, post category, posts per page, post meta, pagination style, and post animation.

 The great thing about Theme Options is that you can decide which post type and post category you want to display on your page.

 

 Displaying Content Above and Below the List of Posts

 

On the Posts Page, you can output any content you need above and below the blog posts using Visual Composer.

 Note: the alternative way of adding content would be using the widget areas.

 By default, the content you add to the Posts Page is displayed at the top.

 However, you can place it below the main content area with the help of a text element that contains %%CONTENT%%.

 Note: This does not apply to the default Posts Page defined in Settings -> Reading.

 Here's how to do it: 

  1. Create a new page, and assign the Blog archive template to it.

  2. Switch to Backend Editor

  3. Add a new 'Text Block' element and enter the line %%CONTENT%% (in capital letters).

  4. Save the text element. Now it represents the blog posts archive.

  5. Now anything you place below/above this element will appear below/above your main content correspondingly. 

 


16. How to add a new font

The theme includes a collection of Google Fonts, which you can find in Appearance -> Fonts and colors -> Fonts.

 

 

However the list of available fonts can be expanded by adding new ones.

 Adding a New Google Font

 If you want to add a new font from the Google Fonts library, open the core.lists.php file in the  wp-content/themes/theme_name/fw/core/ directory.

 Find the themename_get_list_fonts() function, and locate the list of available fonts.

 

 

You'll see an array of Google fonts. Duplicate one of the font entries and replace the name of the font with your own. The line would look like this:

 'Cabin Condensed' => array('family'=>'sans-serif'),

 If in doubt which name to pick, consult with the Google Fonts repository.

 After saving the file, go to the admin panel, and navigate to Appearance -> Fonts & Colors -> Fonts. Now your new font is available for all typography elements.

 Adding a Custom Font

 1. In the css/font-face/ directory, create a new folder and give it a name of your font.

 2. The folder has to contain a @font-face kit, which would load your custom font on a webpage.

 The easiest way to create it is by using a webfont kit generator, such as Font Squirrel Generator (visit our tutorial to see how to use it).

 3. Extract the generated archive into /css/font-face/your-font-name.

 Important! Make sure that the name of your folder corresponds with the font-family value in the stylesheet.css.

4. Optional! You may also need to  to register your font name in functions.php.

Open up functions.php and find a line with 'required_custom_fonts'. Add the name of your font preceded by comma.

 

 Now if you go to the Appearance -> Fonts & Colors -> Fonts, you'll see your new typeface available among the other fonts. 

 

17. How to add uploaded font to HTML theme

1) In the /css directory, create a new folder /fonts and add the font folder inside.

The folder has to contain a @font-face kit, which would load your custom font on a webpage.

 The easiest way to create it is by using a webfont kit generator, such as Font Squirrel Generator (visit our tutorial to see how to use it).

 Extract the generated archive into /css/fonts/your-font-name.

2) Open style.css file and add @font-face rule (it can be copied from css/fonts/Amadeus/stylesheet.css file):

Just make sure that the file path is correct.

3) Then edit the h1-h6 tags adding the new font -family where you need it on the site. (h1 on the screenshot)

18. Bundled Plugins License & Activation Questions

When a premium plugin is bundled with the theme, you can use the plugin without any issues. Such plugins are fully functional even though you don't get a plugin purchase code for activation. 

 Since you purchased a bundled product, you do NOT have a license key for that plugin so you can’t enter anything in this field. Updates to the plugins are provided when the theme itself is updated and via tickets.

However, if you want automatic updates and support from the plugin developer you need to purchase it separately (this is 100% optional). 

19. Fatal error: Call to undefined function mb_strtolower() in..

If you get the following error after activating the theme " Fatal error: Call to undefined function mb_strtolower() in..",

mbstring PHP function is missing in your server configuration. Please contact your hosting provider to enable mbstring PHP function on your server.

In case your hosting provider cannot enable it, please submit a support ticket and provide us with your FTP details: FTP hostname, username and password.

20. How to edit/remove Get in touch form in slider.

"Get in touch" bar is added as a shortcode to Revolution slider in Static/Global Layers. 

You can customize the form in terra-atma/fw/shortcodes/shortcodes.php file, lines 4213-4220:

: '<div class="sc_contact_form_info">'
. '<div class="sc_contact_form_item sc_contact_form_field get_in_touch">' . esc_html__('Get in touch', 'terra-atma') . '</div>'
. '<div class="sc_contact_form_item sc_contact_form_field label_over contact_form_username"><input class="sc_contact_form_username" type="text" name="username" placeholder="' . esc_html__('Name', 'terra-atma') . '"></div>'
. '<div class="sc_contact_form_item sc_contact_form_field label_over contact_form_email"><input class="sc_contact_form_email" type="text" name="email" placeholder="' . esc_html__('E-mail', 'terra-atma') . '"></div>'
. '<div class="sc_contact_form_item sc_contact_form_field label_over contact_form_phone"><input class="sc_contact_form_phone" type="text" name="phone" placeholder="' . esc_html__('Phone', 'terra-atma') . '"></div>'
. '<div class="sc_contact_form_item sc_contact_form_field label_over contact_form_date"><input type="text" name="date" placeholder="' . esc_html__('Date', 'terra-atma') . '" class="sc_contact_form_date sc_contact_form_date js__datepicker"></div>'
. '<div class="sc_contact_form_item sc_contact_form_button"><button>'.esc_html__('SUBMIT', 'terra-atma').'</button></div>'
. '</div>'

21. How to Edit Slider on the Shop Page

Please navigate to Theme Options and switch to Woocommerce Stream options in the top dropdown: 

Then you will be able to manage the Header custom code in Header tab.

22. How to translate months names in Content Timeline Plugin

You can change the month names in Content Timeline plugin directly in files:

1) line 418 of wp-content\plugins\content_timeline\pages\front_html.php


2) Line 55 of wp-content\plugins\content_timeline\js\frontend\jquery.timeline.js


23. How to Disable a Blue Bar over Slider

In order to delete the blue bar on the slider, please add the following lines to Theme Options -> Other -> Additional css/html -> Your custom css code:

.content .rev_slider_wrapper .slotholder:after {background-color: transparent !important;}
.rev_slider_wrapper .slotholder:before {
display:none;
}

24. How to get header logo bigger

You can get logo enlarged by adding extra css to override max-height for logo set in this theme. Please check sample codes below:

.top_panel_wrap .logo_main {    
max-height: 120px;
}
/*to enlarge header section*/
.top_panel_style_3 .top_panel_middle {    
min-height: 8.5em;
}
/*sticky header logo*/
.top_panel_wrap .logo_fixed {   
 max-height: 100px;
}
/*to enlarge top margin of menu*/
.top_panel_fixed .menu_main_wrap {   
 padding-top: 2.39em;
}

You edit codes above with values best fit your site needs.

Codes can be added at Appearance -> Theme Options -> Other section or your child theme style.css file or Appearance -> Customize -> Additional CSS section.

25. How to set up Google Maps without API key

Googlemaps has changed their policy: https://developers.google.com/maps/documentation/javascript/usage-and-billing

As of July 16, 2018, to continue to use the Google Maps Platform APIs, you must enable billing on each of your projects. If you choose not to add a billing account, your maps will contain "For development purposes only" message.

Googlemaps API key is needed for built-in theme map element offering extended options for map style, zoom and marker.

However, you may use a standard Google Maps element of WPBakery page builder which does not require API key. 


All you need is to find your location on Googlemaps website, open its burger menu in the top left corner and select " Share or embed map" in the list. Then copy the HTML code in "Embed a map" tab:


26. How to Edit "More Info" Button Text (section under the slider)

If you want to change button name "More Info", you can do it editing file 
wp-content\themes\optima\fw\shortcodes\shortcodes.php (line 555)

27. How to Manage Room details

You can remove and add the room types in Theme Options: 

The single room parameters are edited in Room options -> Room details. Please check the screenshot: 



28. How to enable Visual Composer on custom post types (team, services etc)

In order to enable Visual Composer on custom post type pages, please navigate to Visual Composer -> Role Manager menu and select "Custom" post types as shown on the screenshot:

29. Services background disappears.

The background colors for Services section on the demo are added for 3 column design. In case you change the number of columns to 4, the backgrounds will be lost. This is how it will look:

Please navigate to Theme Options -> Other -> Your custom css code and add the following lines to set the colors you need:

.scheme_original .sc_services_style_services-2 > .sc_columns > .column-1_4:nth-child(3n+2) > .sc_services_item {   background-color: #fc5640; }
.scheme_original .sc_services_style_services-2 > .sc_columns > .column-1_4:nth-child(3n+1) > .sc_services_item {     background-color: #6570bf; } 
.scheme_original .sc_services_style_services-2 > .sc_columns > .column-1_4:nth-child(3n) > .sc_services_item {     background-color: #ffcb47; }

30. How to change Services icons.

You can change the icon for each Service post in admin -> Services, open single Post options and switch to Blog and single -> Single page. Please check the screenshot: 

Fontello source files are located in theme_name/css/fontello folder.  You can see the list of all icons opening theme_name/css/fontello/demo.html file in the browser. 

In order to add new fontello icons to the theme list, please use the following tutorial:


31. Enabling pinch to zoom on mobiles

In order to enable pinch to zoom on mobiles, please open header.php file (it can be functions.php ) and delete the following code (approximately on line 23):

 , maximum-scale=1


32. How to edit the banner image and wording on the shop pages.

In order to edit the top banner image and text on the shop and product category pages, please go to Theme Options and switch to Woocommerce Streampage options -> Header.


Header custom code and image can be modified there:



33. How to modify the header banner on the Shop page

In order to edit the header banner on the shop pages, please navigate to Theme Options, switch to Woocommerce streampage options -> Header and modify header advanced shortcode and image there.

34. How to Edit/remove the Form over the Slider.

The form over the slider is added in Pages -> Home. Please scroll down to Post Options -> Slider -> Put content over slider. Here is the screenshot: 

You can generate any other custom form using Visual Composer (on the test page): 


Then paste the code to "Slider" tab.


35. How to Change the Number of Products on Shop page

You can change the number of products per page in Theme Options. Switch yo Blog Woocommerce Options in the top dropdown.


Then open Blog & Single -> Stream page. Blog posts per page should be changed.


36. How to Сhange Googlemap Location (address)

The map location can be either entered in Theme options -> Footer -> Google map parameters



Alternatively, you can add "Googlemap marker" element inside "Google map" using Visual Composer:


The map api key is entered in Theme Options -> Service -> Google api key: http://prntscr.com/ewbhwj

Here is the guide how to get it: https://developers.g...t-api-key?hl=en

37. How to edit "Make an Appointment" in slider

In order to edit "Make an Appointment" in slider, please navigate to Revolution slider in admin. You can find the button under Static/Global Layers of slider. Please follow the screenshots below to understand the process:



38. How to add Appointment Button in Menu


Appointment tab in the top menu is a custom link item added in Appearance -> Menus.

You should define css class "appointment"  for it to get it looking the same as on demo:

CSS Classes in the menu can be enabled in the top right corner in Screen Options:


39. Service/Team pages give 404 error

If you get 404 error at services pages, please try to do the following:

1) Navigate to Settings -> Permalinks 

2) Enable Plain (default) permalink structure and save the changes.

After this step you can switch to the Custom (Postname) permalink structure again.

40. I can't translate the word "Share:".

You need to go to Theme Options - Socials and change the word in the field Share block caption.

41. How to edit "GET Your Transportation Quote" text and buttons over the slider.

This article explains how to edit the text and buttons over the slider:

Please navigate to Pages -> Homepage. Open Post options -> Slider  and customize Content over slider: 

To change the url of the buttons, add 

link="#"

with the link you need.

42. How to Сhange Link on Enroll Now button in Header

You can change the following button link 

editing wp-content\themes\sevenhills\templates\headers\header_3.php, line 69:

43. How to translate "Send us a message" Title of Contact us form

Please navigate to Appearance -> Editor and open footer.php file for editing: The text can be modified there:

44. How to add a New Font

Writer Blog theme includes a collection of Google Fonts, which you can find in

Appearance -> Fonts and colors -> Fonts.

 

2017-06-15_1553.png

 

 

However the list of available fonts can be expanded by adding new ones.

 

Adding a New Google Font

 

  1. Open the core.lists.php file in the /fw/core/ directory, and find the get_list_fonts() function. You'll see an array of Google fonts.

 

2017-06-15_1545.png

 

  1. Duplicate one of the font entries and replace the name of the font with your own. The line would look like this:

 

'Cabin Condensed' => array('family'=>'sans-serif'),

 

In order to enter the correct values, go to Google Fonts, select the font you're going to use, and check its CSS rules.

 

2017-06-15_1606.png

 

  1. Save the changes.

 

Now your new font is available in the font settings for all typography elements.

 

Adding a Custom Font

 

  1. In the css/font-face/ directory, create a new folder and give it a name of your font.

 

  1. The folder has to contain a @font-face kit, which would load your custom font on a webpage.

 

The easiest way to create it is by using a webfont kit generator, such as Font Squirrel Generator (visit our tutorial to see how to use it).

 

Extract the generated archive into /css/font-face/your-font-name.

 

Important! Make sure that the name of your folder corresponds with the font-family value in the stylesheet.css.

 

  1. The only thing left now is to register your font name in functions.php.

 

Open up functions.php and find a line with 'required_custom_fonts'. Add the name of your font preceded by comma.

 

2017-06-15_1547.png

 

Congratulations! Now if you go to the Appearance -> Fonts & Colors, you'll see your new typeface available among the other fonts.

 

 

45. How to remove white border over the slider

In order to remove white border over the slider, you need to add the following line of code to Theme Options -> Other -> Your custom css code:

.scheme_original .top_panel_over .slider_wrap .slotholder:after {border:none !important;}


46. How to change footer background image

Footer background image is added in style.css file. You can access it in Appearance -> Editor:

.big_footer_bg {

background: url(images/footer_bg.jpg);

border-top: 4px solid;

}


In other words, the image can be replaced either in file manager ( wp-content/themes/kraussersfarm/images/footer_bg.jpg) or you can edit the image url in style.css file.

47. How to edit/translate "All posts" page title.

Page title "All Posts" can be changed either in language file in theme_name/languages folder using Poedit software or directly in  wp-content/themes/theme_name/fw/core/type.post.php file (support.post.php),  line 359.  Please search for the text in the document in case the text is not found on this line.

 $title = esc_html__( 'All Posts', 'theme_name' );

48. How to change a footer background image

The footer background image is added in style.css file on line 4958:

.contacts_wrap_inner, .footer_wrap_inner.widget_area_inner {
background-image: url(images/bg/bg_footer.jpg);
}


You can either replace the following image in File manager : /wp-content/themes/sevenhills/images/bg/bg_footer.jpg  or add a new line of code to Theme Options -> Other -> Your custom css code with the needed image url:

.contacts_wrap_inner, .footer_wrap_inner.widget_area_inner {
background-image: url(images/bg/bg_footer.jpg) !important;
}

The css changes added like this will not be lost after the theme update.

49. Theme options are lost after the the child theme activation.

In case you activated the child theme after dummy data installation, some theme options will be lost (That was the requirement of the Themeforest team). In order to disable this behavior, please open wp-content / themes /your_theme_name /includes/theme.options.php file and look for the code like this:

// Clear all saved Theme Options on first theme run
        add_action('after_switch_theme', 'theme_options_reset');

where "theme" is your theme name.

You need to comment the function:

// Clear all saved Theme Options on first theme run
        //add_action('after_switch_theme', 'theme_options_reset');

Then save the file and upload it to the server.

50. How to Add a New Font

The theme  enables you to use both Google Fonts and custom fonts in your design. In order to navigate to the font settings, go to Appearance -> Customize and select the Fonts Settings section at the bottom.

 

 

Your theme can load up to 3 different font families, including different styles and weights for each typeface.

How to Add a New Google Font

 In order to add a new font, go to the Load Fonts section.

 You'll find there the settings for each of the 3 font families available. Choose where you'd like to add a new font (Font 1, Font 2 or Font 3 sections), and fill out the font name, family and styles. If needed, make sure to double check the font details in the Google Fonts directory.

 

After filling out the details, click 'Save & Publish' and hit the F5 key to refresh the page.

 Now your font is available in your font settings. Navigate to the element you want to customize, and you'll be able to use the newly added typeface.

 E.g. if we go to the Heading 2 settings, we can select our new font in the dropdown list.

 

 

Make sure to save the changes and refresh your site.

  

Adding a Custom Font

 

When adding a font that is not included in the Google Fonts library, the process would involve an additional step of adding the font source files into the theme folder.

 Go to the wp-content/themes/free-church/css/font-face/ folder. That's where all of your custom fonts are located.

 Create a new folder and name it after your font. E.g. if your font name is 'Futura', the name of the folder should also be 'Futura'. Replace all the spaces in the folder name with dashes '-'.

 If your font has multiple styles and weights, make sure to create a separate folder for each of them.

 Your new folder has to contain a @font-face kit, which would load your custom font on a webpage. The easiest way to create it is by using a font face kit generator, such as Font Squirrel Generator.

  

 Upload your font file to the Font Squirrel Generator, and download the generated archive.

 Once you've got the archive, extract it into the newly created folder.

 Important! Make sure that the name of your folder corresponds with the font-family value in the stylesheet.css. Also, check that the spaces in the folder name are replaced with dashes '-'. E.g. if your stylesheet contains: font-family: 'Bebas Neue Bold', the name of your folder should be 'Bebas-Neue-Bold'.

 Now you need to do all the steps described in the first part of this article, which are as follows:

 Go to Appearance -> Customize -> Fonts Settings -> Load Fonts.

  1. Enter the font name, family and style.

  2. Save changes and hit the refresh button.

  3. In the Font Settings choose the element you want to customize. The new font is now available in the 'Font family' drop down list.

  4. Select the new font, save the changes, and refresh your page.

 Congratulations! If you visit your site now, you'll see your custom font in action.

 

 

51. How to add the Google Map API in the HTML theme

Google Maps have recently changed their policy and API key is now required to make the map work. 1. Generate the API key following this link https://developers.google.com/maps/documentation/javascript/get-api-key?hl=en 2. Open pages-contact-us.html file (or other page containing the map) and replace this piece of code:

<script type="text/javascript" src="hhttp://maps.google.com/maps/api/js?sensor=false"></script>

with:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?key=********************"></script>

where ******************** is your Google Map API key. 3. With that done, please save the file and you will see the map working on the site.

52. How to use .pot file to translate the theme.

We recommend using Poedit software for translation-related purposes. To translate the theme to your language, please follow these steps:

  1. Download and install Poedit software.
  2. Navigate to the themes/theme_name/languages/ folder and locate .pot file. Copy it to your desktop for editing.
  3. Double click on the .pot file. In the Poedit window click on the "Create New Translation" button, choose the necessary language of the translation from the dropdown list and click "OK."
  4. Now select the constant text string you need to translate from the "Source text - English" field and type in the necessary translation into the "Translation" field. You can translate as much as you want, just go through the file and click on each string in Poedit and add your translation.
  5. Next, you have to save the changes to your .po file using the naming convention based on the language code (e.g. ptfor Portuguese) followed by the country code (for instance _BR for Brazil). To do that click on the "sheet" icon (you can also use hotkeys CMD+Shift+S in OS X or Win+S in Windows) and type in the name according to the screenshot below. The first lower-case letters define the language, whereas the second upper-case letter defines the country. In most cases, the language and country are the same, like “de_DE” for Germany. However, there is a difference for languages like English or Portuguese, which are spoken in several countries natively. In this case, the difference is in the first and second letter pairs; for the UK, the code would be en_GB, whereas the en_US stands for the USA. If you are not familiar with the codes for your native language and country, then visit the GNU website.  See Language Codes and Country Codes for the lists of codes. Please note, if you use the wrong naming convention WordPress can not process your translation.
  6. When saving your .po file, Poedit automatically creates a new .mo file, with the same naming convention. According to the example above, the file would be called pt_BR.mo.
  7. Upload the .po and .mo files you just created to the .../languages/ folder. Make sure these files are in the same directory as the default.pot one.
  8. OPTIONAL! Some themes are using Themerex Addons plugin, so most of the translation are done in language files of this plugin in this directory: wp-content\plugins\trx_addons\languages. There you will see trx_addons.pot file. Please, generate .po and .mo files according to your language, the file names should look like this: trx_addons-fr_FR.po and trx_addons-fr_FR.mo. 

 !Important Make sure that the language of your files is the same as in your Wordpress admin panel - Settings - General Settings.

53. How to set up Wordpress Social login plugin

This article will guide you how to set up Wordpress Social login plugin with our theme. You can download the plugin here: wordpress.org/plugins/wordpress-social-login/

In order to make this plugin to work, you should replace the code of your social icons in your login.php file or page-part-login.php ( it can be another file) with this code :  <?php do_action( 'wordpress_social_login' ); ?> 

 To find the file you need to modify, follow these steps, please:
1. Look for this class name in theme files: 


2. Edit the code of the php file. Here is a screenshot:


3. Then follow plugin's recommendations. (You need to set up Application ID: and ApplicationSecret: for your social networks.)

54. How to Remove Events in the Header Slider

In order to remove the events feed in the slider, please go to admin -> Revolution slider and open the homepage slider. Then select Static/Global layers:

Click on the following icon to see the layers:

Now you can remove the layer containing events shortcode:


55. How to Add New Fonts (Customizer)

Isida allows you to use both Google Fonts and custom fonts in your design. In order to navigate to the font settings, go to Appearance ->Customize -> Fonts Settings.

 


 

Your theme can load up to 3 different font families, including different styles and weights for each typeface.

 

How to Add a New Google Font

 

In order to add a new font, go to Appearance -> Customize -> Fonts Settings -> Load Fonts.

 

You'll find there settings for each of the 3 font families available.

 

Fill out the font name, family and styles. If needed, make sure to double check the font details in the Google Fonts repository.

 


 After filling out the details, click 'Save & Publish' and hit the F5 key to refresh the page.

 Now your font is available in your font settings. Navigate to the element you want to customize, and select the newly added typeface from the dropdown list.

 

Adding a Custom Font

Note: We recommend using child themes when making adjustments to the core theme files. If you decide to use a child theme, copy the edited files into the child theme folder, preserving the original folder structure.

  1. Go to css/font-face/ and create a new folder with the name of your font.
  2. The folder has to contain a @font-face kit, which would load your custom font on a webpage.

 The easiest way to create it is by using a font face kit generator, such as Font Squirrel Generator (visit our tutorial to see how to use it).

     3. Extract the generated archive into /css/font-face/your-font-name.

 Important! Make sure that the name of your folder corresponds with the font-family value in the stylesheet.css. If the folder name contains spaces, replace them with dashes '-'.

     4. Go to Appearance -> Customize -> Fonts Settings -> Load Fonts and add your font as described in the first part of this article.

56. How to edit/remove "Emergency" text in header

"Emergency" wording is edited in wp-content\themes\kidsplanet\templates\headers\_parts\top-panel-top.php file, line 35:



57. ThemeREX Services Shortcode

ThemeREX Services is a custom shortcode for Visual Composer that lets you display a services block on your website.

You can find it under the ThemeREX tab when you add a new visual composer element.

Although the shortcode can pull data from both posts and pages, preferably it should be used with the Services custom post type.

In order to add a new service, click Services -> Add New in your WordPress dashboard.

If you want a service post to display correctly, besides the title and description, fill out the service Excerpt field, as well as add a post icon and a featured image.

If for some reason you don't see the Excerpt field, enable it in the Screen Options panel at the top right corner of your screen.



For more details on the shortcode features and options, view the demonstration video below:


58. How to solve "Fatal error: Allowed memory size of xx bytes exhausted (tried to allocate xx bytes)".

You can increase memory_limit on your server in several ways (back up any files you edit to be able to restore them):

1. Try adding this line to your wp-config.php file:

define('WP_MEMORY_LIMIT', '128M');

2. If you have access to your PHP.ini file, change the line in PHP.ini

If your line shows 32M, change it to 128M:

memory_limit = 128M ; Maximum amount of memory a script may consume (128MB)

3. If you don't have access to PHP.ini try adding this to an .htaccess file:

php_value memory_limit 128M

4. If all the methods mentioned above do not help, create a file called "php.ini" in the "wp-admin" folder of wordpress install.

Add the following text to the file;

memory_limit = 256M ;

5. Contact your hosting provider.

59. How to translate "Home" in breadcrumbs

"Home" text in breadcrumbs can be translated using theme language files located in theme_name/languages folder using Poedit software (free at https://poedit.net/download). 

Alternatively, the text can be translated directly in wp-content/themes/theme_name/fw/core/core.wp.php file:


60. How to change team member excerpt

If you cannot see custom team member text in Visual Composer (backend/frontend editor), you should switch to Classic mode and find the texts to modify:


61. How to Customize Layouts


Layouts is a tool for creating and customizing headers, footers, and other parts of your website. It is based on the Visual Composer page builder.

 Although it's not the single usage of Layouts, you can think of them as Visual Composer for headers and footers.

 Traditionally, Visual Composer has been enabling you to customize pages, however the header and footer sections remained untouched.

 Now you have a full freedom over your header and footer, and can even expand your website with additional elements.

 In this article, we'll cover the details on how to use Layouts.

  How to See Which Layout Is Enabled Right Now

 If you want to know which Layout you're currently using, go to Appearance -> Customize, select Header (or Footer, depending on which one you want to explore) and view the Header style option.

 

 This is the list of available Header Layouts (i.e. headers). If you want to select a different header, that's where you need to do it.

 You can also set a specific Layout for a dedicated page. Go to Pages -> All Pages, select the page you want to customize, and in the Theme Options section at the bottom choose the necessary Header style or Footer style.

 

 

Note: For your home page, you can specify the necessary layout right in the Customizer in Homepage -> Header style.

 Exploring Layouts

Layouts are not limited to headers and footers only and can be used to add different kinds of elements to your site.

 Where Are the Actual Layouts Located?

 In order to view the available Layouts, go to Layouts -> All Layouts.

 You can see that sometimes beside headers and footers, there are additional Layouts, such as Galleries, Actions, Events, etc. Each theme has a different collection of Layouts.

 

 

If you open any of them, you'll see the familiar Visual Composer editor, which means you can customize them the same way you've been customizing your pages.

 

 Going Beyond Headers & Footers: Layout Shortcodes

 In its essence, a Layout is a Visual Composer's row.

 With that in mind, you can place them in any location on your page.

 In order to add a ready-made Layout as a Visual Composer row, you need to:

 

  1. Add a new Visual Composer element, click on the ThemeREX tab, and select Layouts.

  2. Choose your Layout from the dropdown list. This is the same list of Layouts you've seen in Layouts -> All Layouts in your admin dashboard.

 

 Creating Your Own Layout

 You can build Layouts using existing Visual Composer elements, however there are also custom elements for building layouts.

 In order to access them, click Layouts -> Add New, open the Backend editor and add a new Visual Composer element. In the ThemeREX tab, you'll see the available Layout shortcodes.

 

 

They include Logo, Search form, Shopping cart, Menu, etc., and would come in handy when building Layouts for headers and footers.

 

 Useful Layout Settings

 There's a number of things you can do to a Layout.

 For example, you can hide it on mobile phones or tablets, or choose to disable it on a front page.

 You can also make your header stick to the top, by fixing the element's row.

 In order to change its settings:

 

  1. Click on the row settings of a container element

  2. Go to Custom Layouts and check the necessary boxes:

 

 Layout Templates

If you need to create a new Layout, but don't want to create it from scratch, you can use a library of Layout templates to get you started.

 

Creating Layouts from Templates

 

In order to create a new Layout from a template:

 

  1. Click Layouts -> Add New

  2. Choose Backend Editor

  3. Click the Templates icon

  4. Select a template from the list

 

 

Saving Current Layout as a Template

 

You can also save the current Layout and use it later as a template. In order to do this:

 

  1. Click the Templates icon

  2. Enter the name of your template and click 'Save template'

  3. Now you can find it in the templates list

 

 

 

62. How to Edit Homepage Banners under Slider

You can edit banners section in Post Options of Home page -> Header and Footer -> User's grey header content:


63. How to Add Another Social icon

To add another icon you'll need to edit the plugin file. Please follow steps below:
1. Open file /wp-content/plugins/trx_addons/includes/plugin.options.php to edit
2. Add extra piece of code with required profile name
e.g. LinkedIn


'socials_linkedin' => array(
                "title" => esc_html__('Linkedin', 'trx_addons'),
                "desc" => wp_kses_data( __("Link to your profile in the Linkedin", 'trx_addons') ),
                "std" => "",
                "type" => "text"
            ),

3. Save the file.

4. Then you will find a new icon option in Appearance -> Themerex Addons -> Socials.

64. "Error load data from file" when installing dummy data.

In case you get "Error load data from..." messages when installing dummy data, this means that the import from external files is not allowed on the server.


Please enable allow_url_fopen on the server using one of the following methods:

1) edit .htaccess file and add line: 

php_value allow_url_fopen On 

2)  edit php.ini file and add line:

allow_url_fopen = On; 

3) Contact your hosting provider.

In case you still have any issues, please provide your website details in the support ticket:

1) website url and Wordpress username/password

2) FTP details: FTP hostname, username and password

3) Direct link to PHPMyadmin tool (or your hosting Cpanel credentials).


65. Google map error "Oops! Something went wrong. This page didn't load Google Maps correctly.."

Google maps service has changed the standard plan policy on June 22, 2016 requiring the API key to make the map work: https://goo.gl/D9HE9U This feature has been integrated into each theme update. So the steps below will help you to get rid of the error and make the map work on your website:

1. Generate the Google Map API key following this link https://developers.google.com/maps/documentation/javascript/get-api-key?hl=en

Make sure you added http:// before the URL.

3. Navigate to Appearance -> ThemeRex Addons -> API section in your admin, add the key into the Google Map API key field and click 'Save Options'. 

With that done, if the API key is generated properly, you will see the map working on the site.

66. How to change the text/link of Enroll now button

"Enroll now" button is enabled in Theme Options -> Header -> Main menu style and position:


The link of the button is changed in sevenhills/templates/headers/header_3.php file on line 69:

echo trim(sevenhills_sc_button(array('link'=>"/appointments/","size" => "small","class"=>'appointments_button', 'style'=>"border"), sevenhills_get_custom_option('appointment_caption')));

You need to replace only "/appointments/" with the needed url:




67. How to add Team member/team group pages and other post types to the menu.

In case you want to add team member/group pages (or any other post types) to the menu but do not see this option in Appearance ->Menus, please open "Screen Options" in the top right corner of the page and select the options you need.


Then you will see these items available in the list so you can add them to the menu.