ThemeShaper Forums » Thematic


slideshow and logo image in header

(2 posts)
  • Started 12 years ago by NERPSDHH
  • Latest reply from Chris
  • This topic is not resolved

    Dear Forum members:
    I am very new to WP, but have studied it enough to decide on Thematic to build a non-blog site.

    One of the first challenges is to add a slideshow (by and an image (not a background) to the header. I'm trying to place the slideshow flushed left and the image flushed right. There is no need for a blog title. I think this can be done using the #branding div, but am stuck on how to alter it so that both elements fit well.

    I have checked the forums for a solution, but the closest I come up with are:
    both of which are useful to an extent.

    I am using WP 2.8.4, and modifying Thematic via a child theme.

    Many thanks in advance for your help.


    Posted 12 years ago #
  2. Hi Mikka,

    try the following code in your child theme's functions.php:

    // First we remove the thematic_brandingopen() .. we're going to change it for the flash part.
    // And we remove thematic_blogtitle() and thematic_blogdescription 'cause both are no longer needed.
    function remove_branding() {
    add_action('init', 'remove_branding');
    // We create #header_flash and wrap #header-flash and #branding #header-box
    function childtheme_brandingopen() { ?>
    	<div id="header_box">
    		<div id="header_flash"
    			<--- Here goes your code for the flash part --->
        	<div id="branding">
    <?php }
    // Now we need to close #header-box
    function header_box_close() { ?>
    <?php }
    add_action('thematic_header', 'header_box_close', 9);

    .. and this one is for your style.css:

    #header_box {
    	clear: both;
    	margin: 0 auto;
    	overflow: hidden;
    	position: relative;
    	width: 960px;
    #branding {
      float: right;
      width: 620px;
    /* Don't forget to add your background here */
    /* Moves the new widgetized area to the right and levels it with #branding */
    #header-flash {
      float: left;
      width: 300px;
      padding: 88px 0 44px;
    /* This will clear the floats and keeps the access bottom line
    from jumping into the air */
    #access {
      clear: both;


    Posted 12 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.