在 Twitter 循环中添加引导列之间的边框

Question

好的，我有一个有趣的谜题要解决。

我有一个使用 oAuth Twitter Feed for Developers Plugin 输出 Twitter 提要的 WordPress 网站

我需要那个插件，因为我需要水平显示来自用户的 3 条最新推文。这是插件附带的代码：

<div class="container" id="b2btwitter">
  <?php
    $tweets = getTweets('anthonytravel', 3, array('exclude_replies' => true, 'include_rts' => false));
    foreach($tweets as $tweet){
        if($tweet['text']){
          echo '<div id="twitterCol" class="col-xs-6 col-sm-4">';
            $the_tweet = $tweet['text'];
            foreach($tweet['entities']['user_mentions'] as $key => $user_mention){
                $the_tweet = preg_replace(
                    '/@'.$user_mention['screen_name'].'/i',
                    '<a href="http://www.twitter.com/'.$user_mention['screen_name'].'" target="_blank">@'.$user_mention['screen_name'].'</a>',
                    $the_tweet);
            }
            foreach($tweet['entities']['hashtags'] as $key => $hashtag){
                $the_tweet = preg_replace(
                    '/#'.$hashtag['text'].'/i',
                    '<a href="https://twitter.com/search?q=%23'.$hashtag['text'].'&src=hash" target="_blank">#'.$hashtag['text'].'</a>',
                    $the_tweet);
            }
            foreach($tweet['entities']['urls'] as $key => $link){
                $the_tweet = preg_replace(
                    '`'.$link['url'].'`',
                    '<a href="'.$link['url'].'" target="_blank">'.$link['url'].'</a>',
                    $the_tweet);
            }
            echo '<h1>Anthony Travel</h1><h2><a href="https://www.twitter.com/AnthonyTravel">@anthonytravel</a></h2>';
            echo '<p>'.$the_tweet.'</p>';
            echo '<span> -- '.humanTiming(strtotime($tweet['created_at'])) . ' ago</span>';
            echo '</div>';
        } else {
            echo '
            <br /><br />
            <a href="http://twitter.com/anthonytravel" target="_blank">Click here to read anthonytravel\'S Twitter feed</a>';
        }
    }
    function humanTiming ($time)
    {
        $time = time() - $time; // to get the time since that moment
        $tokens = array (
            31536000 => 'year',
            2592000 => 'month',
            604800 => 'week',
            86400 => 'day',
            3600 => 'hour',
            60 => 'minute',
            1 => 'second'
        );
        foreach ($tokens as $unit => $text) {
            if ($time < $unit) continue;
            $numberOfUnits = floor($time / $unit);
            return $numberOfUnits.' '.$text.(($numberOfUnits>1)?'s':'');
        }
    }
  ?>

一切都很好。但我需要的是推文之间的分隔线。所以两个分隔符。像这样的：

           |           |            
 Tweet 1   |  Tweet 2  |   Tweet 3 
           |           |           
           |           |           

如您所见，我不能只在div 的右侧添加边框，因为那样最后一列就会有边框。我需要将 CSS 添加到一两列而不是其他列。

有没有办法在 JavaScript 或其他东西中做到这一点？

我的另一个想法是分别添加 twitter 提要三个不同的时间，但将最新的推文减 1 或其他效果。我只是不知道这是否可能/如何使用 Twitter API 做到这一点。

Answer 1

找到解决方案！这是最终代码：

<?php
    $x = 1;
    $tweets = getTweets('anthonytravel', 3, array('exclude_replies' => true, 'include_rts' => false));
    foreach($tweets as $tweet){

        if($tweet['text']){
          echo '<div id="twitterCol" class="col-sm-6 col-sm-4 border-'.$x++.'">';
            $the_tweet = $tweet['text'];
            foreach($tweet['entities']['user_mentions'] as $key => $user_mention){
                $the_tweet = preg_replace(
                    '/@'.$user_mention['screen_name'].'/i',
                    '<a href="http://www.twitter.com/'.$user_mention['screen_name'].'" target="_blank">@'.$user_mention['screen_name'].'</a>',
                    $the_tweet);
            }
            foreach($tweet['entities']['hashtags'] as $key => $hashtag){
                $the_tweet = preg_replace(
                    '/#'.$hashtag['text'].'/i',
                    '<a href="https://twitter.com/search?q=%23'.$hashtag['text'].'&src=hash" target="_blank">#'.$hashtag['text'].'</a>',
                    $the_tweet);
            }
            foreach($tweet['entities']['urls'] as $key => $link){
                $the_tweet = preg_replace(
                    '`'.$link['url'].'`',
                    '<a href="'.$link['url'].'" target="_blank">'.$link['url'].'</a>',
                    $the_tweet);
            }

            echo '<h1>Anthony Travel</h1><h2><a href="https://www.twitter.com/AnthonyTravel">@anthonytravel</a></h2>';
            echo '<p>'.$the_tweet.'</p>';
            echo '<span> -- '.humanTiming(strtotime($tweet['created_at'])) . ' ago</span>';
            echo '</div>';
        } else {
            echo '
            <br /><br />
            <a href="http://twitter.com/anthonytravel" target="_blank">Click here to read anthonytravel\'S Twitter feed</a>';
        }
    }
    function humanTiming ($time)
    {
        $time = time() - $time; // to get the time since that moment
        $tokens = array (
            31536000 => 'year',
            2592000 => 'month',
            604800 => 'week',
            86400 => 'day',
            3600 => 'hour',
            60 => 'minute',
            1 => 'second'
        );
        foreach ($tokens as $unit => $text) {
            if ($time < $unit) continue;
            $numberOfUnits = floor($time / $unit);
            return $numberOfUnits.' '.$text.(($numberOfUnits>1)?'s':'');
        }
    }
  ?>

注意顶部有$x = 1; 和border-'.$x++.' 位。感谢@Rick 的想法！ 本质上，我将border-"*a number*" 添加到包装器div 的类中。这给了我每条推文的唯一编号，并允许我使用特定的 CSS 来定位这些唯一编号，即。边框。我花了一段时间才弄清楚该变量需要在主foreach 之外定义，然后可以使用++ 在foreach 中重复。但是我了解了PHP的++！

幸福

Answer 2

在if($tweet['text']) 之前，您可以启动一个计数器，然后根据计数器中的当前步骤分配您的 CSS。