Creating a WordPress shortcode

Question

I'm coding my first WP shortcode and am having trouble turning my working PHP into a working shortcode. I have successfully created a basic shortcode that returns text in the spot I'd like so that much is good. But I'm not doing so well putting the chocolate in the peanut butter.

Here's what I have for the working PHP:

<div class="authorsocial">
    <h5>Connect, Share &amp; Follow</h5>
        <ul>
           <?php $meta_socialgr = apply_filters('the_content', get_post_meta($post->ID, 'author_goodreads', true));
              if (!empty($meta_socialgr)) { ?>
                <li><a href="<?php echo get_post_meta( $post->ID, 'author_goodreads', true );?>"><img src="http://fiddlehead.milkbossindustries.com/files/goodreads.jpg"></a></li>
           <?php } ?>
        </ul>
</div><!-- end authorsocial -->              

And here is my basic shortcode:

<?php
// Adding a shortcode to return each author's social media links
    function funcauthor_social( $atts ){
        $output = 'bubbalicious';
        return $output;
    }
    add_shortcode( 'author_social', 'funcauthor_social' );
?>

I'm not having much success in replacing "bubbalicious" with my functions as I'm just not grasping...something.

<?php
// Adding a shortcode to return each author's social media links
    function funcauthor_social( $atts ){
        $output = '<div class="authorsocial">
        <h5>Connect, Share &amp; Follow</h5>
        <ul>'.$meta_socialgr = apply_filters('the_content', get_post_meta($post->ID, 'author_goodreads', true));
             if (!empty($meta_socialgr)) { '
             <li><a href="'.echo get_post_meta( $post->ID, 'author_goodreads', true );.'"><img src="http://fiddlehead.milkbossindustries.com/files/goodreads.jpg"></a></li>'.}.'
        </ul>
      </div>';
      return $output;
 }
    add_shortcode( 'author_social', 'funcauthor_social' );
    ?>

Answer 1

Separate out your logic from the string you want to return:

<?php
// Adding a shortcode to return each author's social media links
    function funcauthor_social( $atts ){
        $meta_socialgr = esc_url(get_post_meta( $post->ID, 'author_goodreads', true ));

        $output = '<div class="authorsocial"><h5>Connect, Share &amp; Follow</h5><ul>';

        if (!empty($meta_socialgr)) { 
            $output .= '<li><a href="'.$meta_socialgr.'"><img src="http://fiddlehead.milkbossindustries.com/files/goodreads.jpg"></a></li>';
          }

         $output .= '</ul></div>';

        return $output;
 }
    add_shortcode( 'author_social', 'funcauthor_social' );
    ?>

It's not clear why you are applying the_content filter to $meta_socialgr which looks like it should be an url...?

Also, when displaying data from the database (or otherwise some user input) make sure you sanitize that data.