Eiffel Theme Menu Not Displaying Properly

[trinnovative]

Hello Devs,

I’m using the Eiffel Theme and for some reason the Menu is not displaying properly.

I have set the menu text options correctly in the Theme Options settings, I’ve also tried CSS in the attempt to override; however that has been removed.

The default text color should be rgb(15, 132, 242) with the current white background; the hover effects operate properly.

Either way can someone look into this so the menu will display properly?

-BC

[7Theme Support]

Hi,

were have you change the menu colors? We’ve tested it on the demo website with the color from your posts and it was working without any problem…

[trinnovative]

Thank you for the response.

The colors have been changed in the Theme options in WordPress.

Sorry I left out the web address in the original post.

http://www.mwphglco.org/

Please reference the site. By default the menu text is gray as opposed to the specified blue in the Theme Options.

-BC

[7Theme Support]

Found the problem! Please check your child theme, the stylesheet file overwrite the custom css file, that’s why it’s not working…

[trinnovative]

Can you share how you came to that determination?

There is no code in the child theme css that links to the menu. How would it be overriding if there is no code to reference in the child css?

-BC

[7Theme Support]

Hi,

it’s the same problem like in your post for the Carina theme:

Carina Theme: Blog posts not formatting to mobile view

The style.css file from the main theme is loaded again after the file with the custom css, this will overwrite the custom style settings!

[trinnovative]

Thank you for the response. I’ve reviewed a number of options on how to correct this. However I have not come to a fix.

Based on what you can see are you able to advise on how to address it without rebuilding the site?

There has to be a way to enqueue the style sheets properly considering the plugin did not create the child theme the correct way. I have copied the child theme function.php verbiage below. From the looks of it it looks like multiple calls are being made to call the style sheets multiple times.

I’m just looking for a corrective action so this site can be on it’s way to completion. I’ve never run into this before.

Child Theme Function.php code below:

<?php
// Exit if accessed directly
if ( !defined( ‘ABSPATH’ ) ) exit;

// BEGIN CTC ENQUEUE PLUGIN ACTION
// AUTO GENERATED – Do not modify or remove comment markers above or below
if ( !function_exists( ‘chld_thm_cfg_plugin_css’ ) ):
function chld_thm_cfg_plugin_css() {
wp_enqueue_style( ‘chld_thm_cfg_plugins’, trailingslashit( get_stylesheet_directory_uri() ) . ‘ctc-plugins.css’ );
}
endif;
// using high priority so plugin custom styles load last.
add_action( ‘wp_enqueue_scripts’, ‘chld_thm_cfg_plugin_css’, 9999 );

// END CTC ENQUEUE PLUGIN ACTION

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED – Do not modify or remove comment markers above or below:

if ( !function_exists( ‘chld_thm_cfg_parent_css’ ) ):
function chld_thm_cfg_parent_css() {
wp_enqueue_style( ‘chld_thm_cfg_parent’, trailingslashit( get_template_directory_uri() ) . ‘style.css’ );
}
endif;
add_action( ‘wp_enqueue_scripts’, ‘chld_thm_cfg_parent_css’ );

// END ENQUEUE PARENT ACTION

[7Theme Support]

Hi,

I think the problem is the last line, can you replace it with this:

// add_action( ‘wp_enqueue_scripts’, ‘chld_thm_cfg_parent_css’ );

