Here is my code, keep in mind the comment page doesn't have page nav, but a bit of tweaking it will. I think you will like this layout more so than you're current one.
The way this is set up, if you click "speak" it will take you to the actual article comment section of the article.
I would love to figure out how to make the reply feature work, but have been unsuccessful.
Code:
<vte:if test="{VIVVO_COMMENTS_ENABLE}">
<div id="latest_comments" class="">
<vte:box module="box_comments">
<vte:params>
<!-- <vte:param name="search_limit" value="200" />-->
<vte:param name="search_sort_by" value="created" />
<vte:param name="search_order" value="descending" />
<vte:param name="search_limit" value="200" />
<vte:param name="cache" value="1" />
</vte:params>
<vte:template>
<vte:if test="{comment_list}">
<vte:attribute name="style">
<vte:if test="{ajax_output}">margin:0</vte:if>
</vte:attribute>
<vte:foreach item = "comment" from = "{comment_list}">
<div class="single_comment">
<div class="comment_header">
<img src="{comment.get_avatar|24}" alt="avatar" width="24" height="24" />
<vte:if test="{comment.get_www}">
<a href="http://{comment.get_www}" target="_blank"><vte:value select="{comment.get_author}" /></a>
<vte:else>
<strong><vte:value select="{comment.get_author}" /></strong>
</vte:else>
</vte:if>
<span class="comment_stamp">
/ <vte:value select="{comment.get_article_title}" /> /
<!--<vte:value select="{comment.get_create_dt}" /> -->
<span class="no_of_comments_counter">Posted <vte:value select="{comment.create_dt|pretty_date}" /></span>
</span>
</div>
<div class="comment_body">
<div class="comment_text">
(COMMENT ID - <vte:value select="{comment.get_id}" />)
<a href="{comment.get_article_href}"><vte:value select="{comment.get_description|strip_tags}" /></a>
</div>
<p><!-- --></p>
<div class="comment_actions">
<vte:if test="{VIVVO_COMMENTS_ENABLE_THREADED}">
<a class="comment_reply" href="{comment.get_article_href}#post-reply" onClick="return reply_to_comment({comment.get_id},{comment.get_root_comment},{comment.get_plain_summary|json_encode_attr});">Speak</a></vte:if>
<div id="comment_vote_{comment.get_id}" class="result">
Rated <vte:value select="{comment.get_vote}" />
</div>
</div>
</div>
<vte:if test="{VIVVO_MODULES_FEED}">
<a href="{comment.get_article_href|switch_format:'rss'}"><img src="{VIVVO_THEME}img/icon_feed.gif" class="comment_feed" alt="{LNG_COMMENT_RSS}" title="{LNG_COMMENT_RSS}" /></a>
</vte:if>
</div>
</vte:foreach>
</vte:if>
</vte:template>
</vte:box>
</div>
<vte:box module="box_pagination">
<vte:params>
<vte:param name="list" value="{comment_list}" />
<vte:param name="max_page" value="50" />
</vte:params>
<vte:template>
<div id="box_pagination">
<span class="pagination">
<vte:if test="{previous_page_group} != ''">
<span class="page_button" style="cursor:pointer;" onClick="onPageChange({previous_page_group_number});"><</span>
</vte:if>
<vte:foreach item = "page" from = "{page_list}">
<vte:if test="{current_page} != {page[number]}">
<span class="page_button" style="cursor:pointer;" onClick="onPageChange({page[number]});"><vte:value select="{page[number]}" /></span>
<vte:else>
<span style="color:#C90404;"><vte:value select="{page[number]}" /></span>
</vte:else>
</vte:if>
</vte:foreach>
<vte:if test="{next_page_group} != ''">
<span class="page_button" style="cursor:pointer;" onClick="onPageChange({next_page_group_number});">></span>
</vte:if>
</span>
Comments
<span class="pagination_total">
<vte:value select="{displaying}" />
</span>
of
<span class="pagination_total">
<vte:value select="{total_records}" />
</span>
</div>
</vte:template>
</vte:box>
</vte:if>
<vte:if test="!{ajax_output}">
<script type="text/javascript">
function reportComment(id) {
new Ajax.Updater('comment_report_' + id, '<vte:value select="{VIVVO_ABSOLUTE_URL}" />', {
parameters: {
action: 'comment',
cmd: 'reportInappropriateContent',
COMMENT_id: id,
template_output: 'box/dump'
}
});
}
function voteComment(id, vote) {
new Ajax.Updater('comment_vote_' + id, '<vte:value select="{VIVVO_ABSOLUTE_URL}" />', {
parameters: {
action: 'comment',
cmd: 'vote',
COMMENT_id: id,
COMMENT_vote: vote,
template_output: 'box/dump'
}
});
}
function loadCommentsPage(pg) {
new Ajax.Updater('comment_list', '<vte:value select="{VIVVO_ABSOLUTE_URL}" />', {
parameters: {
action: 'comment',
cmd: 'proxy',
pg: pg,
CURRENT_URL: '<vte:value select="{CURRENT_URL}" />',
article_id: <vte:value select="{article.get_id}" />,
template_output: 'box/comments'
}
});
}
var reply_to_comment_id = 0;
function updateComments() {
var commentParam = $('comment_form').serialize(true);
commentParam.template_output = 'box/comments_add';
commentParam.form_container = 'comment_form_holder';
var dump = $('comment_dump');
if (dump) dump.remove();
new Ajax.Updater(reply_to_comment_id != 0 ? 'new_comment_holder_' + reply_to_comment_id : 'new_comment_holder', '<vte:value select="{VIVVO_ABSOLUTE_URL}" />', {
parameters: commentParam,
evalScripts: true,
insertion: 'before',
onSuccess: function(xhr) {
if (xhr.getResponseHeader('X-Vivvo-Action-Status') == 1) {
var form = $('comment_form');
form.down('textarea').value = '';
<vte:if test="{VIVVO_COMMENTS_CAPTHA}">
form.down('.captcha-image').src = '<vte:value select="{VIVVO_PROXY_URL}" />imagecode.html?article_id=<vte:value select="{article.get_id}" />&ts=' + +new Date;
form.down('input[name="COMMENT_captcha"]').value = '';
</vte:if>
<vte:if test="{VIVVO_ANALYTICS_TRACKER_ID}">
_gaq.push(['_trackEvent', 'Article', 'Comment', '<vte:value select="{article.get_id}" />', 1]);
</vte:if>
<vte:if test="{VIVVO_COMMENTS_ENABLE_THREADED}">
cancelReplyTo();
</vte:if>
clearCommentDumps();
}
}
});
return false;
}
function clearCommentDumps() {
var commentDump = $('comment_dump_container');
if (commentDump) {
commentDump.childElements().invoke('remove');
}
}
function addCommentDump(message, type, info) {
var commentDump = $('comment_dump');
if (!commentDump) {
var container = $('comment_dump_container');
if (!container) {
return;
}
container.insert(commentDump = new Element('div', {'id': 'comment_dump'}));
}
if (info) {
message += ': ' + info;
}
commentDump.insert(new Element('span', {'class': type}).update(message));
}
<vte:if test="{VIVVO_COMMENTS_ENABLE_THREADED}">
function reply_to_comment(id, root, summary) {
$('COMMENT_reply_to').value = id;
$('COMMENT_root_comment').value = root;
$('COMMENT_description').focus();
$('writing_reply_to').update(summary);
$('writing_reply').show();
reply_to_comment_id = id;
return false;
}
function cancelReplyTo() {
$('COMMENT_reply_to').value = '';
$('COMMENT_root_comment').value = '';
$('writing_reply').hide();
reply_to_comment_id = 0;
}
</vte:if>
</script>
</vte:if>
how to show all comments in a page with pagination?
Linear Mode
Six months free upgrades