[wordpressnewbie]

wordpressnewbie

#236

Hi-

I would like to have the header rotate images using the Cimy Header Image Rotator plug-in (unless you know of something better). It seems like a pretty straightforward plug-in where you just upload your images and then insert the generated code into the template. Unfortunately, my knowledge of php is very limited. If I just inserted their code right into the header.php file, the functionality actually works (the images rotates) but the placement is, of course, at the top and now there’s two header images.

Here’s the code generated by the plug-in that they say just to “add to the theme:”

===================================================

<div id=”cimy_div_id”>Loading images…</div>

<style type=”text/css”>

#cimy_div_id {

margin: 1em auto;

border: 0px solid #000000;

width: 900px;

height: 198px;

}

</style>

<noscript>

<div id=”cimy_div_id_nojs”>

</div>

</noscript>

===================================================

Where do I place this code and/or what should be changed in the Graphene template?

The other thing is that it adds space above the header image that matches the color of the background. I’m assuming that it’s because of the “<div id=”cimy_div_id”>Loading images…</div>” line but I’m not sure how that would be corrected.

I still would like the header to link back to the home page if clicked but unsure how this would work while integrating cimy’s plug-in.

Thanks for any assistance!!

[JennC]

JennC

#11689

I recently installed this plug-in and here is what I did…

In the Cimy plug-in, set the size of your banner (900x198px is the size of the header banner in this template). Copy the code that is generated and navigate to Appearance > Editor > Header (header.php). Replace, or comment-out (recommended!) the following code with the Cimy generated code:

<div id=”header” style=”background-image:url(<?php echo $header_img; ?>);”>

<h1 <?php echo $style; ?> class=”header_title”> href=”<?php echo home_url(); ?>”><?php bloginfo(‘name’); ?></h1>

<h2 <?php echo $style; ?> class=”header_desc”><?php bloginfo(‘description’); ?></h2>

</div>

To remove the extra space, adjust the CSS to:

margin: 0 auto;

border: none;

Make sure the width and height match the dimensions of your banner art files:

width: 900px;

height: 198px;

I have not looked at linking the banner back to the home page… perhaps someone else has the code for this!

[Anonymous]

Anonymous

#11690

JennC,

doing your edits appears to work, but it causes everything below the banner to shift to the left. or at least for me it did:

http://andrewshemo.com/wordpress/

here’s the edits I made (maybe I didn’t do something correctly):

<div id=”cimy_div_id”>Loading images…</div>

<style type=”text/css”>

#cimy_div_id {

margin: 0 auto;

border: none;

width: 900px;

height: 198px;

}

</style>

<noscript>

<div id=”cimy_div_id_nojs”>

</div>

</noscript>

<!–<div id=”header” style=”background-image:url(<?php echo $header_img; ?>);”>–>

<?php if (get_option(‘graphene_link_header_img’)) : ?>

” id=”header_img_link” title=”<?php esc_attr_e(‘Go back to the front page’, ‘graphene’); ?>”> 

<?php endif; ?>

<!–<h1 <?php echo $style; ?> class=”header_title”> href=”<?php echo home_url(); ?>” title=”<?php esc_attr_e(‘Go back to the front page’, ‘graphene’); ?>”><?php bloginfo(‘name’); ?></h1>–>

<!–<h2 <?php echo $style; ?> class=”header_desc”><?php bloginfo(‘description’); ?></h2>–>

[JennC]

JennC

#11691

Hi Andrew,

I’m a beginner at this myself, but it seems that the closing tab on your container tag is missing, thus the “container” rule is only applying to the heading (using the first available closing div).

Maybe one of the more experienced folks can chime-in on this.

[Anonymous]

Anonymous

#11692

I figured it out. if you want to do the edits in a child header.php, I think you need to copy over the entire header.php from the original theme. placing just the edits as seen below in the child header.php didn’t work, but copying the entire header.php including the edits worked.

here’s my code:

<div id=”cimy_div_id”>Loading images…</div>

<style type=”text/css”>

#cimy_div_id {

margin: 0 auto;

border: none;

width: 900px;

height: 198px;

}

</style>

<noscript>

<div id=”cimy_div_id_nojs”>

</div>

</noscript>

<!–<div id=”header” style=”background-image:url(<?php echo $header_img; ?>);”>

<?php if (get_option(‘graphene_link_header_img’)) : ?>

” id=”header_img_link” title=”<?php esc_attr_e(‘Go back to the front page’, ‘graphene’); ?>”> 

<?php endif; ?>

<h1 <?php echo $style; ?> class=”header_title”> href=”<?php echo home_url(); ?>” title=”<?php esc_attr_e(‘Go back to the front page’, ‘graphene’); ?>”><?php bloginfo(‘name’); ?></h1>

<h2 <?php echo $style; ?> class=”header_desc”><?php bloginfo(‘description’); ?></h2>

<?php do_action(‘graphene_header’); ?>

</div>–>

[Syahir Hakim]

Syahir Hakim

#11693

Whenever you create a new header.php file in the the child theme, that file is used instead of the original theme’s header.php file. That’s why you need to copy the entire content of the header.php file into your child theme’s header.php, because the original theme’s header.php file is not loaded at all by WordPress.

I would suggest that you use the action hooks available in the header.php file to add the codes generated by the Cimy Header Image Rotator plugin, and then hide the theme’s original header block by using CSS display:none rule. This way, whenever I add new features to the theme that require editing the theme’s header.php file, you won’t miss out.

[seanpb2004]

seanpb2004

#11694

Andrew,

I tried using your code…and I’m guessing I’m too much of a novice at PHP to fully understand this, but I grabbed your code and commented out the existing header, but when I paste your code in. The images I have uploaded do not show. Did you have the same problem with this?

Sean

[seanpb2004]

seanpb2004

#11695

I guess more specifically, is there something in the code that you copied that is specific to my site, but I didn’t catch it?