HOWTO: Individually Formatting Links

[av8rmike]

Since questions still come up about how to hide various links, and since I know of two good techniques for it, I thought I'd compile it all into one tutorial/How To post. Depending on your account level (Basic/Plus/Paid/Perm), there are two primary methods to employ: CSS or S2 code, each with their own advantages and disadvantages.

[All Account Levels] The CSS Method

For each link to hide, add the following CSS to the "Custom Stylesheet" box on the Customize Journal Style->Custom CSS page:
a[href*=text substring] {display: none;}

What goes into text substring? It depends what content you wish to hide, but it will be a substring of that link's URL. For example:

This code:Will Hide Links to:†- Note that the "Flag" link is already hidden on non-public entries.
Archive and friends pages are still accessible with direct URLs, and functionality of the other links is not disabled.
a[href*=calendar] {display: none;}Calendar page
a[href*=friends] {display: none;}Friends page
.asset-meta-list a[href*=memadd] {display: none;}Add to Memories
.asset-meta-list a[href*=flag] {display: none;}Flag†
.asset-meta-list a[href*=subscrip] {display: none;}(Un)Track ThisIt's worth mentioning that display: none isn't the only CSS one could apply to individual links. Use this code to change all the "Leave a comment" links to blue:
.asset-meta-list a[href*=reply] {color: #0000FF;}

Advantages:

• Available to users at all account levels.
• Works on all themes, not just Expressive/Mixit.

Disadvantages:

• Not all browsers recognize the [attr*=] attribute specifier. Internet Explorer 6 in particular, and maybe older versions of Safari or Opera.
• Cumbersome for hiding/formatting multiple links
• Circumvented by ?style=mine.

[Paid/Permanent Accounts] The S2 Layers Method

This method is similar to the one used here to change the entry link bar to images, although this one will allow you to customize the order of the links. Follow the tutorial for creating a theme layer, then add in this code. To reorder or remove links, change the order in the link_keyseq array.
function Entry::print_linkbar() {
# Makes the entry linkbar contents and order modifiable.
var Link link;
var string url = "";
var string text = "";

print """
\n""";
print """

\n""";

$.comments->print();

# Here is where you would change the order of or remove linkbar links.
var string[] link_keyseq = [
"edit_entry",
"edit_tags",
"mem_add",
"tell_friend",
"watch_comments",
"unwatch_comments",
"flag",
];

var string{} link_caption = {
"edit_entry" => $*text_edit_entry,
"edit_tags" => $*text_edit_tags,
"tell_friend" => $*text_share_this,
"flag" => $*text_flag,
"mem_add" => $*text_mem_add,
"watch_comments" => $*text_watch_comments,
"unwatch_comments" => $*text_unwatch_comments,
};

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;
print safe """
• $text
""";
$link->print_raw();
}
}
print """
• $*text_permalink
""";
println "\n

\n\n";
}Here is a similar function for changing the nav links at the page top:
function Page::lay_print_header_links() {
# Makes the nav linkbar contents and order modifiable.
"""
\n""";
container_open("header");
container_open("header-content");
"""
\n
\n\n""";
"""

\n""";

# Here is where you would change the order of or remove nav bar links.
var string[] views_order = [
"recent",
"archive",
"friends",
"userinfo",
];

foreach var string v ($views_order) {
var string url = $.view_url{$v};
var string text = lang_viewname($v);
var string class = "item";
if($v == $.view) {
$class = $class + " current";
}
if($v == $.views_order[0]) {
$class = $class + " first";
}

$class = " class=\"$class\"";

print """ $text""";
}

var Link memories_url = $.journal->get_link("memories");

# Memories
if($memories_url.url != "") {
println safe """
• $*text_view_memories
""";
}

# Menu end
"""

""";
var string base_url = $.journal->base_url();
var string friends_url = $.view_url{"friends"};
if ($this isa FriendsPage) {
print safe """ """ + $this->view_title() + """""";
} else {
print safe """ $.global_title""";
}
"""
""";

if(not $this isa FriendsPage) {
print safe """

$.global_subtitle""";
}

"""

""";
}Also, both methods can be combined-- one could change the layout of the entry linkbar and link colors, for instance.

Advantages:

• Works on all browsers, regardless of CSS support.
• Allows you to change the link order, which cannot be done with CSS.
• Easier to change multiple links at once.

Disadvantages:

• A Paid or Permanent account is required.
• Also circumvented by ?style=mine.