CODEWITHSUNDEEP
phpwordpressreplacenewline
Bram Vanroy
Bram Vanroy

Reputation: 28437

Remove new lines after echoing HTML from PHP

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.

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?

Upvotes: 1

Views: 1068

Answers (8)

Adam
Adam

Reputation: 18807

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.

Upvotes: 0

Jeroen Flamman
Jeroen Flamman

Reputation: 965

<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.

Upvotes: 0

Jeroen Flamman
Jeroen Flamman

Reputation: 965

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>

Upvotes: 0

Bram Vanroy
Bram Vanroy

Reputation: 28437

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.

Upvotes: 0

Adam
Adam

Reputation: 18807

Just set your ul font-size to 0 and apply the size to your li

font-size: 15px; display: inline-block;

Upvotes: 0

Rosmarine Popcorn
Rosmarine Popcorn

Reputation: 10967

You can use buffer for that : 

<?php 
function remove_white_spaces($buffer){
    return trim(preg_replace('/\s\s+/', ' ', $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.

Upvotes: 0

Jeroen Flamman
Jeroen Flamman

Reputation: 965

Have you tried something like:

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

or:

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

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

Upvotes: 1

mopsyd
mopsyd

Reputation: 1922

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 \r\n will catch line breaks regardless of platform.

Upvotes: 0

Related Questions