2014-10-01 59 views
0

我在將php代碼集成到我的HTML代碼中時遇到了一些問題!任何人都可以幫助或指引我正確的方向嗎?任何人都可以幫助我與PHP集成PHP?

這裏是我的HTML代碼:

<!-- Slider --> 
<div class="carousel-inner cont-slider"> 

<div class="item active"> 
    <img alt="" title="" src="http://placehold.it/600x400"> 
</div> 
<div class="item"> 
    <img alt="" title="" src="http://placehold.it/600x400"> 
</div> 
<div class="item"> 
    <img alt="" title="" src="http://placehold.it/600x400"> 
</div> 
<div class="item"> 
    <img alt="" title="" src="http://placehold.it/600x400"> 
</div> 
</div> 

<!-- Indicators --> 
<ol class="carousel-indicators"> 
<li class="active" data-slide-to="0" data-target="#article-photo-carousel"> 
    <img alt="" src="http://placehold.it/250x180"> 
</li> 
<li class="" data-slide-to="1" data-target="#article-photo-carousel"> 
    <img alt="" src="http://placehold.it/250x180"> 
</li> 
<li class="" data-slide-to="2" data-target="#article-photo-carousel"> 
    <img alt="" src="http://placehold.it/250x180"> 
</li> 
<li class="" data-slide-to="3" data-target="#article-photo-carousel"> 
    <img alt="" src="http://placehold.it/250x180"> 
</li> 
</ol> 
</div> 

我的PHP代碼是

<?php 
if ($images = get_field('images', $design_id)) { 
foreach ($images as $image) { 
echo '<div class="item"><img src="' . $image['image']['sizes']['large'] . '" /></div>'; 
} 
} 
?> 

上面的代碼是與充當不同的幻燈片導航的縮略圖滑塊。

我已經試過以下:

<!--Slider--> 
<div class="carousel-inner cont-slider"> 
<?php 
if ($images = get_field('images', $design_id)) { 
foreach ($images as $image) { 
echo '<div class="item"><img src="' . $image['image']['sizes']['large'] . '" /></div>'; 
} 
} 
?> 
</div> 

以上工作正常,但是它不添加活動類

那麼對於NAV指標我做了以下

<ol class="carousel-indicators"> 
<li class="active" data-slide-to="0" data-target="#article-photo-carousel"> 
<?php 
if ($images = get_field('images', $design_id)) { 
foreach ($images as $image) { 
echo '<img src="' . $image['image']['sizes']['large'] . '" />'; 
      } 
      } 
?> 
</li> 
<li class="" data-slide-to="1" data-target="#article-photo-carousel"> 
<?php 
if ($images = get_field('images', $design_id)) { 
     foreach ($images as $image) { 
     echo '<img src="' . $image['image']['sizes']['large'] . '" />'; 
            } 
           } 
           ?> 
</li> 
<li class="" data-slide-to="2" data-target="#article-photo-carousel"> 
<?php 
           if ($images = get_field('images', $design_id)) { 
            foreach ($images as $image) { 
             echo '<img src="' . $image['image']['sizes']['large'] . '" />'; 
            } 
           } 
           ?> 
</li> 
<li class="" data-slide-to="3" data-target="#article-photo-carousel"> 
    <?php 
           if ($images = get_field('images', $design_id)) { 
            foreach ($images as $image) { 
             echo '<img src="' . $image['image']['sizes']['large'] . '" />'; 
            } 
           } 
           ?> 
</li> 

上面的問題是,data-slide-to =「...」沒有得到添加。

如果有人可以幫忙,那將不勝感激!由於

+3

'以上工作正常,但是它不添加活性class' - >因爲你沒有在你的代碼中的任何地方寫'active'? – Xatenev 2014-10-01 10:33:06

+0

但是當然如果我添加活動,將應用活動狀態到所有幻燈片..? – user3615681 2014-10-01 10:39:52

回答

0

您需要計算循環中的位置,以便您可以將活動類添加到第1個元素。這些指標同樣適用。 此外,您需要更改data-slide-to屬性以匹配正確的幻燈片。

最後,使用PHP模板語法(if endif/foreach endforeach)和呼應PHP而不是HTML通常更容易閱讀:

<!-- only show slider markup if we have images--> 
<?php if ($images = get_field('images', $design_id)) :?> 
    <!--Slider--> 
    <div class="carousel-inner cont-slider"> 
    <?php 

     $counter=0; 
     foreach ($images as $image) :?> 
      <div class="item<?php echo $counter==0?' active':'';?>"><img src="<?php echo $image['image']['sizes']['large'];?>" /></div> 
      <?php 
      $counter++; 
     endforeach; 
    ?> 
    </div> 
    <ol class="carousel-indicators"> 

    <?php 
     $counter = 0; 
     foreach ($images as $image):?> 
      <li<?php echo $counter==0?' class="active"':'';?> data-slide-to="<?php echo $counter;?>" data-target="#article-photo-carousel"> 
       <img src="<?php echo $image['image']['sizes']['large'];?>" /> 
      </li> 
      <?php 
      $counter++; 
     endforeach;?> 
    </ol> 
<?php endif;?> 
0

嘗試類似:

+++主要HTML文件內容+++

some html ... 
{MYTAG:1} 
some html ... 
{MYTAG:2} 
some html ... 

+++ HTML其他文件內容+++

<!-- some comment --> 
This is {MYTAG:2.1} 

+++ PHP代碼+++

$HTML = file_get_contents($filename); // filename = location main file 

$tpls['mytag:1'] = "this is tag 1"; 
$tpls['mytag:2'] = file_get_contents($another_htmlfile); // another_htmlfile = location html to put in mytag:1 
$tpls['mytag:2.1'] = "tag 2"; 

foreach ($tpls as $tag => $value) { 
    $HTML = str_replace("{".strtoupper($tag)."}",$value,$HTML); 
} 

echo $HTML; 

+++ OU TPUTS +++

some html ... 
This is tag 1 
some html ... 
This is tag 2 
some html ... 

它將使你的生活變得更輕鬆,一旦你得到了它的竅門,並從PHP使得一切都更具可讀性的方式隔開的HTML。

相關問題