php - 插件或文本不会显示在自定义 wordpress 模板上

标签 php html css wordpress

所以我创建了一个 wordpress,并在那个 wordpress 上制作了一个自定义模板。

自定义模板显示正常,但是当我尝试通过 wordpress 仪表板向我的自定义模板添加插件或文本时,没有任何显示。它不是将其添加到代码中或将其添加到页面中。

下面是我的意思的一些图片。

这是我要添加的 wordpress 仪表板,如您所见,我的模板是 MainTest,我自己制作并完美运行

SS of the Wordpress Dashboard

enter image description here

现在这是页面的 SS,如您所见,test test test 没有出现在任何地方。

This is the SS of the page

enter image description here

这是 MaintTest 模板页面的代码

    <?php
     /*
        Template Name: MainTest
    */
    ?>

    <!DOCTYPE html>

    <html>

    <head>
      <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
      <link rel="stylesheet" href="wp-content/themes/iribbon/newaddons/animate.css">
      <link rel="stylesheet" type="text/css" href="wp-content/themes/iribbon/newaddons/newstyle.css">
      <script type='text/javascript' src='rotate.js'></script>
      <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
      <link rel="stylesheet" href="Fancy/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
      <script type="text/javascript" src="Fancy/source/jquery.fancybox.pack.js?v=2.1.5"></script>

     </head>
     <body>

        <div class='container-fill'>
            <?php include 'wp-content/themes/iribbon/newaddons/header.php'; ?>
            <?php include 'wp-content/themes/iribbon/newaddons/footer.php'; ?>              
        </div>

        <script type="text/javascript">
            $(document).ready(function() {
                $(".fancybox").fancybox();
            });
        </script>

      </body>
      </html>

