Custom color for the header is not available in the theme settings. You have to manually add custom CSS to set it.

Here’s the custom CSS to change the background color of the dark header. You can add it into Theme Options -> Advanced -> Head Content:

<style type="text/css">

    #header.w-dark:before {
        background: #0775ff;
    }

</style>

Also, the code above will affect only dark header, please make sure you’re using the Dark version of the Header Background.

Hi There,

I should have elaborated myself. I want a different header nav color for every page in my website. Home page – Blue, Blog Page – Yellow, About Page – Red etc.

Also I want to add a secondary navigation on my about page.

As you know this is not available in the theme features and design.

Anyway, to work around this you should add custom CSS to the Page Settings instead so you can set different background color for each page.

When you edit the page, click on the settings icon, see the picture below:

And then put the code below to the Custom CSS settings:

#header.w-dark:before {
        background: #0775ff;
}

Regarding the secondary navigation, try to use a Custom Menu widget to see if it works.

1. Go to Appearance -> Menus to create new menu.

2. Edit your About Page, add a WP Custom Menu to the page and then choose the menu created from the first step.

Hi There,

I updated the my wordpress to 4.8 and I lost all my content. Even after I made all the changes in the overlap child theme. Please help!

Thank you in advance.

I can’t even restore my backup as it is very old. Now when I reworking from scratch I can’t override the parent theme. Please help!

Usually, updating WordPress won’t affect your current content and settings.

Also, we have tried this theme on WordPress 4.8 and it’s working properly.

I guess that this is a compatibility issue of the plugins. There may be some plugins on your site are not compatible with the latest update of WordPress. Try to deactivate your plugins one by one to find the problematic plugin.

If it still doesn’t work, there may be something wrong while you update your WordPress site. Try to re-install the new update to see if it works.

Please make sure you have updated all bundled plugins. The latest update of this theme requires the latest update of Wyde Core plugin. You can see more details on how to update bundled plugins in our documentation.

Thanks for this however I have done all necessary plugin updates with the update of the theme…. the problem is the same.. still pictures missing.. sliders… testimonial.. blog section (just titles show)... are all missing… pretty much half the website does not show… can you send me your email address so I can send you the access details to see for yourself definitely a problem once it’s updated and plugins as well….?

You can send me your site credentials in the contact form on the profile page: https://themeforest.net/user/wyde#contact

THank you.. have just emailed you!

Thank you for the email!

However, now you’re using the old version of the theme and all bundled plugins so everything seems to be working fine. I couldn’t find what exactly problem. Could you please update the theme and all bundled plugins to the latest update?

Try to add !important after your new CSS value as below:

font-weight: 700 !important;

Also, you can change the typography settings in Theme Options -> Typography for some elements and sections without using custom CSS.

Hey,

Thanks for the reply. I can overwrite the styles using !important, but as I’m doing extensive customisation, this is not a good solution.

By default WordPress adds stylesheet file of the child theme automatically. You can change the priority of this file by adding custom function below into functions.php in your child theme:

function overlap_child_theme_enqueue_styles() {

    wp_dequeue_style( 'overlap' );    
    wp_deregister_style( 'overlap' );    
    wp_dequeue_style( 'overlap-main' );
    wp_deregister_style( 'overlap-main' );  

    // Add main stylesheet
    wp_enqueue_style('overlap-main', get_template_directory_uri() . '/css/main.css', null, null );

    // Add child theme stylesheet file
    wp_enqueue_style( 'overlap', get_stylesheet_directory_uri() . '/style.css', array('overlap-main'), null );

}
add_action( 'wp_enqueue_scripts', 'overlap_child_theme_enqueue_styles', 100 );

If you already have that function in your child theme, you can edit and replace with the new one above.

Oh yep. That’s exactly what I as looking for. Thanks! And to make sure the child/style.css is enqueued after shortcodes.css? I’m trying:

function overlap_child_theme_enqueue_styles() {

    wp_dequeue_style( 'overlap' );
    wp_deregister_style( 'overlap' );
    wp_dequeue_style( 'overlap-main' );
    wp_deregister_style( 'overlap-main' );
    wp_dequeue_style( 'overlap-shortcodes' );
    wp_deregister_style( 'overlap-shortcodes' );

    // Add main stylesheet
    wp_enqueue_style('overlap-main', get_template_directory_uri() . '/css/main.css', null, null );

    // Shortcodes
    wp_enqueue_style('overlap-shortcodes', get_template_directory_uri(). '/css/shortcodes.css', null, null);

    // Add child theme stylesheet file
    wp_enqueue_style( 'overlap', get_stylesheet_directory_uri() . '/style.css', array('overlap-main'), null );

}
add_action( 'wp_enqueue_scripts', 'overlap_child_theme_enqueue_styles', 100 );

But I must have something wrong as it’s not working.

Try this:

