It is very difficult to help with this type of problem without being able to view the site. If you post a link to your site where the problem can be seen, someone may be able to help you.
How do I post a link for viewing? I haven’t published it yet because I don’t want to take down my already functioning site until this new one is ready to go.
Thank you for your help.
Update:
I tried switching to the blankslate theme to see if it was just an error within the custom community theme and unfortunately it wasn’t. The same boxes show up when you hover but only after I create a child theme. If I add all my template pages to the parent theme, I don’t have these problems but I know your not suppose to edit parent theme. The boxes are basically the WordPress heading, but instead of going across the top the show up throughout my home page.
Thank you again
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Just note that if you don’t provide a link to the issue then we have to go through and try to replicate the problem, by following your 5 steps. It’s just a bit daunting and tedious and it decreases the likelihood that people will help you.
Still don’t know how we’re going to replicate this:
5. Went into ‘Theme Settings/CSS’ and added all my custom css.
Thank you Andrew for the advise and I completely understand.
How do I provide a link if I can’t make it live?
I am more than happy to provide whatever info you need to help as I have researched for days now. I did see in the WP.org forum someone else had the same grey box scenario but said it was because they were copying their page-about.php, page-contact.php, etc. with the info from the index.php file. The original author of my website index.php file is the home page. There was not a separate home.php. Every other page had it’s individual .php file. Does this have something to do with my issue? If so, why did it not happen when I put the info in the parent file?
Could a plugin maybe cause this problem?
This is the code that is showing up with the grey boxes:
<li style=”text-shadow: none;” id=”wp-admin-bar-wp-logo” class=”menupop”><span style=”text-shadow: none;” class=”ab-icon”></span><div style=”text-shadow: none;” class=”ab-sub-wrapper”><ul style=”text-shadow: none;” id=”wp-admin-bar-wp-logo-default” class=”ab-submenu”>
<li style=”text-shadow: none;” id=”wp-admin-bar-about”>About WordPress <ul style=”text-shadow: none;” id=”wp-admin-bar-wp-logo-external” class=”ab-sub-secondary ab-submenu”>
<li style=”text-shadow: none;” id=”wp-admin-bar-wporg”>WordPress.org
<li style=”text-shadow: none;” id=”wp-admin-bar-documentation”>Documentation
<li style=”text-shadow: none;” id=”wp-admin-bar-support-forums”>Support Forums
<li style=”text-shadow: none;” id=”wp-admin-bar-feedback”>Feedback </div>
<li style=”text-shadow: none;” id=”wp-admin-bar-site-name” class=”menupop”>757.6f6.myftpupload.com<div style=”text-shadow: none;” class=”ab-sub-wrapper”><ul style=”text-shadow: none;” id=”wp-admin-bar-site-name-default” class=”ab-submenu”>
<li style=”text-shadow: none;” id=”wp-admin-bar-dashboard”>Dashboard <ul style=”text-shadow: none;” id=”wp-admin-bar-appearance” class=”ab-submenu”>
<li style=”text-shadow: none;” id=”wp-admin-bar-themes”>Themes
<li style=”text-shadow: none;” id=”wp-admin-bar-customize” class=”hide-if-no-customize”>Customize
<li style=”text-shadow: none;” id=”wp-admin-bar-widgets”>Widgets
<li style=”text-shadow: none;” id=”wp-admin-bar-menus”>Menus </div>
<li style=”text-shadow: none;” id=”wp-admin-bar-comments”><span style=”text-shadow: none;” class=”ab-icon”></span><span style=”text-shadow: none; opacity: 0.5;” id=”ab-awaiting-mod” class=”ab-label awaiting-mod pending-count count-0″>0</span>
<li style=”text-shadow: none;” id=”wp-admin-bar-new-content” class=”menupop”><span style=”text-shadow: none;” class=”ab-icon”></span><span style=”text-shadow: none;” class=”ab-label”>New</span><div style=”text-shadow: none;” class=”ab-sub-wrapper”><ul style=”text-shadow: none;” id=”wp-admin-bar-new-content-default” class=”ab-submenu”>
<li style=”text-shadow: none;” id=”wp-admin-bar-new-post”>Post
<li style=”text-shadow: none;” id=”wp-admin-bar-new-media”>Media
<li style=”text-shadow: none;” id=”wp-admin-bar-new-page”>Page
<li style=”text-shadow: none;” id=”wp-admin-bar-new-user”>User </div>
<li style=”text-shadow: none;” id=”wp-admin-bar-edit”>Edit Page
<li style=”text-shadow: none;” id=”wp-admin-bar-gd-system-flush-cache”>Flush Cache
<li style=”text-shadow: none;” id=”wp-admin-bar-gd-system-control-panel”>GoDaddy Settings
I tried deactivating all plugin’s and that did not work.
I’m starting over and maybe someone can tell me where my error begins without having to duplicate. This problem ONLY happens in a child theme and ONLY on my home page after it is designated as home page no matter what I name it. I’m only worried about grey bozes at this point and not my style. Here are my steps.
1.I deleted BlankSlate & BlankSlate child theme along with all my page.php, header.php and style.css files. I deactivated all plugin’s besides Meta Slider.
2.Downloaded fresh copy of BlankSlate, made new BlankSlate child added style.css file with heading naming BlankSlate as template.
[ Moderator note: code fixed. Please wrap code in the backtick character or use the code button. ]
/*Theme Name: BlankSlate Child Theme
Version: 1.0
Description: A child theme of BlankSlate
Template: blankslate*/
@import url("../blankslate/style.css");
3.Opened my home page & grey boxes were NOT there. Then added my footer.php & NO grey boxes.
<div id="footer">
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css" type="text/css" media="all" />
<link href="<?php echo get_stylesheet_uri(); ?>" rel="stylesheet" type="text/css" />
etc...
4.Then I added page-home.php & header-home.php templates & grey boxes appeared. To create page-home, I copied the page.php file from BlankSlate parent and added heading:
<?php /* Template Name: Home */ ?>
<?php get_header('home'); ?>
I didn't change anything else.
To create header-home I started with:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"<?php language_attributes(); ?>>
<head>
<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
meta
scripts
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?> id="home">
.
.
.
</body>
</html>
The WP header/ Admin bar that’s on every page creates grey boxes going down the page, 1 box for every icon. When go to Inspect Element the first grey box code is:
<a href="http://757.6f6.myftpupload.com/wp-admin/about.php" title="About WordPress"><span style="text-shadow: none;" class="ab-icon"></span></a>
Then
<li> list appears for every admin bar item About, Site-name, Comments, New-content, Edit, System-flush-cache, etc. Top left box is About & then to right is Site-name, Comments under About. When I 1st put page templates in parent theme(before learning I need to create child theme)no boxes appeared & my home page looked correct. Boxes only happen in child theme. I tried naming my home page other names, but seems as soon as pick the ‘static page’ for Front Page Displays, that’s when boxes appear. Please tell me what further info to provide to help solve problem. I appreciate your time & help.
Was missing a </div> which caused grey WP admin boxes to appear.
