Forum Replies Created
-
AuthorPosts
-
Jon BellahMember
Did you copy the [ php ] tag with it?
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberHere's a really good article on px vs em vs rem. You can also use PXtoEM.com to make converting from px to em a bit easier. That said, if using px is what you're comfortable with then by all means use it.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberAdd a custom body class to your functions.php file:
add_filter( 'body_class', 'child_custom_body_class' ); function child_custom_body_class( $classes ) { if ( is_page() ) $classes[] = 'custom-body'; return $classes; }
Then you can target that in your css with:
.custom-body { Your background image here }
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberChange this:
.blog-page #inner { background-color:#fff; }
You'll lose the vertical bar on the sidebar, though. The blogpage-bg.jpg image that I referenced was assuming that you wanted that bar. If so, you have to flip that image horizontally in a image editing software (like Photoshop or Gimp) and save it to your themes images folder.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
January 13, 2013 at 1:49 pm in reply to: How to adding a 468×60 banner on header right side of the Streamline theme #11625Jon BellahMemberReinaldo,
After looking again, it appears there's an issue with the code you've pasted into the widget area. Put this code in your text widget in the header area:
<div style="width:468px; height: 60px; background-color: #000; margin: 0;"></div>
If that displays in the correct position, then it's an issue with your Google Adsense code.
And thank you! I'm not quite done with it, but I like it so far 🙂
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberIn your style.css file, change the your styles to match below:
#title-area { float:left; width:25%; } #header .widget-area { float:right; width:75%; }
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
January 13, 2013 at 12:22 pm in reply to: How to adding a 468×60 banner on header right side of the Streamline theme #11605Jon BellahMemberI don't have a copy of the Streamline theme, so I'm not sure what options are available. However, this will fix your problem, add the code below to your functions.php file.
/** Custom header */ remove_action('genesis_header', 'genesis_do_header'); remove_action('genesis_header', 'genesis_header_markup_open', 5); remove_action('genesis_header', 'genesis_header_markup_close', 15); function child_custom_header() { ?> <div id="header"> <div class="wrap"> <div id="title-area"> <a href="your site"><img src="your logo.png" /></a> </div> <div class="header-banner"> Your banner HTML here. </div> </div> </div> <?php } add_action('genesis_header', 'child_custom_header');
If you want to actually widgetize the banner area, the WordPress codex has a nice write up on how to do that.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberAdd this to your functions.php file:
add_filter( 'body_class', 'add_blog_class' ); function add_blog_class( $classes ) { if ( is_home()) $classes[] = 'blog-page'; return $classes; }
Then add this to the bottom of your style.css file:
.blog-page .sidebar { float: left; } .blog-page #content { float: right; }
However, your #inner div background still draws the line down the page. Â So you'll want to invert it, and add:
.blog-page #inner { background:url(images/blogpage-bg.jpg); }
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberOn the Blog page in WordPress, scroll down and click the layout with the sidebar on the left in the "Layout Settings" box.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberSean,
It's always helpful to post links to your site, so we can give specific help. However, you can change the width of the content area by changing the width of these selectors in the style.css file:
#content { float: left; width: 440px; padding: 15px; } .content-sidebar #content, .sidebar-content #content { width: 610px; padding: 15px; } .sidebar-content #content, .sidebar-sidebar-content #content { float: right; } .full-width-content #content { width: 960px; padding: 0; }
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberDave,
Try Lightbox 2. Aweber is an email marketing service, so the tutorial is on how to set it up with their service. Lightbox 2 is well documented and should be quite easy to set up. However, if you run into any issues, just post here again and I'll try to lend a hand.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberYou can use
.post-meta { display:none; }
to "turn off" the div.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberAdd
text-align:center;
to the#title-area #description
selector in your CSS.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
January 12, 2013 at 2:54 pm in reply to: How do I remove empty space at the end of the website #11492Jon BellahMemberThe image in your Generate Box widget is 1920x1385, which is forcing your page to scroll. Crop the image to the correct size and voila.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberNo problem! Glad I could help.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberNo problem! Glad that helped. 🙂
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
January 12, 2013 at 12:30 pm in reply to: How do I remove the gap between my header and custom menu? #11476Jon BellahMemberYes, you should remove that when you place the other code in your stylesheet. Hope that helps!
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
January 12, 2013 at 11:21 am in reply to: How do I remove the gap between my header and custom menu? #11465Jon BellahMemberPlace the #header code just before the line that reads:
/* Navigation Constants ------------------------------------------------------------ */
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
Jon BellahMemberThis is a bit of a tricky one, because it requires a lot of different changes to your CSS. But here are the changes you want to make:
Add this to your body.home class.
body.home { margin:0; }
Remove the width line from #wrap so it reads as:
#wrap { margin: 0 auto; }
#header should read as follows:
#header { width: 990px; height: 50px; margin: 0 auto; }
Add the following to your stylesheet in the Navigation section:
#nav .wrap { width: 990px; margin: 0 auto; }
That should do it.
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
January 12, 2013 at 10:56 am in reply to: How do I remove the gap between my header and custom menu? #11459Jon BellahMemberSo the simple fix to do what you're looking for is:
#header { display:none; }
But I wanted to point out that there's a much better way to implement a header than the way that you did. You're using the <center> tag and calling your own header image, presumably with a genesis_before_header hook. But, Genesis comes with really nice, semantic structure built in. So the better way to implement your header would add this to the bottom of the "Image Header - Full Width" section of style.css.
.header-full-width #title { background:url(images/header.jpg) no-repeat; }
Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com
-
AuthorPosts