Ergebnis 1 bis 3 von 3

Thema: HTML/Wordpress Video Header

  1. #1
    HTML Newbie
    Registriert seit
    20.05.2016
    Beiträge
    1
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard HTML/Wordpress Video Header

    Hallo zusammen,

    da meine Expertise im Webdesign zu wünschen übrig lässt, benutze ich momentan Wordpress um eine kleine Seite aufzusetzen.

    Kommen wir direkt zu meinem Problem:
    Ich würde gerne in den Startseiten-Header meiner Website ein Video einbetten. Der Header erstreckt sich über den gesamten Bildschirm und das Video soll im Hintergrund geloopt werden (momentan befindet sich dort ein Bild).
    Habe mich daran versucht, den Code der Header-Datei im Editor-Modus anzupassen (z.B. "iframe" integriert). Bisher leider erfolglos.

    Quelltext:

    <?php
    /**
    * The template for displaying the header.
    *
    * @package WordPress
    * @subpackage illdy
    */
    ?>
    <?php
    $img_logo = get_theme_mod( 'illdy_img_logo', esc_url( get_template_directory_uri() . '/layout/images/header-logo.png' ) );
    $text_logo = get_theme_mod( 'illdy_text_logo', __('Illdy', 'illdy') );
    $jumbotron_general_image = get_theme_mod( 'illdy_jumbotron_general_image', esc_url( get_template_directory_uri() . '/layout/images/front-page/front-page-header.png' ) );
    $preloader_enable = get_theme_mod( 'illdy_preloader_enable', 1 );
    ?>
    <!DOCTYPE html>
    <html <?php language_attributes(); ?>>
    <head>
    <meta charset="<?php bloginfo( 'charset' ); ?>" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <?php wp_head(); ?>
    </head>
    <body <?php body_class(); ?>>
    <?php if( $preloader_enable == 1 ): ?>
    <div class="pace-overlay"></div>
    <?php endif; ?>
    <header id="header" class="<?php if( is_front_page() ): echo 'header-front-page'; else: echo 'header-blog'; endif; ?>" style="background-image: url('<?php if( is_front_page() ): echo ( ( $jumbotron_general_image ) ? esc_url( $jumbotron_general_image ) : '' ); else: echo esc_url( get_header_image() ); endif; ?>');">
    <div class="top-header">
    <div class="container">
    <div class="row">
    <div class="col-sm-2">
    <?php if( $img_logo ): ?>
    <a href="<?php echo esc_url( home_url() ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" class="header-logo"><img src="<?php echo esc_url( $img_logo ); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" /></a>
    <?php else: ?>
    <a href="<?php echo esc_url( home_url() ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" class="header-logo"><?php echo illdy_sanitize_html( $text_logo ); ?></a>
    <?php endif; ?>
    </div><!--/.col-sm-2-->
    <div class="col-sm-10">
    <nav class="header-navigation">
    <ul class="clearfix">
    <?php
    wp_nav_menu( array(
    'theme_location' => 'primary-menu',
    'menu' => '',
    'container' => '',
    'container_class' => '',
    'container_id' => '',
    'menu_class' => '',
    'menu_id' => '',
    'items_wrap' => '%3$s',
    'walker' => new MTL_Extended_Menu_Walker(),
    'fallback_cb' => 'MTL_Extended_Menu_Walker::fallback'
    ) );
    ?>
    </ul><!--/.clearfix-->
    </nav><!--/.header-navigation-->
    <button class="open-responsive-menu"><i class="fa fa-bars"></i></button>
    </div><!--/.col-sm-10-->
    </div><!--/.row-->
    </div><!--/.container-->
    </div><!--/.top-header-->
    <nav class="responsive-menu">
    <ul>
    <?php
    wp_nav_menu( array(
    'theme_location' => 'primary-menu',
    'menu' => '',
    'container' => '',
    'container_class' => '',
    'container_id' => '',
    'menu_class' => '',
    'menu_id' => '',
    'items_wrap' => '%3$s',
    'walker' => new MTL_Extended_Menu_Walker(),
    'fallback_cb' => 'MTL_Extended_Menu_Walker::fallback'
    ) );
    ?>
    </ul>
    </nav><!--/.responsive-menu-->
    <?php
    if( is_front_page() ):
    get_template_part( 'sections/front-page', 'bottom-header' );
    else:
    get_template_part( 'sections/blog', 'bottom-header' );
    endif;
    ?>
    </header><!--/#header-->



    Problematisch war es vor allem für mich, dass im Header per php-Funktion zwischen Start- und Blogseite unterschieden wird (nur auf Startseite gewünscht).


    Für eine einfache Lösung meines Problems, wäre ich euch unglaublich dankbar.

    MfG Doge
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    HTML Newbie
    Registriert seit
    22.05.2016
    Ort
    Speichersdorf und Pegnitz
    Beiträge
    8
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: HTML/Wordpress Video Header

    Ich kann dir da nicht helfe, weil programmieren nicht zu meinen Stärken gehört. Aber was mich interessieren würde, ist warum du da ein Video einbinden möchtest. Was bringt dir das?

  3. #3
    Interessierte/r
    Registriert seit
    05.01.2016
    Beiträge
    146
    Danke
    9
    Bekam 11 mal "Danke" in 11 Postings

    Standard AW: HTML/Wordpress Video Header

    naja normalerweise sieht sowas ja
    in etwa so aus..

    <body>
    <div id="wrapper">
    <div>
    <h4>Die Navigation</h4>
    <nav id="nav">
    <ul>
    <li> link 1</li>
    <li> link 2</li>
    <li> link 3</li>
    <li> link 4</li>
    <li> link 5</li>
    </ul>
    </nav>


    </div>


    <div id="vid-banner">
    <video width="990" id="bgvid" loop autoplay>
    <source src="../dein-Video.mp4" type="video/mp4" />
    <source src="../dein-Video.ogg" type="video/ogg" />
    </video>




    <div class="welcome text-center">
    <h1><span>Hier kommt Text oder so drüber wenn gewünscht</span></h1>
    <h1 >Willkommen </h1>
    <p><a href="#about">BEGIN</a></p>
    </div>
    </div>


    <div id="content">
    <h2>Hier gehts weiter mit Content bei bedarf..</h2>
    </div>
    </div>
    </body>

    und dann mit CSS wie gewünscht Positionieren alles...

    MfG

Ähnliche Themen

  1. Wordpress / Avada Theme / Sticky Header -> Zentrieren
    Von dstarship im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 10.06.2014, 22:34
  2. Wordpress HTML Problem
    Von bugmenot im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 17.02.2013, 19:05
  3. HTML-Site und Wordpress
    Von jensiboy im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 29.03.2011, 13:38
  4. $header als variable für header.html
    Von im Forum HTML & CSS Forum
    Antworten: 13
    Letzter Beitrag: 15.10.2006, 14:24

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •