Remove new lines after echoing HTML from PHP

2 Views

I have a WordPress function that checks if a user has filled in some fields on his or her profile. If it is filled in, echo its contents, if not: don’t. Here is a stripped down version of the fun 

<ul>
    <?php if (get_the_author_meta('url',$theID)) : ?>
        <li class="url">
            <a href="<?php the_author_meta('url',$theID); ?>" title="">Website</a>
        </li>
    <?php endif; // End check for url ?>
    <?php if ( get_the_author_meta('twitter',$theID)) : ?>
        <li class="twitter">
            <a href="http://twitter.com/<?php the_author_meta('twitter',$theID); ?>" title="">Twitter</a>
        </li>
    <?php endif; // End check for twitter ?>
    <?php if ( get_the_author_meta('instagram',$theID)) : ?>
        <li class="instagram">
            <a href="http://instagram.com/<?php the_author_meta('instagram',$theID); ?>" title="">Instagram</a>
        </li>
    <?php endif; // End check for instagram ?>
    <?php if ( get_the_author_meta('linkedin',$theID)) : ?>
        <li class="linkedin">
            <a href="http://www.linkedin.com/<?php the_author_meta('linkedin',$theID); ?>" title="">LinkedIn</a>
        </li>
    <?php endif; // End check for linkedin ?>
</ul>

This works well. However, for layout purposes I am using inline on these elements and I can’t use floats. As you may know, this causes “gaps” in between the elements because they are all echoed on new lines.

Read More

gaps

I don’t want these gaps. I know I can solve it by an arbitrary negative margin, but I don’t want to use it because I am using a responsive, percentage based layout. The solution would be to “fill the gaps” in HTML by glueing all HTML together without new lines. As an example:

Will create gaps when displayed inline: 

<ul>
  <li>Twitter</li>
  <li>Instagram</li>
  <li>LinkedIn</li>
</ul>

Won’t have gaps: 

<ul>
  <li>Twitter</li><li>Instagram</li><li>LinkedIn</li>
</ul>

I am looking for a PHP solution (no CSS) that can get rid of all the new lines inside the ul, but I don’t know where to start. Or, more precisely, I don’t know where to put the function that removes the new lines. How can I wrap all that HTML, and then replace the new lines by … nothing?

Post Views: 2

Related posts

Leave a Reply

8 comments

  1. Have you tried something like:

    $string = str_replace("n", "", $string);

    or:

    $string = str_replace("nr", "", $string);

    (where $string is the html you want to get on one line)

  2. <ul class="author-meta">
    <?php
        if (get_the_author_meta('url', $theID)) {
            $output = '<li class="url"><a href="' . get_the_author_meta('url', $theID) . '" title="">Website</a></li>';
        }
        if ( get_the_author_meta('twitter', $theID)) {
            $output .= '<li class="twitter"><a href="http://twitter.com/' . get_the_author_meta('twitter', $theID) . '" title="">Twitter</a></li>';
        }
        if ( get_the_author_meta('instagram', $theID)) {
            $output .= '<li class="instagram"><a href="http://instagram.com/' . get_the_author_meta('instagram', $theID) . '" title="">Instagram</a></li>';
        }
        if ( get_the_author_meta('linkedin', $theID)) {
            $output .= '<li class="linkedin"><a href="http://www.linkedin.com/' . get_the_author_meta('linkedin', $theID) . '" title="">LinkedIn</a></li>';
        }
        echo $output;
    ?>
</ul>

    Edit by Bram Vanroy: make sure to use get_the_author_meta instead of the_author_meta when using the function in PHP.

  3. You can do something like this:

    ob_start();
//echo whatever stuff you need
echo str_replace(PHP_EOL, NULL, ob_get_clean());

    Using PHP_EOL instead of n or rn will catch line breaks regardless of platform.

  4. You can use buffer for that : 

    <?php 
