0

Can you WordPress Gurus please help!

I have tried adding some code suggestions found on the web to my style.css file in my theme folder to solve my problems but they have no effect.

I've have so far succeeded in learning some CSS and PHP and HTML. With the help of wamp to create my prototype site, and with the help of some WordPress tutorials on Youtube, I have created my own code to make my WordPress 20-14 theme folder files from scratch.

But now I have reached a brick wall in my development. I have succeeded in creating the exact look and functionality I want for my Home Page, my links work, but I now have no control over changing or deleting the header image and background color in my other pages linked to the Home Page.

I have written all the code for and have only these files now in my AAB named theme folder: style.css, content-page.php, functions.php, header.php, and index.php

How can I learn how to solve this problem, or please tell me what code or other files or modifications do I need now to proceed further? To the best of my beginner's knowledge, my problems might be fixed by adding some additional code to header.php.

Below: Contents of my header.php

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
    <head>
        <meta charset="<?php blog_info('charset'); ?>">
        <meta name="viewport" content="width=device-width">
        <title><?php bloginfo('name'); ?></title>
        <?php wp_head(); ?>
    </head>
</html>

<body <?php body_class(); ?>>

   <!-- site-header -->
   <header class="site-header">
    <a href="http://localhost/wordpress/?page_id=7" target="'home-page'";>
    <img src="http://localhost/wordpress/wp-content/uploads/Cropped-Front.tekst_-original.gif"; width="100%";";>
    </a>
   </header>

/* 2017 Mar 28 added the following code to my functions.php to allow     support for "custom Headers"*/

add_theme_support( 'custom-header' );

/* Note that you can add default arguments using: */

$defaults = array(
    'default-image'          => '',
    'width'                  => 100,
    'height'                 => 100,
    'flex-height'            => true,
    'flex-width'             => true,
    'uploads'                => true,
    'random-default'         => false,
    'header-text'            => true,
    'default-text-color'     => '',
    'wp-head-callback'       => '',
    'admin-head-callback'    => '',
    'admin-preview-callback' => '',
);

add_theme_support( 'custom-header', $header_args );
  • Thanks for the helpful fast reply. When I tried downloading and activating the plugin WP Display Header, I get the error message, "This Theme does not Support Custom Headers" I guess this only leaves me to learn more about using "class " functions and filters to attempt to solve my problems, and I am not quite sure where to go next to learn how to do this. I really don't quite understand neither the exact required PHP syntax nor the coding functions needed in this case to adding and creating the required "class" code to my site.. – Genius Mar 27 '17 at 20:29
0

Congratulations on building your first WordPress theme. You still have some to go, though. As you can read in the Codex the normal way to add a header is not by simply placing an <img> tag in the header. WP allows you to upload a header image in the backoffice which you can access with

<img src="<?php header_image(); ?>">

If you want different header images on different pages of your theme, you can use conditional tags to build it yourself or you can use a plugin like WP Display Header.

As you can see in the source code of your site, there are different classes on the <body> tag. These you can use in your style.css to assign different background colors, for instance for home and single pages.

body.home {background:red;}
body.single {background:blue;}

Hopefully this will help you take the next step. Be sure to read the tips and tricks in the Codex.

  • You might also find the Template Hierarchy useful - it will help you understand how to change display depending on what page you're on - but body class is definitely the right approach to target global header styles. You might also find it helpful to set the image as a CSS background-image so that you can swap it out depending on page. – WebElaine Mar 27 '17 at 20:14
  • Thanks for the helpful fast reply. When I tried downloading and activating the plugin WP Display Header, I get the error message, "This Theme does not Support Custom Headers" I guess this only leaves me to learn more about using "class " functions and filters to attempt to solve my problems, and I am not quite sure where to go next to learn how to do this. I really don't quite understand neither where is the exact .php file or the location within that ,php file. nor the required PHP syntax nor the coding functions needed in this case to create the required "class" code to my site.. – Genius Mar 27 '17 at 20:37
  • Thanks WebElaine, but as I said in my opening posting, somehow adding any CSS to the theme (using the Dashboard-->Appearance-->Editor,) with your example code modified to my page names) has no effect! – Genius Mar 27 '17 at 20:48
  • Although recommended using Plugins, my theme does not support Custom Headers. The link to "tips and tricks" in the Codex does not show this topic. – Genius Mar 28 '17 at 9:46
  • Google is your friend. Search "wordpress codex custom headers" and you find this: codex.wordpress.org/Custom_Headers – cjbj Mar 28 '17 at 9:50

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.