Community Forums › Forums › Archived Forums › Design Tips and Tricks › Enlarge Image Header in Going Green v. 1.0.1
- This topic has 6 replies, 2 voices, and was last updated 10 years, 5 months ago by candacegodwin.
-
AuthorPosts
-
April 9, 2014 at 8:18 pm #99416candacegodwinParticipant
I am trying to enlarge the image header in Going Green version 1.0.1 (older version of Going Green theme) on http://thecoeurdalenecoop.com. Somehow, previously, I managed to change the image size to 960 x 100 and want to increase that to 960x250. I've tried to change the values in the css under Header and Header Image. What I get is the "area" of the header resizes, but unfortunately, the image size for uploading a new header is remaining at 960x100. The function.php files for this theme don't appear to have header info (at least not that I can find).
Any ideas on where to make the changes? I contacted support, unfortunately, they said it was "custom" coding and they could not help. I know it's there...I just need some direction in finding where the code lives. Any help is appreciated. Thanks -- Candace
http://thecoeurdalenecoop.comApril 9, 2014 at 10:18 pm #99432nutsandboltsMemberCan you paste in the contents of your functions.php? Without a header function, you shouldn't have Appearance > Header, so I'm thinking it's in there somewhere.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+April 10, 2014 at 8:27 am #99495candacegodwinParticipantHi Andrea, Here is the functions.php. file content. It's only 45 lines of code - seems odd to me, but that's all that is there. Below this is the "home.php" file content-- again only 25 lines of copy. Below that is CSS content for the header and header image sections. This is what I changed (but have since changed back). Changing to 250 made the area larger. I added "height 250" to the header image section -- but it didn't do anything. I can't find anything with 960 x100 in the header section that might refer to the current size. Any suggestions you can give me would be greatly appreciated. Thanks. Candace
FUNCTION.PHP
<?php
// Start the engine
require_once(TEMPLATEPATH.'/lib/init.php');// Add new image sizes
add_image_size('Featured Image', 590, 330, TRUE);
add_image_size('Featured Thumb', 200, 115, TRUE);// Add rounded header
add_action('genesis_after_header', 'goinggreen_round_header_graphic');
function goinggreen_round_header_graphic() {
require(CHILD_DIR.'/after-header.php');
}// Add widgeted footer section
add_action('genesis_before_footer', 'goinggreen_include_footer_widgets');
function goinggreen_include_footer_widgets() {
require(CHILD_DIR.'/footer-widgeted.php');
}// Register widget areas
genesis_register_sidebar(array(
'name'=>'Homepage',
'id' => 'homepage',
'description' => 'This is the featured column of the homepage.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
'name'=>'Footer #1',
'id' => 'footer-1',
'description' => 'This is the first column of the footer section.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
'name'=>'Footer #2',
'id' => 'footer-2',
'description' => 'This is the second column of the footer section.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
'name'=>'Footer #3',
'id' => 'footer-3',
'description' => 'This is the third column of the footer section.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));HOME.PHP.
<?php get_header(); ?>
<?php genesis_before_content_sidebar_wrap(); ?>
<div id="content-sidebar-wrap"><?php genesis_before_content(); ?>
<div id="content" class="hfeed">
<div id="featured-home">
<?php if (!dynamic_sidebar('Homepage')) : ?>
<div class="widget">
<h4><?php _e("Homepage", 'genesis'); ?></h4>
<div class="wrap">
<p><?php _e("This is a widgeted area which is called Homepage. It is using the Genesis - Featured Posts widget to display what you see on the Going Green child theme demo site. To get started, log into your WordPress dashboard, and then go to the Appearance > Widgets screen. There you can drag the Genesis - Featured Posts widget into the Homepage widget area on the right hand side. To get the image to display, simply upload an image through the media uploader on the edit page screen and publish your page. The Featured Posts widget will know to display the post image as long as you select that option in the widget interface.", 'genesis'); ?></p>
</div><!-- end .wrap -->
</div><!-- end .widget -->
<?php endif; ?>
</div><!-- end #featured-home --></div><!-- end #content -->
<?php genesis_after_content(); ?></div><!-- end #content-sidebar-wrap -->
<?php genesis_after_content_sidebar_wrap(); ?>CSS
/***** Header ********************/
#header {
width: 960px;
height: 110px;
margin: 0;
padding: 0;
float: left;
}Image Header
/***** Image Header - Full Width ********************/.header-full-width #title-area, .header-full-width #title-area #title, .header-full-width #title-area #title a {
width: 960px;}
April 10, 2014 at 9:35 am #99511candacegodwinParticipantHi Andrea, Thanks for your response. Below is the content from the function.php file, home.php file and two areas of the css for header and full header image. The php files associated with this theme are very short (45 and 29 lines of code). I've tried changing the values in the css header, it only made the area larger. I tried added height to the full image header css, but that didn't do anything either. If you have any other suggestions, please let me know. I've only been in the theme php files (child theme), not the genesis files. Thanks.
Function.php
<?php
// Start the engine
require_once(TEMPLATEPATH.'/lib/init.php');// Add new image sizes
add_image_size('Featured Image', 590, 330, TRUE);
add_image_size('Featured Thumb', 200, 115, TRUE);// Add rounded header
add_action('genesis_after_header', 'goinggreen_round_header_graphic');
function goinggreen_round_header_graphic() {
require(CHILD_DIR.'/after-header.php');
}// Add widgeted footer section
add_action('genesis_before_footer', 'goinggreen_include_footer_widgets');
function goinggreen_include_footer_widgets() {
require(CHILD_DIR.'/footer-widgeted.php');
}// Register widget areas
genesis_register_sidebar(array(
'name'=>'Homepage',
'id' => 'homepage',
'description' => 'This is the featured column of the homepage.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
'name'=>'Footer #1',
'id' => 'footer-1',
'description' => 'This is the first column of the footer section.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
'name'=>'Footer #2',
'id' => 'footer-2',
'description' => 'This is the second column of the footer section.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));
genesis_register_sidebar(array(
'name'=>'Footer #3',
'id' => 'footer-3',
'description' => 'This is the third column of the footer section.',
'before_title'=>'<h4 class="widgettitle">','after_title'=>'</h4>'
));Home.php
<?php get_header(); ?><?php genesis_before_content_sidebar_wrap(); ?>
<div id="content-sidebar-wrap"><?php genesis_before_content(); ?>
<div id="content" class="hfeed">
<div id="featured-home">
<?php if (!dynamic_sidebar('Homepage')) : ?>
<div class="widget">
<h4><?php _e("Homepage", 'genesis'); ?></h4>
<div class="wrap">
<p><?php _e("This is a widgeted area which is called Homepage. It is using the Genesis - Featured Posts widget to display what you see on the Going Green child theme demo site. To get started, log into your WordPress dashboard, and then go to the Appearance > Widgets screen. There you can drag the Genesis - Featured Posts widget into the Homepage widget area on the right hand side. To get the image to display, simply upload an image through the media uploader on the edit page screen and publish your page. The Featured Posts widget will know to display the post image as long as you select that option in the widget interface.", 'genesis'); ?></p>
</div><!-- end .wrap -->
</div><!-- end .widget -->
<?php endif; ?>
</div><!-- end #featured-home --></div><!-- end #content -->
<?php genesis_after_content(); ?></div><!-- end #content-sidebar-wrap -->
<?php genesis_after_content_sidebar_wrap(); ?>April 10, 2014 at 9:37 am #99513candacegodwinParticipantHere are the CSS lines of code for header section:
/***** Header ********************/#header {
width: 960px;
height: 110px;
margin: 0;
padding: 0;
float: left;
}#header .wrap {
}#title-area {
width: 435px;
float: left;
margin: 0;
padding: 10px 0 0 0;
overflow: hidden;
}#title-area #title {
font-size: 30px;
font-weight: bold;
line-height: 30px;
margin: 6px 0 0 20px;
padding: 0;
}#title-area #title a {
color: #333333;
margin: 0;
padding: 0;
text-decoration: none;
}#title-area #title a:hover {
color: #333333;
text-decoration: none;
}#title-area #description {
font-size: 14px;
font-style: italic;
font-weight: normal;
margin: 0 0 0 20px;
padding: 0;
}#header .widget-area {
width: 520px;
float: right;
margin: 0;
padding: 0;
}#header .widget-area p {
margin: 0;
padding: 0 0 5px 0;
}#header .widget-area h4 {
color: #333333;
font-size: 14px;
font-weight: normal;
margin: 10px 0 0 0;
padding: 0;
text-decoration: none;
}#header .widget-area ul {
margin: 0;
padding: 0;
}#header .widget-area ul li {
list-style-type: square;
margin: 0 0 0 20px;
padding: 0;
}/***** Image Header - Partial Width ********************/
.header-image #header #title-area {
background: url(images/logo.png) left top no-repeat;
margin-top: 10px;
}.header-image #title-area, .header-image #title-area #title, .header-image #title-area #title a {
display: block;
float: left;
width: 435px;
height: 100px;
margin: 0;
padding: 0;
text-indent: -9999px;
overflow: hidden;
}.header-image #title-area #description {
display: block;
width: 0;
height: 0;
overflow: hidden;
}/***** Image Header - Full Width ********************/
.header-full-width #title-area, .header-full-width #title-area #title, .header-full-width #title-area #title a {
width: 960px;}
April 10, 2014 at 10:10 am #99520nutsandboltsMemberI see this in your functions.php:
// Add rounded header add_action(‘genesis_after_header’, ‘goinggreen_round_header_graphic’); function goinggreen_round_header_graphic() { require(CHILD_DIR.’/after-header.php’); }
That seems to be calling a separate file related to the header - what's in that one?
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+April 10, 2014 at 11:35 am #99533candacegodwinParticipantHi, Well, not much is in the afterheader.php file (below). I also included after header css, but I don't see any clues in there either. I really appreciate your attempt to help with this! 🙂
<div id="after-header">
/images/after-header.png" />
</div><!-- end #after-header -->Here is the After Header CSS:
/***** After Header ********************/
#after-header {
float: left;
width: 960px;
height: 31px;
position: relative;
z-index: 0;
}/***** Inner ********************/
#inner {
background:url(images/bg-inner.png) repeat-y;
width: 900px;
margin: 0;
padding: 5px 30px 0 30px;
overflow: hidden;
float: left;
} -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.