function overlap_child_theme_enqueue_styles() {

    wp_dequeue_style( 'overlap' );
    wp_deregister_style( 'overlap' );
    wp_dequeue_style( 'overlap-main' );
    wp_deregister_style( 'overlap-main' );
    wp_dequeue_style( 'overlap-shortcodes' );
    wp_deregister_style( 'overlap-shortcodes' );

    // Add main stylesheet
    wp_enqueue_style('overlap-main', get_template_directory_uri() . '/css/main.css', null, null );

    // Shortcodes
    wp_enqueue_style('overlap-shortcodes', get_template_directory_uri(). '/css/shortcodes.css', null, null);

    // Add child theme stylesheet file
    wp_enqueue_style( 'overlap', get_stylesheet_directory_uri() . '/style.css', array('overlap-main', 'overlap-shortcodes'), null );

}
add_action( 'wp_enqueue_scripts', 'overlap_child_theme_enqueue_styles', 100 );

Hi There,

By default the blog page always displays the pagination, you couldn’t remove it.

However, if you’d like you can create a custom blog page by using Blog Posts element so you can hide the pagination for the blog posts:

1. Go to Settings > Reading, do not set the Posts Page so you have to choose “-—Select--” (the first option).

2. Go to Pages to edit your blog page with the page builder, and then add a Blog Posts element.

3. In the Blog Posts Settings window, choose “Hide” for the “Pagination Type”. You can also choose any options for your blog page in the Overlap Options box at the bottom of the page (i.e. Page Layout, Sidebar, etc.).

4. Go to Theme Options -> Blog -> Blog Single Post, choose “Custom” for the “Blog Home Page” and then set the blog page URL.

Hi there,

Thank you for your questions!

All you will get are exactly the same as you see on our demo. This theme comes with 3 different blog layouts as you can see here: http://wydethemes.com/overlap/blog/blog-masonry/

Actually both featured image and heading are in the center of the page as you can see here: http://wydethemes.com/overlap/unlimited-choices/

Anyway, you can set the styles of the post heading so it can be in the left or right.

i think you did not get my point overlapping style Post with Heading and Image About Size of 590×300 is in that post it will not be the same as in demo the image itself will be on the left and heading in center feature image needs to be same size as original but should be in the center like heading and the rest of the post

http://wydethemes.com/overlap/at-some-point/ in this demo u can see image is very large due to which it is adjusted but we are gonna make same blog as my friend did and images we will be using are small in size 590×300 when he uploaded it on post as featured image it was small and moved itself towards left side which is not in center now can u tell me is that an issue or its just an image size that is making this problem because we have no HD images to use on blog

Could you please PM me your portfolio page URL: https://themeforest.net/user/wyde#contact

Hi there,

Thank you for the detailed explanation and the links.

By default this theme doesn’t allow you to zoom out past the original size since the minimum scale of the ‘viewport’ meta tag was set to 1.0 (original size). I just tried it on our demo site, everything is working fine, when I try to zoom out, it always displays the original size automatically. If you’d like you can try it here: http://wydethemes.com/overlap/

Try to update the theme to see if it works. If it doesn’t work, there may be some plugins on your website disable this feature. You should deactivate other plugins one by one to find the problematic plugin.

Thank you, I tried removing all plugins but didn’t have any luck so I’ve just deleted the border.

Could you please tell me how to remove the top-padding on all pages on mobile. I’ve tried the below CSS in the ‘additional CSS section’, but had no luck.

/* @media all and (min-width: 800px) { .w-section.w-overlap-box { top-padding: 0px!important; } } */

Thanks!

1. As I mentioned above, you should update the theme first. If you’re using the old version of the theme that is different from our demo site so I couldn’t find the exact problem and couldn’t provide the right solution for you.

2. You don’t need to add custom CSS to remove the padding. But you should set the “Padding Size” in the column settings to “No Padding”. Of course now you’ve set the “Vertical Padding Size” for the row but you have to edit the column settings to set the “Padding Size” to “No Padding” too.

Thanks, I’ve updated the theme. Could you please assist me with the below, for my website: http://www.viragocreative.com/

1: I’d like to know how to delete borders from viewport on mobile. I tried this CSS but it didn’t work:

@media all and (min-width: 800px) { .vc_custom_14948410694 { border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; } }

2: The Search Engine Optimisation icon box is a bit lower than all of the others on this page. I’d like to know how to make the icon boxes even: http://www.viragocreative.com/expertise/

3: How/where do you add a favicon?

4: I’ve added my email to my mobile menu, but I’m unsure how my mailto URL. At the moment, it’s unclickable.

Thanks, Bianca.

1. If you add borders in Design Options tab, they will always show on any devices. Here’s the custom CSS to remove the borders from both “Expertise” and “About” boxes on mobile:

@media screen and (max-width: 991px) {

.vc_custom_1495243738215,
.vc_custom_1495243346406 {
    border-top-width: 0 !important;
    border-right-width: 0 !important;
    border-bottom-width: 0 !important;
    border-left-width: 0 !important;
}

}

2. You have set the padding for the row container of the “Search Engine Optimisation” box so it’s lower than others. You should edit the row of that box, change the “Vertical Padding Size” to “Default”.

3. You can set it in Customize -> Site Identity -> Site Icon. This is a built-in setting from WordPress, you can see more details here: https://codex.wordpress.org/Creating_a_Favicon

4. You can set it as below:

<i class="ol-mail" /> <a href="mailto:email@domain.com">email@domain.com</a>

Thanks for that. Everything worked except number 1, the border. It’s not working.

I’ve put the custom CSS code in the ‘Customize’ section, is there anywhere else this code should go?

Thanks.