WordPress.org

Support

Support » Plugins and Hacks » [Resolved] Slideshow i header Theme by Artisteer – How??

[Resolved] Slideshow i header Theme by Artisteer – How??

  • Hi

    I would like to place a slideshow in the header of a theme made with Artisteer … I’ve view the video but the code in header.php doesnt look nothing like in the video 🙁

    Can someone please help??

    Greetings from Lars, Copenhagen

    This is how the header.php looks like

    <!DOCTYPE html>
    <html <?php language_attributes(); ?>>
    <head>
    <meta charset="<?php bloginfo('charset') ?>" />
    <title><?php wp_title('|', true, 'right'); bloginfo('name'); ?></title>
    <!-- Created by Artisteer v4.0.0.58475 -->
    <!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
    
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url') ?>" media="screen" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <?php
    remove_action('wp_head', 'wp_generator');
    if (is_singular() && get_option('thread_comments')) {
    	wp_enqueue_script('comment-reply');
    }
    wp_head();
    ?>
    </head>
    <body <?php body_class(); ?>>
    
    <div id="wst-main">
        <div id="wst-hmenu-bg" class="wst-bar wst-nav clearfix">
        </div>
        <div class="wst-sheet clearfix">
    
    <?php if(theme_has_layout_part("header")) : ?>
    <header class="clearfix wst-header<?php echo (theme_get_option('theme_header_clickable') ? ' clickable' : ''); ?>"><?php get_sidebar('header'); ?>
    
        <div class="wst-shapes">
    <?php if(theme_get_option('theme_header_show_headline')): ?>
    	<?php $headline = theme_get_option('theme_'.(is_home()?'posts':'single').'_headline_tag'); ?>
    	<<?php echo $headline; ?> class="wst-headline" data-left="9.42%">
        <a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a>
    </<?php echo $headline; ?>>
    <?php endif; ?>
    <?php if(theme_get_option('theme_header_show_slogan')): ?>
    	<?php $slogan = theme_get_option('theme_'.(is_home()?'posts':'single').'_slogan_tag'); ?>
    	<<?php echo $slogan; ?> class="wst-slogan" data-left="10.87%"><?php bloginfo('description'); ?></<?php echo $slogan; ?>>
    <?php endif; ?>
    
                </div>
    
    </header>
    <?php endif; ?>
    
    <nav class="wst-nav clearfix">
        <div class="wst-nav-inner">
        <?php
    	echo theme_get_menu(array(
    			'source' => theme_get_option('theme_menu_source'),
    			'depth' => theme_get_option('theme_menu_depth'),
    			'menu' => 'primary-menu',
    			'class' => 'wst-hmenu'
    		)
    	);
    ?>
            </div>
        </nav>
    <div class="wst-layout-wrapper clearfix">
                    <div class="wst-content-layout">
                        <div class="wst-content-layout-row">
                            <div class="wst-layout-cell wst-content clearfix">

    http://wordpress.org/extend/plugins/meteor-slides/

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Josh Leuze
    Participant

    @jleuze

    Hi Lars, the video is for the Twenty Eleven theme. Where you put the slideshow template tag depends on where exactly you want the slideshow, above or below the nav, etc.

    Could you post a link to the site you’re working on and let me know where you want it?

    Hi Josh

    Thanks for the quick response!!!

    I would like the slider above the horizontal menu.

    Here is the link for the testsite: testsite

    It’s images like this i’ll use: Image

    Is that information enough?

    Am i understanding your plugin correct in that way that the slider included in the header.php can be overruled by a single image (“Page header Image”) on a specific page/post?
    (sorry my english is poor)

    As a appreciation and thanks in advance I’ll make a donation right now 🙂

    //Lars, Copenhagen

    Plugin Author Josh Leuze
    Participant

    @jleuze

    Thanks a lot for your support and feedback Lars!

    You can replace the whole header area above the navigation with a slideshow by taking this bit of code:

    <div class="wst-shapes">
    <?php if(theme_get_option('theme_header_show_headline')): ?>
    	<?php $headline = theme_get_option('theme_'.(is_home()?'posts':'single').'_headline_tag'); ?>
    	<<?php echo $headline; ?> class="wst-headline" data-left="9.42%">
        <a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a>
    </<?php echo $headline; ?>>
    <?php endif; ?>
    <?php if(theme_get_option('theme_header_show_slogan')): ?>
    	<?php $slogan = theme_get_option('theme_'.(is_home()?'posts':'single').'_slogan_tag'); ?>
    	<<?php echo $slogan; ?> class="wst-slogan" data-left="10.87%"><?php bloginfo('description'); ?></<?php echo $slogan; ?>>
    <?php endif; ?>
    
                </div>

    And replacing it with this:

    <div class="wst-shapes">
    <?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow(); } ?>
     </div>

    That will be just the slides though, no other content like the title and description that you have on there currently. If you wanted to replace the static background image with a slideshow and keep that content in there you would have to style them with CSS to be positioned above the slideshow.

    By default the slideshow will load on all pages if it is added to the header.php file. You can add a PHP conditional to this, like if it is the homepage load the slideshow, otherwise load a certain static image. You could also use featured images if you wanted to like how Twenty Eleven works, but I don’t think your theme supports that by default so you would have to add that in.

    Hi Josh

    Thanks for your reply …. I’ll try it out later today

    // Lars

    Hi Josh

    Just had to try it out before leaving for work 😉

    The slider is now working, but the images are scaling (IE and FireFox) 🙁 …. can you help with that?

    Link

    How can I “lift” the title and description above the slides so that they are visible?
    is that possible at all with your slider?

    You can add a PHP conditional to this, like if it is the homepage load the slideshow, otherwise load a certain static image.

    Could you please give me a hint on how that PHP-code could look like?

    If I want different slideshow on each page will that be possible with the same PHP-code?

    Sorry for all the questions 🙂

    Thanks

    //Lars, Copenhagen

    Plugin Author Josh Leuze
    Participant

    @jleuze

    It looks like the slideshow is shrunk a bit in all browsers. The slideshow is 981px wide, but the “wst-sheet” container is only 900px wide. To make a slideshow that large fit, the container needs to be resized to match:

    .wst-sheet {
    background: #F9FAFB;
    background: transparent;
    margin: 0 auto;
    position: relative;
    cursor: auto;
    width: 981px;
    z-index: auto !important;
    }

    Layering the title and description over the slideshow is possible, this wouldn’t be part of the slideshow, just something you’d style in the theme. That content would be absolutely positioned and set to a high z-index. Just like how the slideshow captions can be styled, take at the CSS for that as an example.

    Here’s an example of a PHP conditional that would load the homepage slideshow on the front page, the about slideshow on the about page, and a default static image on all other pages:

    <?php if ( is_front_page() ) {
    	if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow( "homepage", "" ); }
    } elseif ( is_page( 'about' ) ) {
    	if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow( "about", "" ); }
    } else {
    	echo '<img src="default.jpg" alt="" />';
    } ?>
Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Resolved] Slideshow i header Theme by Artisteer – How??’ is closed to new replies.