(The ” // ” at the beginning prevent the code from working)

[trinnovative]

Hello again,

I have been working on this issue for a number of weeks now.

I’ve gone back and recreated the Child Theme in hopes of removing the issue. However that has not solved the issue. I have done numerous things with the function.php file to see if enqueuing style sheets differently would change the result and that served no purpose either.

In looking at the inspector the site is reading the proper color however it only displays if the site has been visited.

Please continue to advise.

Here is a link to a screenshot of the inspector.

The only thing I have no attempted is custom CSS to see if that will override. I did not take that step as the CSS file seems to be reading properly according to the inspector.

For reference here is the php code.

<?php
/**
* Load the stylesheet from the parent theme with theme version added automatically.
*
*/
function theme_name_parent_styles() {
$parent = get_template();
$parent = wp_get_theme( $parent );
// Enqueue the parent stylesheet
wp_enqueue_style( ‘theme-name-parent-style’, get_template_directory_uri() . ‘/style.css’, array(), $parent[‘Version’], ‘all’ );
// Enqueue the parent rtl stylesheet
if ( is_rtl() ) {
wp_enqueue_style( ‘theme-name-parent-style-rtl’, get_template_directory_uri() . ‘/rtl.css’, array(), $parent[‘Version’], ‘all’ );
}
}
add_action( ‘wp_enqueue_scripts’, ‘theme_name_parent_styles’ );
?>

[7Theme Support]

Ok, we can check again the source code if it’s ok now. It’s still on the same url right?

[trinnovative]

Thank you, the link is still the same.

Also to note the mobile version does not have responsive features in the body.

[7Theme Support]

Hm, we’ve checked the source code and it’s still the same problem, you call the default css files after the customcss file. Can you try to remove the code for the css files in your functions.php file, I think this could work…

[trinnovative]

I’ve removed the PHP code in the functions.php file. Removing this code made the site responsive however it removed majority of the formatting causing the menus to show as unordered lists on both mobile and desktop versions. General responsiveness was obtained on mobile.

Below is the code of loaded style sheets. I have reentered the php code so general formatting is returned.

<link rel=’stylesheet’ id=’theme-css-css’ href=’http://www.mwphglco.org/wp-content/themes/eiffel-child-mwphglco/style.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’owl-all-css’ href=’http://www.mwphglco.org/wp-content/themes/eiffel/style/owl_all.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’font-awesome-css’ href=’http://www.mwphglco.org/wp-content/themes/eiffel/style/font-awesome.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’animate-css’ href=’http://www.mwphglco.org/wp-content/themes/eiffel/style/animate.min.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’7league_responsive-css’ href=’http://www.mwphglco.org/wp-content/themes/eiffel/style/responsive.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’custom-css-css’ href=’http://www.mwphglco.org/wp-content/themes/eiffel/7league/css/customcss.php?color_profile&post&ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’bootstrap_tab-css’ href=’http://www.mwphglco.org/wp-content/plugins/easy-responsive-tabs/assets/css/bootstrap_tab.min.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’bootstrap_dropdown-css’ href=’http://www.mwphglco.org/wp-content/plugins/easy-responsive-tabs/assets/css/bootstrap_dropdown.min.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’ert_tab_icon_css-css’ href=’http://www.mwphglco.org/wp-content/plugins/easy-responsive-tabs/assets/css/res_tab_icon.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’wpdm-bootstrap-css’ href=’http://www.mwphglco.org/wp-content/plugins/download-manager/bootstrap/css/bootstrap.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’icons-css’ href=’http://www.mwphglco.org/wp-content/plugins/download-manager/css/front.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’jquery-ui-css’ href=’http://www.mwphglco.org/wp-content/plugins/form-maker/css/jquery-ui-1.10.3.custom.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’jquery-ui-spinner-css’ href=’http://www.mwphglco.org/wp-content/plugins/form-maker/css/jquery-ui-spinner.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’form_maker_calendar-jos-css’ href=’http://www.mwphglco.org/wp-content/plugins/form-maker/css/calendar-jos.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’form_maker_frontend-css’ href=’http://www.mwphglco.org/wp-content/plugins/form-maker/css/form_maker_frontend.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’style_submissions-css’ href=’http://www.mwphglco.org/wp-content/plugins/form-maker/css/style_submissions.css?ver=4.3.1′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’bwg_frontend-css’ href=’http://www.mwphglco.org/wp-content/plugins/photo-gallery/css/bwg_frontend.css?ver=1.2.61′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’bwg_sumoselect-css’ href=’http://www.mwphglco.org/wp-content/plugins/photo-gallery/css/sumoselect.css?ver=1.2.61′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’bwg_font-awesome-css’ href=’http://www.mwphglco.org/wp-content/plugins/photo-gallery/css/font-awesome/font-awesome.css?ver=4.2.0′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’bwg_mCustomScrollbar-css’ href=’http://www.mwphglco.org/wp-content/plugins/photo-gallery/css/jquery.mCustomScrollbar.css?ver=1.2.61′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’rs-plugin-settings-css’ href=’http://www.mwphglco.org/wp-content/plugins/revslider/rs-plugin/css/settings.css?rev=4.5.95&ver=4.3.1′ type=’text/css’ media=’all’ />
<style id=’rs-plugin-settings-inline-css’ type=’text/css’>
.tp-caption a{color:#0f82f2;text-shadow:none;-webkit-transition:all 0.2s ease-out;-moz-transition:all 0.2s ease-out;-o-transition:all 0.2s ease-out;-ms-transition:all 0.2s ease-out}.tp-caption a:hover{color:#0f82f2}
</style>
<link rel=’stylesheet’ id=’google-calendar-events-qtip-css’ href=’http://www.mwphglco.org/wp-content/plugins/google-calendar-events/css/jquery.qtip.min.css?ver=2.3.2′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’google-calendar-events-public-css’ href=’http://www.mwphglco.org/wp-content/plugins/google-calendar-events/css/gce-style.css?ver=2.3.2′ type=’text/css’ media=’all’ />
<link rel=’stylesheet’ id=’wp-members-css’ href=’http://www.mwphglco.org/wp-content/plugins/wp-members/css/generic-no-float.css?ver=3.0.5.1′ type=’text/css’ media=’all’ />

[7Theme Support]

Ok, we’ve checked it again, but it looks like that’s a problem with WordPress, because WordPress make the order of the stylesheet files and it looks like you have to work with a workaround.

To make it short: add this code in the style.css file of your child theme, then it should work:

body header .main-menu li, body header .main-menu a, ul#responsive_menu a, .main-menu a:visited, .cart-contents, .cart-contents:hover {
	color: #0F84F2 !important;
}

[Author]

Posts