2017-05-30 1 views
0

Mon site est www.rosstheexplorer.comen-tête personnalisé ne se charge pas « Echec de ressources de charge: la sever a répondu avec un statut de 404 (Introuvable) »

Lorsque la largeur de l'appareil est supérieure à 601px Je veux la ci-dessous pour se

  1. Je ne veux pas qu'il y jamais d'espace entre le menu et l'en-tête
  2. Je ne veux pas y personnalisé à jamais un espace au-dessus de l'en-tête du client
  3. I ne veut pas H1, les plugins ou tout autre c Je ne veux pas qu'il y ait un espace blanc à gauche ou à droite de l'en-tête du client
  4. Je veux toujours pouvoir voir le texte entier 'Ross The Explorer ', je ne veux pas que le dernier R soit enlevé

Regardez www.nomadicmatt.com pour avoir une idée de ce que je veux réaliser.

Pour mettre l'en-tête personnalisé dans sa propre ligne j'ai essayé d'utiliser le code suivant

<div class="row"> 

<div class="col-sm-12" style="background-color:lavender;"> 
    <div class="custom-header"></div> 
</div> 

</div> 

Cela semble avoir aucun effet.

Voici le code complet de header.php.

<?php 
/** 
* The Header for our theme. 
* 
* Displays all of the <head> section and everything up till <div id="content"> 
* 
* @package Penscratch 
*/ 
?><!DOCTYPE html> 
<html <?php language_attributes(); ?>> 
< 

    head> 
    <meta charset="<?ph 

p bloginfo('charset'); ?>"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title><?php wp_title('A|', true, 'right'); ?></title> 
    <link rel="profile" href="http://gmpg.org/xfn/11"> 
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>"> 

    <?php wp_head(); ?> 

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384- 

     Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script 

> 


</head> 

<body <?php body_class(); ?>> 
<div id="page" class="hfeed site"> 
    <a class="skip-link screen-reader-text" href="#content"><?php _e('Skip to content', 'penscratch'); ?></a> 


    <div class="custom-header"></div> 



<header id="masthead" class="site-header" role="banner"> 
     <div class="site-branding"> 
      <?php if (function_exists('jetpack_the_site_logo')) jetpack_the_site_logo(); ?> 
      <h1 class="site-title"><a href="<?php echo esc_url(home_url('/')); ?>" rel="home"><?php bloginfo('name'); ?></a></h1> 
      <h2 class="site-description"><?php bloginfo('description'); ?></h2> 
     </div> 

     <nav id="site-navigation" class="main-navigation" role="navigation"> 
      <button class="menu-toggle"><?php _e('Menu', 'penscratch'); ?></button> 
      <?php wp_nav_menu(array('theme_location' => 'primary')); ?> 
     </nav><!-- #site-navigation --> 
    </header><!-- #masthead --> 

    <div id="content" class="site-content"> 
     <?php if (get_header_image()) : ?> 
      <a href="<?php echo esc_url(home_url('/')); ?>" rel="home"> 

      </a> 
     <?php endif; // End header image check. ?> 

En CSS supplémentaires Je le code suivant

@media screen and (min-width: 75em) 
{ 
    .site { 
    max-width: 1153px; 
    margin: 400px auto; 
    padding: 54px 108px; 
    } 
} 



@media screen and (min-width: 601px) { 
.custom-header { background: url("https://i1.wp.com/www.rosstheexplorer.com/wp-content/uploads/2017/02/Cover-Photo-6-2.jpg") no-repeat; 
     width: 100% ; 
         background-size:contain; 


    } 
} 

Après y compris le nouveau code, le chargement http://www.rosstheexplorer.com/wp-content/themes/penscratch/css/bootstrap-3.3.7.css et http://www.rosstheexplorer.com/wp-content/themes/penscratch/js/bootstrap.min.js résultats encore une erreur 404 (introuvable).

Est-ce que les gens peuvent me donner des suggestions sur d'autres codes que je pourrais essayer?

Merci

Répondre

0

Oui ceci est votre code:

@media screen and (min-width: 601px)?custom-css=d4d401c306:9 

.custom-header { 
    background: url(https://i1.wp.com/www.rosstheexplorer.com/wp-content/uploads/2017/02/Cover-Photo-6-2.jpg) no-repeat; 

    width: 100%; 
    height: 40%; 
    background-size: cover; 
    position: absolute; 
    top: 0; 
    left: 0; 
} 

/* changement de taille de fond: couverture; en arrière-plan: 100%; */

@media screen and (min-width: 601px)?custom-css=d4d401c306:9 

.custom-header { 
    background: url(https://i1.wp.com/www.rosstheexplorer.com/wp-content/uploads/2017/02/Cover-Photo-6-2.jpg) no-repeat; 

    width: 100%; 
    height: 40%; 
    background-size: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
} 
+0

Merci. Le R dans 'Explorer' n'est plus coupé bien qu'il reste des problèmes d'espacement entre l'en-tête du client et les autres éléments de la page. –

+0

Vous aurez besoin d'essayer et d'erreur votre rembourrage et marge sur votre en-tête personnalisé et votre barre de navigation. Il est très peuplé, donc vous aurez du mal à y parvenir. Essayez peut-être d'ajouter du remplissage au contenu de votre site pour faire tomber votre conteneur principal - cela vous donnera une certaine marge de manœuvre. – LiffeyD

+0

Mon en-tête personnalisé ne se charge plus. Je reçois le message d'erreur Impossible de charger la ressource: le serveur a répondu avec un statut de 404 (non trouvé) –