How to reorder output of shortcode

Question

I have the following shortcode as part of a theme I am using:

  //contactform shortcode
function contactform_shortcode( $atts, $content = null ) {
    extract( shortcode_atts( array(
        'class' => 'content'
    ), $atts ) );

    $returncontent = '<div class="' . esc_attr($class) . '">';
    $returncontent .= '<a href="#" id="info" class="open">ContactInformation</a>
            <h5>Get In Touch</h5><div id="contactform">
            <div id="response"></div>
            <form id="precision-contact-form" method="POST" class="form">
                <div id="main">
                    <p class="name">
                        <input type="text" name="uname" id="uname" />
                        <label for="uname" class="overlabel">Name</label>
                    </p>
                    <p class="email">
                        <input type="text" name="uemail" id="uemail" />
                        <label for="uemail" class="overlabel">E-mail</label>
                    </p>
                    <p class="text">
                        <textarea name="ucomments" id="ucomments" ></textarea>
                    </p>
                    <p class="submit">
                        <button type="submit" name="submit" id="submit" class="graybutton">Send Email</button>
                    </p>
                </div><!--end main-->
            </form>
        </div><!--end contact form-->';
    $returncontent .= '</div>';
    return $returncontent;
}
add_shortcode('contactform', 'contactform_shortcode');
?>

I want to move the link with the id #info

$returncontent = '<div class="' . esc_attr($class) . '">';
    $returncontent .= '<a href="#" id="info" class="open">ContactInformation</a>

from the top of the page to the bottom underneath the form ... but I cannot get it to work ...

Answer 1

Paste the line with the id="info" AFTER the comment about END of Contact Form Remember to close the id="info" line with a quote and semicolon;

Paste this ' $returncontent .= ' BEFORE the h5 Get in touch with... line

Answer 2

You would move just the link itself. Make sure not to alter the opening quote.

Here's the finished version:

//contactform shortcode
function contactform_shortcode( $atts, $content = null ) {
    extract( shortcode_atts( array(
        'class' => 'content'
    ), $atts ) );

    $returncontent = '<div class="' . esc_attr($class) . '">';
    $returncontent .= '<h5>Get In Touch</h5><div id="contactform">
            <div id="response"></div>
            <form id="precision-contact-form" method="POST" class="form">
                <div id="main">
                    <p class="name">
                        <input type="text" name="uname" id="uname" />
                        <label for="uname" class="overlabel">Name</label>
                    </p>
                    <p class="email">
                        <input type="text" name="uemail" id="uemail" />
                        <label for="uemail" class="overlabel">E-mail</label>
                    </p>
                    <p class="text">
                        <textarea name="ucomments" id="ucomments" ></textarea>
                    </p>
                    <p class="submit">
                        <button type="submit" name="submit" id="submit" class="graybutton">Send Email</button>
                    </p>
                </div><!--end main-->
            </form>
        </div><!--end contact form-->
        <a href="#" id="info" class="open">ContactInformation</a>';
    $returncontent .= '</div>';

    return $returncontent;
}
add_shortcode('contactform', 'contactform_shortcode');