Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.

How to Show Answers below Questions on main Questions page?

+2 votes
10,872 views
asked Sep 18, 2014 in Themes by anonymous
Hi -

How do I customise the main Questions page (e.g. /question2answer/index.php?qa=questions) to show Answers immediately below the Question?

I've changed some code around, and it works okay if there is an Answer for the Question, otherwise it breaks ;-)

Thanks!

1 Answer

+2 votes
answered Jan 27, 2015 by delstone
Here's how I managed to do it - using the Snow theme to override the q_list_item in qa-theme-base.

The code is a little long as it does a number of additional processing (cutting the text at end of words rather than at a fixed numerical point which would result in words being split, adding a "posted by" comment, allowing more of the comment to be made visible etc)

    public function q_list_item($q_item)
    {
        $this->output('<div class="qa-q-list-item'.rtrim(' '.@$q_item['classes']).'" '.@$q_item['tags'].'>');

        $this->q_item_main($q_item);
        $this->q_item_clear();
        
        //print_r($q_item); echo "***".$q_item['raw']['postid'];
        $answers = qa_post_get_question_answers($q_item['raw']['postid']);
            
        $rating = 0;
        $content = "";
        if (!empty($answers)) {
            $this->output("<script type='text/javascript'>
                    function toggleContents(elm) {
                        var titleContainer   = elm.parentNode.getElementsByTagName('div')[0];
                        var contentContainer = elm.parentNode.getElementsByTagName('div')[1];
                        titleContainer.style.display   = (titleContainer.style.display   == 'inline') ? 'none' : 'inline';
                        contentContainer.style.display = (contentContainer.style.display == 'inline' ) ? 'none' : 'inline';                      
                    }
                </script>");
            foreach ($answers as $answer) {
                if ($answer['upvotes'] >= $rating) {
                    $rating = $answer['upvotes'];
                    
                    //$answercontent = $this->embed_replace($answer['content']);
                    $answercontent = $answer['content'];
                    // Determine the part of the content we will show
                    $offset = (strlen($answercontent) < 250 ? strlen($answercontent) : 250);
                    
                    // Cut the content at a sensible point - end of a word
                    $pos = strpos($answercontent,' ', $offset);
                    if ($pos != False) $offset = $pos;

                    $content = substr($answercontent,0,$offset);
                    $remainingcontent = substr($answercontent,$offset);                    
                }
            }

            if ($remainingcontent!="") {
                $remainingcontent = '<div class="devqa-q-more" style="display:inline;" onclick="toggleContents(this)">... <a href="#!">(More)</a></div>
                             <div class="devqa-q-moreanswers">'.$remainingcontent.'</div>';
            } else {
                $remainingcontent = '';
            }
            $this->output('<div class="devqa-q-answers">');
            $this->output($content.$remainingcontent);
            $this->output('</div>');
            
            if (isset($answer['handle'])) {
//                print_r($answer);
                // get user details (display avatar and name)
                $username = qa_db_read_all_assoc(qa_db_query_sub('SELECT handle FROM ^users WHERE userid = #',$answer['userid']), 'handle');
                $user = qa_db_select_with_pending( qa_db_user_account_selectspec($username, false) );
                //$revlink = isset($answer['title']) ? $answer['title'] : "Answer was edited";
                //$htmloutput = (isset($answer['updated']) ? date("Y-m-d H:m", strtotime($answer['updated'])) : "");
                $avatar = qa_get_user_avatar_html($user['flags'], $user['email'], $user['handle'], $user['avatarblobid'], $user['avatarwidth'], $user['avatarheight'], qa_opt('avatar_users_size'), false);
                     
                $this->output('<span class="devqa-q-answers-respondent">');
                $this->output('<span class="qa-q-item-what">answered by </span>');
                $this->output('<a href="./index.php?qa=user&amp;qa_1='.$answer['handle'].'" class="qa-user-link url fn entry-title nickname"> '.$answer['handle'].' </a>');
                $this->output('<span class="qa-q-item-who-data">'.'('.$answer['points'].') points</span>');
                $this->output($avatar.'</span>');
            }
        }
        
        $this->q_item_stats($q_item);
        $this->q_item_clear();

        $this->output('</div> <!-- END qa-q-list-item -->', '');
    }
commented Jan 27, 2015 by Funrunna
@delstone

How do we actually add this code... Can it simply be copied and pasted/appended to qa-theme-base? I ask because there are no line numbers. So, need to know how to affect the changes.
commented Jan 27, 2015 by delstone
Yes, you can just copy it into the qa_theme file if you are using snow.

Some css changes may be needed too - just add these classes to the bottom o the qa-styles.css file:
.devqa-q-answers-respondent {
    display: inline;
    float: right;
    margin: -5px 10px;
    font-size: 11px;
}

.devqa-q-answers {
    padding-left: 10px;
    float: left;
    width: 520px;
    margin: 10px 0 10px;
    clear: none;
    overflow: hidden;
}
.devqa-q-more{
    color: #0179b5;
    display: inline;
}
.devqa-q-moreanswers{
    display: none;
}
...