HOWTO: Changing the Comment Linkbar to a Button Toolbar

Aug 05, 2008 12:12

As requested here by zheida (and probably several other times), these functions will change the linkbars on entries to something like the "3 Column" style. You will have to find/make your own button images; however, LiveJournal does have a few default images that will be used if you don't supply your own. The default image size is 22px wide by 20px tall, but any size button could be used, conceivably. You will need images for:
Permalink, Reply, Replies Frozen, Parent, Thread, Edit, Delete, Freeze, Unfreeze, Track, Untrack, Screen, Unscreen, and Watching (images don't need to be unique).

To use, copy the two functions into your theme layer. (There is already lots of information in the FAQs and this community on making a layer.) Once you have uploaded your button images to ScrapBook, Photobucket, or wherever, replace the red text with your own URLs. To use text instead of an image, just change the URL to "".


# Replaces the first four links with images
function EntryPage::print_comment(Comment e) {
var string{} link_images = { # Replace IMAGE_URL with the URL to your image
"permalink" => "http://IMAGE_URL",
"comment_frozen" => "http://IMAGE_URL",
"comment_reply" => "http://IMAGE_URL",
"comment_parent" => "http://IMAGE_URL",
"comment_thread" => "http://IMAGE_URL",
};

var string barc = "comment-" + ($e.depth % 2 ? "odd" : "even");
var string screenbarc = "";
var string borderwidth = "";
if ($e.screened) {
$screenbarc = " border-width: 3px; border-style: dashed;";
}
var string indent = ($e.depth - 1) * 25 + "px;";
var string id = $e.dom_id ? " id=\"$e.dom_id\"" : "";

if (not $e.full) {
# Collapsed mode

"""


""";

var string subject = $e.subject != "" ? $e.subject : """$*text_nosubject""";

print safe """ $subject - """;

var string poster = (defined $e.poster ? ""+$e.poster : """$*text_poster_anonymous""");
print safe """$poster - """;
print lang_posted_by_date_and_time($e, false, true, true);

var Link expand_link = $e->get_link("expand_comments");
if ($e.thread_url != "" and defined $expand_link) {
print " "; $e->print_expand_link({ "class" => "collapsed-comment-link" });
}

"""

\n""";

if (size($e.replies) > 0) {
foreach var Comment c ($e.replies) {
$this->print_comment($c);
}
}

return;
}

"""

""";

if ($*opt_userpic_comments and defined $e.userpic) {
"""
$e.userpic""";
}

var string poster = defined $e.poster ? $e.poster->as_string() : "$*text_poster_anonymous";

print safe """$poster """;
if ($e.metadata{"poster_ip"} != "") {
"(" + $e.metadata{"poster_ip"} + ") ";
}
"""wrote:
""";
var string datetime = lang_posted_by_date_and_time($e, true, true, true);
"""
$datetime""";

if (defined $e.subject_icon) {
"""
$e.subject_icon""";
}

if ($e.subject != "") {
"""
$e.subject""";
}

"""
""";
$e->print_text();
"""

""";
var string sep = """|""";
var string img_link = """
""";
""" $img_link""";

if ($e.frozen) {
$img_link = """
""";
print safe " $sep $img_link";
} else {
" $sep "; $e->print_reply_link({"img_url" => "$link_images{"comment_reply"}"});
}

if ($e.parent_url) {
$img_link = """
""";
print """ $sep $img_link""";
}
if ($e.thread_url) {
$img_link = """
""";
print """ $sep $img_link""";
var Link expand_link = $e->get_link("expand_comments");
if (defined $expand_link) {
" $sep " + $e->expand_link();
}
}

$e->print_linkbar();

if ($this.multiform_on) {
println safe """ $*text_multiform_check""";
$e->print_multiform_check();
}

"\n\n\n\n";
if (not $e.frozen) {
$e->print_reply_container({"class" => "quickreply"});
}

if (size($e.replies) > 0) {
foreach var Comment c ($e.replies) {
$this->print_comment($c);
}
}
}

# Replaces the last four links with images
function Comment::print_linkbar() {
var Link link;
var string sep = """|""";
var string url = "";
var string text = "";
var string img_url = "";

var string{} link_caption = {
"edit_comment" => $*text_multiform_opt_edit,
"delete_comment" => $*text_multiform_opt_delete,
"freeze_thread" => $*text_multiform_opt_freeze,
"unfreeze_thread" => $*text_multiform_opt_unfreeze,
"screen_comment" => $*text_multiform_opt_screen,
"unscreen_comment" => $*text_multiform_opt_unscreen,
"watch_comments" => $*text_multiform_opt_track,
"unwatch_comments" => $*text_multiform_opt_untrack,
};

var string{} link_images = { # Replace IMAGE_URL with the URL to your image
"edit_comment" => "http://IMAGE_URL",
"delete_comment" => "http://IMAGE_URL",
"freeze_thread" => "http://IMAGE_URL",
"unfreeze_thread" => "http://IMAGE_URL",
"screen_comment" => "http://IMAGE_URL",
"unscreen_comment" => "http://IMAGE_URL",
"watch_thread" => "http://IMAGE_URL",
"unwatch_thread" => "http://IMAGE_URL",
"watching_parent" => "http://IMAGE_URL",
};

foreach var string link_key ($.link_keyseq) {
$link = $this->get_link($link_key);
if (defined $link) {
$url = $link.url;
$text = $link_caption{$link_key} != "" ? $link_caption{$link_key} : $link.caption;
$img_url = $link_images{$link_key} != "" ? $link_images{$link_key} : $link.icon.url;
print safe """ $sep
""";
}
}
}Set your theme layer to be the active one from the Choose Journal Style page by clicking on "Your Custom Layers" in the left sidebar, then selecting "Apply Theme" under the appropriate layer.

how to:instructions, comments, s2:theme layer, !tutorial, advanced, $acct level:paid or perm

Previous post Next post
Up