这是控制它的 CSS。是的,我知道我的 CSS 看起来很草率。

    #midbar {
    background-color: #FFFFFF;
    height: 115px;
    margin: 0 auto;
    opacity: 0.9;
    position: relative;
    top: 0px;
    width: 1200px;
    z-index: 1111;
  }

  #midbar img {
    position: absolute;
    top: -20px;
    left:50%;
    margin-left: -160px;
    width: 300px;
    height: 200px;
    min-height: 50px;
    min-width: 250px;
    vertical-align: middle;
    z-index: 2222;
    opacity:4.0;
  }


  .top {
    position: relative;
    top: -20px;
    width: 100%;
    height: 115px;
    background-color: #FFFFFF;
    z-index: 3333;  
    opacity: 0.9;
    margin: 0 auto;
    width: 100%;
  }

  #navigation {
    border-bottom-style: dotted;
    border-top-style: dotted;
    border-width: 2px;
    left: 0;
    position: absolute;
    top: 45px;
  }

  #navigation ul li {
    position: relative;
    display:inline-block;


    margin:0 23px 0 0;


    z-index: 3333;
  }
  #navigation ul li a     {
    padding-left:15px;
    text-decoration: none;
    text-align: center;
      padding-right:15px;
    color:#000000;
    display:block;
    font-family: 'Gentium Book Basic', serif;
    font-size:18px;
  }

  #navi {
    border-bottom-style: dotted;
    border-top-style: dotted;
    border-width: 2px;
    position: absolute;
    right: 0;
    top: 45px;
  }

  #navi ul li   {
    position: relative;
    display:inline-block;
    margin:0 23px 0 0;
    z-index: 3333;
  }
  #navi ul li a    {
    padding-left:15px;
    text-decoration: none;
    text-align: center;
      padding-right:15px;
    color:#000000;
    display:block;
    font-family: 'Gentium Book Basic', serif;
    font-size:18px;
  }

  #slideshow{
    width: 100%;
    height: 100%;
  }

  #slideshow{
    -webkit-animation: cssAnimation 8s 16 ease-in-out;
    -moz-animation: cssAnimation 8s 16 ease-in-out;
    -o-animation: cssAnimation 8s 16 ease-in-out;
    }
  @-webkit-keyframes cssAnimation {
  from { -webkit-transform: rotate(0deg) scale(1.1) skew(1deg) translate(0px); }
  to { -webkit-transform: rotate(0deg) scale(1.3) skew(1deg) translate(0px); }
  }
  @-moz-keyframes cssAnimation {
  from { -moz-transform: rotate(0deg) scale(1.1) skew(1deg) translate(0px); }
  to { -moz-transform: rotate(0deg) scale(1.3) skew(1deg) translate(0px); }
  }
  @-o-keyframes cssAnimation {
  from { -o-transform: rotate(0deg) scale(1.1) skew(1deg) translate(0px); }
  to { -o-transform: rotate(0deg) scale(1.3) skew(1deg) translate(0px); }
  }


  #imgholder {
    position: relative;
    top: -150px;
    width: 100%;
    height: 500px;
    overflow: hidden;
  }

  #social  {
    position: relative;
    width: 20%;
    top: 30px;
    margin-left: auto;
    margin-right: auto;
  }

  #social .fb {
    position: relative;
    left: -5%;
  }

  #social .pin {
    position: relative;
    left: 0%;
  }

  #social .tweet{
    position: relative;
    left: 5%;
  }
  #foot {
    width: 100%;
    height: 200px;
    position: absolute;
    margin-right: auto;
    margin-left: auto;
    bottom: 0;
    background-color: #FFFFFF;
    margin:0;
    text-align: center;
    font-size: 12px;    
    }

    #pics {
    width: 100%;
    height: 300px;
    position: relative;
    top: -100px;
    margin-right: auto;
    margin-left: auto;
  }

  #pics .ball {
    position: relative;
    vertical-align: middle;
    left: 140px;
    border: 2px solid #03acfb;
    box-shadow: 0 8px 6px -4px #000000;
  }

  #pics .light {

    position: relative;
    left:165px;
    vertical-align: middle;
    border: 2px solid #03acfb;
    box-shadow: 0 8px 6px -4px #000000;
  }

  #pics .car {

    position: relative;
    left: 190px;
    vertical-align: middle;
    border: 2px solid #03acfb;
    box-shadow: 0 8px 6px -4px #000000;
  }

  #piccon {
    width: 1400px;
    height: 300px;
    position: relative;
  margin-right: auto;
  margin-left: auto;
    min-width: 800px;   

  }

  #rotating-item-wrapper {
    position: absolute;
    width: 1940px;
    height: 347px;
    top: 60px;
    z-index: 8888;
    left: 0;
  }
  .rotating-item {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
  }

  body {
    overflow: hidden;
  }
  #mainabout img {
    width: 100%;
    height: 100%;
  }

  #maintext {    
    width: 800px;
    min-width: 300px;
    height: 600px;
    min-height: 300px;
    position: absolute;
    top: 175px;
    left: 40%;
    margin-right: -250px;
    text-align: center;
    font-size: 18px;
  }
  #mainabout {
    background-color: green;
    position: absolute;
    left: 40%;
    margin-left: -650px;
    top: 155px;
    width: 600px;
    height: 500px;
    min-height: 600px;

  }
  .hidden {
      display: none;
  }

  .images {
    width: 50%;
    position: relative;
    top: 300px;
    height: 300px;
    display: block;

  }
  .images img {    
    width: 30%;
    height: 60%;
  }

请注意,CSS 控制的不仅仅是这个页面,这就是为什么其中有这么多内容。

最佳答案

没有内容显示的原因是您没有在 html 正文中包含循环。有关详细信息,请参阅法典:http://codex.wordpress.org/The_Loop

这是一个演示与逻辑分离的示例,它允许您更好地控制 DOM .

<body>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

    <!-- This will output the title of your page-->
    <div class="page-header">
        <h1><?php the_title(); ?></h1>
    </div>

    <!-- the_content() function is required to output "test test test" -->
    <?php the_content(); ?>

    <?php endwhile; else: ?>

    <!-- If there is an error, this 404 message will be displayed-->
    <div class="page-header">
        <h1>Oh no!</h1>
    </div>

    <p>No content is appearing for this page!</p>

<?php endif; ?>
</body>

此外,您应该使用以下函数调用页眉和页脚:

标题: http://codex.wordpress.org/Function_Reference/get_header

<?php get_header(); ?>

页脚: http://codex.wordpress.org/Function_Reference/get_footer

<?php get_footer(); ?>

关于php - 插件或文本不会显示在自定义 wordpress 模板上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27722011/

相关文章:

php - 获取 Mysql $Row 和查询

php - ob_clean 和 ob_flush 之间的区别?

html - 将 div 彼此对齐

jquery - e.pageX 在所有分辨率下都无法正常工作

php - PHP打开Flash Chart 2错误(摆脱它)

php - Group Concat 重复区域的使用

html - 背景图片加载不正确

html - 图片在 firefox 中显示不正确

html - 添加页面/链接

html - 你怎么能用CSS在html中制作一个形状