function remove_white_spaces($buffer){
    return trim(preg_replace('/ss+/', ' ', $buffer));
}
ob_start('remove_white_spaces'); 
?>
<ul>
    <?php if (get_the_author_meta('url',$theID)) : ?>
        <li class="url">
            <a href="<?php the_author_meta('url',$theID); ?>" title="">Website</a>
        </li>
    <?php endif; // End check for url ?>
    <?php if ( get_the_author_meta('twitter',$theID)) : ?>
        <li class="twitter">
            <a href="http://twitter.com/<?php the_author_meta('twitter',$theID); ?>" title="">Twitter</a>
        </li>
    <?php endif; // End check for twitter ?>
    <?php if ( get_the_author_meta('instagram',$theID)) : ?>
        <li class="instagram">
            <a href="http://instagram.com/<?php the_author_meta('instagram',$theID); ?>" title="">Instagram</a>
        </li>
    <?php endif; // End check for instagram ?>
    <?php if ( get_the_author_meta('linkedin',$theID)) : ?>
        <li class="linkedin">
            <a href="http://www.linkedin.com/<?php the_author_meta('linkedin',$theID); ?>" title="">LinkedIn</a>
        </li>
    <?php endif; // End check for linkedin ?>
</ul>
<?php ob_end_flush(); ?>

    Catch all the output on a buffer, run a function to replace new lines with blanks, and release the buffer.

  6. As per comment by @APAD1 and feedback by @CBRoe, I decided to go with the comment method. It works flawlessly, though the HTML output isn’t pretty (empty comments, byebye semantics).

    <ul class="author-meta">
    <?php if (get_the_author_meta('url',$theID)) : ?><li class="url">
            <a href="<?php the_author_meta('url',$theID); ?>" title="">Website</a>
        </li><?php endif; // End check for url ?><!--
    --><?php if ( get_the_author_meta('twitter',$theID)) : ?><li class="twitter">
            <a href="http://twitter.com/<?php the_author_meta('twitter',$theID); ?>" title="">Twitter</a>
        </li><?php endif; // End check for twitter ?><!--
    --><?php if ( get_the_author_meta('instagram',$theID)) : ?><li class="instagram">
            <a href="http://instagram.com/<?php the_author_meta('instagram',$theID); ?>" title="">Instagram</a>
        </li><?php endif; // End check for instagram ?><!--
    --><?php if ( get_the_author_meta('linkedin',$theID)) : ?><li class="linkedin">
            <a href="http://www.linkedin.com/<?php the_author_meta('linkedin',$theID); ?>" title="">LinkedIn</a>
        </li><?php endif; // End check for linkedin ?>
</ul>

    Note that the comments should be outside the if clauses, because if they are inside they might not be echoed corretly, e.g. missing a opening or closing tag.

  7. Here you go:

    <ul><?php 
$output = '';
if (get_the_author_meta('url', $theID)) {
    $output .= '<li class="url"><a href="' . the_author_meta('url',$theID) . '" title="">Website</a></li>';
} elseif (get_the_author_meta('twitter', $theID)) {
    $output .= '<li class="twitter"><a href="http://twitter.com/' . the_author_meta('twitter', $theID) . '" title="">Twitter</a></li>';
} elseif (get_the_author_meta('instagram', $theID)) {
    $output .= '<li class="instagram"><a href="http://instagram.com/' .  the_author_meta('instagram', $theID) . '" title="">Instagram</a></li>';
} elseif (get_the_author_meta('linkedin',$theID)) {
    $output .= '<li class="linkedin"><a href="http://www.linkedin.com/' . the_author_meta('linkedin', $theID) . '" title="">LinkedIn</a></li>';
}
echo $output;
?></ul>

  8. To make an easy to use version, you can store all your websites data in an array:

    $site=Array(
   "url"=>"Website",
   "twitter"=> "Twitter",
   "instagram"=> "Instagram",
   "linkedin"=>"LinkedIn"
);

    And then generating the whole list. I used a simple sample case where all domains are .com. You will have to improve the array format if you want more information to be stored.

    <ul><?php
foreach($site as $k=>$v)
if (get_the_author_meta($k,$theID))
   echo '<li class="'.$k.'"><a href="'
      .(($k=="url")?"":"http://$k.com/")
      .the_author_meta($k,$theID).'">'.$v.'</a></li>';
?></ul>

    Don’t forget to remove your empty title attribute in your a tags.

    Note that there are others CSS alternatives: using display:table on your ul and display:table-cell on your li, or using display: flex and so on.