html 海狸生成器主题页面HTML

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html 海狸生成器主题页面HTML相关的知识,希望对你有一定的参考价值。

<!-- 
A stripped down mock-up of what a standard page's HTML looks like when the Beaver Builder Theme is active 
-->

<body class="page page-id-623 page-template page-template-my-templates page-template-testing-template page-template-my-templatestesting-template-php logged-in admin-bar no-customize-support fl-preset-default fl-full-width" itemscope="itemscope" itemtype="http://schema.org/WebPage">

  <div class="fl-page">
  
    <header class="fl-page-header fl-page-header-fixed fl-page-nav-right">
    
      <div class="fl-page-header-wrap">
      
        <div class="fl-page-header-container container">
        
          <div class="fl-page-header-row row">
          
            <div class="fl-page-logo-wrap col-md-3 col-sm-12">
            
              <div class="fl-page-header-logo">
              
                <a href="http://example.com"><span class="fl-logo-text" itemprop="name">Beaver Builder</span></a>
              
              </div><!-- .fl-page-header-logo -->
            
            </div><!-- .fl-page-logo-wrap -->
            
            <div class="fl-page-fixed-nav-wrap col-md-9 col-sm-12">
            
              <div class="fl-page-nav-wrap">
              
                <nav class="fl-page-nav fl-nav navbar navbar-default" role="navigation">
                
                  <div class="fl-page-nav-collapse collapse navbar-collapse">
                  
                    <ul id="menu-header-menu" class="nav navbar-nav navbar-right menu">
                      <li id="menu-item-24" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-24"><a href="http://example.com/">Home</a></li>
                      <li id="menu-item-783" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-623 current_page_item menu-item-783"><a href="http://example.com/?page_id=623">About Page</a></li>
                      <li id="menu-item-757" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-757"><a href="http://example.com/?page_id=61">Page Layouts</a>
                        <ul class="sub-menu">
                          <li id="menu-item-760" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-760"><a href="http://example.com/?page_id=63">Content/Sidebar</a></li>
                          <li id="menu-item-758" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-758"><a href="http://example.com/?page_id=65">Sidebar/Content</a></li>
                          <li id="menu-item-759" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-759"><a href="http://example.com/?page_id=67">Content/Sidebar/Sidebar</a></li>
                          <li id="menu-item-785" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-785"><a href="http://example.com/?page_id=70">Sidebar/Sidebar/Content</a></li>
                          <li id="menu-item-784" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-784"><a href="http://example.com/?page_id=71">Sidebar/Content/Sidebar</a></li>
                          <li id="menu-item-782" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-782"><a href="http://example.com/?page_id=73">Full Width Content</a></li>
                        </ul>
                      </li>
                      <li id="menu-item-780" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-780"><a href="http://example.com/?page_id=79">Blog Page</a></li>
                      <li id="menu-item-781" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-781"><a href="http://example.com/?page_id=83">Contact Page</a></li>
                    </ul>
                  
                  </div><!-- .fl-page-nav-collapse -->
                
                </nav><!-- .fl-page-nav -->
              
              </div><!-- .fl-page-nav-wrap -->
            
            </div><!-- .fl-page-fixed-nav-wrap -->
          
          </div><!-- .fl-page-header-row -->
        
        </div><!-- .fl-page-header-container -->
      
      </div><!-- .fl-page-header -->
    
    </header><!-- .fl-page-header-fixed -->
    
    <header class="fl-page-header fl-page-header-primary fl-page-nav-right fl-page-nav-toggle-button" itemscope="itemscope" itemtype="http://schema.org/WPHeader">
    
      <div class="fl-page-header-wrap">
      
        <div class="fl-page-header-container container">
        
          <div class="fl-page-header-row row">
          
            <div class="col-md-4 col-sm-12 fl-page-header-logo-col">
            
              <div class="fl-page-header-logo" itemscope="itemscope" itemtype="http://schema.org/Organization">
              
                <a href="http://example.com" itemprop="url"><span class="fl-logo-text" itemprop="name">Beaver Builder</span></a>
              
              </div><!-- .fl-page-header-logo -->
            
            </div><!-- .fl-page-header-logo-col -->
            
            <div class="fl-page-nav-col col-md-8 col-sm-12">
            
              <div class="fl-page-nav-wrap">
              
                <nav class="fl-page-nav fl-nav navbar navbar-default" role="navigation" itemscope="itemscope" itemtype="http://schema.org/SiteNavigationElement">
                
                  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".fl-page-nav-collapse">
                  
                    <span>Menu</span>
                  
                  </button>
                
                  <div class="fl-page-nav-collapse collapse navbar-collapse">
                
                    <div class="fl-page-nav-search">
                    
                      <a href="javascript:void(0);" class="fa fa-search"></a>
                      <form method="get" role="search" action="http://example.com" title="Type and press Enter to search.">
                        <input type="text" class="fl-search-input form-control" name="s" class="" value="Search" onfocus="if (this.value == 'Search') { this.value = ''; }" onblur="if (this.value == '') this.value='Search';">
                      </form>
                    
                    </div><!-- .fl-page-nav-search -->
                  
                    <ul id="menu-header-menu-1" class="nav navbar-nav navbar-right menu">
                      <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-24"><a href="http://example.com/">Home</a></li>
                      <li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-623 current_page_item menu-item-783"><a href="http://example.com/?page_id=623">About Page</a></li>
                      <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-757"><a href="http://example.com/?page_id=61">Page Layouts</a>
                        <ul class="sub-menu">
                          <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-760"><a href="http://example.com/?page_id=63">Content/Sidebar</a></li>
                          <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-758"><a href="http://example.com/?page_id=65">Sidebar/Content</a></li>
                          <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-759"><a href="http://example.com/?page_id=67">Content/Sidebar/Sidebar</a></li>
                          <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-785"><a href="http://example.com/?page_id=70">Sidebar/Sidebar/Content</a></li>
                          <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-784"><a href="http://example.com/?page_id=71">Sidebar/Content/Sidebar</a></li>
                          <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-782"><a href="http://example.com/?page_id=73">Full Width Content</a></li>
                        </ul>
                      </li>
                      <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-780"><a href="http://example.com/?page_id=79">Blog Page</a></li>
                      <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-781"><a href="http://example.com/?page_id=83">Contact Page</a></li>
                    </ul>
                
                  </div><!-- .fl-page-nav-collapse -->
                
                </nav><!-- .fl-page-nav -->
              
              </div><!-- .fl-page-nav-wrap -->
            
            </div><!-- .fl-page-nav-col -->
          
          </div><!-- .fl-page-header-row -->
        
        </div><!-- .fl-page-header-container -->
      
      </div><!-- .fl-page-header-wrap -->
    
    </header><!-- .fl-page-header -->

    <div class="fl-page-content" itemprop="mainContentOfPage">
    
      <div class="fl-content-full container">
      
        <div class="row">
        
          <div class="fl-content col-md-12 stuff-and-stuff">
          
            <article class="fl-post post-623 page type-page status-publish hentry" id="fl-post-623" itemscope="itemscope" itemtype="http://schema.org/CreativeWork">
            
              <header class="fl-post-header">
              
                <h1 class="fl-post-title" itemprop="headline">About Page</h1>
              
                <a class="post-edit-link" href="http://example.com/wp-admin/post.php?post=623&#038;action=edit">Edit</a>
              
              </header><!-- .fl-post-header -->
              
              <div class="fl-post-content clearfix" itemprop="text">
                <p>This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.</p>
                <p>This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.</p>
              </div><!-- .fl-post-content -->
              
              <div class="fl-comments">
              
                <div id="respond" class="comment-respond">
                
                  <h3 id="reply-title" class="comment-reply-title">Leave a Comment <small><a rel="nofollow" id="cancel-comment-reply-link" href="/?page_id=623#respond" style="display:none;">Cancel Reply</a></small></h3>				<form action="http://example.com/wp-comments-post.php" method="post" id="fl-comment-form" class="fl-comment-form">
                  <p>Logged in as <a href="http://example.com/wp-admin/profile.php">Eric Hamm</a>. <a href="http://example.com/wp-login.php?action=logout&amp;redirect_to=http%3A%2F%2Fexample.com%2F%3Fpage_id%3D623&amp;_wpnonce=3237d8d976" title="Log out of this account">Log out &raquo;</a></p><label for="comment">Comment</label>
                    <textarea name="comment" class="form-control" cols="60" rows="8" tabindex="4"></textarea><br /><p class="form-submit"><input name="submit" type="submit" id="fl-comment-form-submit" class="btn btn-primary" value="Submit Comment" /> <input type='hidden' name='comment_post_ID' value='623' id='comment_post_ID' />
                    <input type='hidden' name='comment_parent' id='comment_parent' value='0' />
                  </p>
                
                </div><!-- #respond -->
              
              </div><!-- .fl-comments -->
            
            </article><!-- .fl-post -->
          
          </div><!-- .fl-content -->
        
        </div><!-- .row -->
      
      </div><!-- .fl-content-full -->
    
    </div><!-- .fl-page-content -->
    
    <footer class="fl-page-footer-wrap" itemscope="itemscope" itemtype="http://schema.org/WPFooter">
    
      <div class="fl-page-footer">
      
        <div class="fl-page-footer-container container">
        
          <div class="fl-page-footer-row row">
          
            <div class="col-md-12 text-center clearfix">
            
              <div class="fl-page-footer-text fl-page-footer-text-1">
              
                <span>&copy; 2016 Beaver Builder</span>
                <span> | </span>
                <span id="fl-site-credits">Powered by <a href="http://www.wpbeaverbuilder.com/?utm_medium=bb-pro&utm_source=bb-theme&utm_campaign=theme-footer" target="_blank" title="WordPress Page Builder Plugin">Beaver Builder</a></span>
              
              </div><!-- .fl-page-footer-text -->
            
            </div><!-- .col-md-12 -->
          
          </div><!-- .fl-page-footer -->
        
        </div><!-- .fl-page-footer-container -->
      
      </div><!-- .fl-page-footer -->
    
    </footer><!-- .fl-page-footer-wrap -->
  
  </div><!-- .fl-page -->

</body>

以上是关于html 海狸生成器主题页面HTML的主要内容,如果未能解决你的问题,请参考以下文章

css 创世纪主题 - 全宽包裹 - 海狸生成器

css 创世纪主题 - 全宽包裹 - 海狸生成器

html 海狸生成器短代码和小工具钩

php 海狸主题 - CSS版本缓存

css 海狸主题通过短代码添加搜索

css 海狸主题子菜单自动宽度