Log in

No account? Create an account

Previous Entry | Next Entry

HOWTO: Change metadata order

  • Jan. 16th, 2007 at 10:13 AM
UPDATE (3/03/08): I have updated this function as well as the other version of print_metadata() to add custom friends groups into the metadata.
I kept promising in my last HOWTO entry that I would re-work the metadata printing function for Expressive, so here it is, finally. Also as before, the code is based on kunzite1's Bloggish code here, which I've fixed and adapted for Expressive. A paid account is required, since you need to create a custom theme layer. Also, the original code had the capability to replace the meta header text with small images. I've left that functionality in, but you'll need to supply your own icons; 16x16 should be a suitable size. If you don't want icons, just remove the red text.

"Installation" is simple: Just cut and paste into your theme layer (create it if you don't already have one). To change metadata order, just change the order of the $metadata array elements where the blue text is.
Limitations: Expressive is a little different from the other layouts in the way metadata is printed into blocks. Instead of one <div> and <ul> for the entire block, there are actually two, one for location/mood/music and a separate one for tags. As it is, I chose to work in the confines of the existing CSS classes for Expressive and put the tags section after everything else. There might be a way to put the tags within the rest of the meta block, but I thought this was an acceptable solution. Unless there's a great deal of clamoring for a change, I'll just leave it this way. ;)

If you notice any problems, please let me know.

# define these properties somewhere in the layer
set text_meta_groups = "Groups:";
set text_meta_mood = "Mood:";
set text_meta_music = "Music:";
set text_meta_location = "Location:";

function Entry::print_metadata() {
    var string[] metadata    = [];
    var string{} meta_images = {};

    # define the meta order
    #   groups   : custom friends groups to which the entry is posted, if any (viewable only by owner)
    #   location : current location
    #   mood     : current mood
    #   music    : current music
    $metadata    = [ # here is where you would change the meta order

    # define the meta images
    $meta_images = {
                    "groups"          => "http://URL OF GROUPS MINI-ICON",
                    "location"        => "http://URL OF LOCATION MINI-ICON",
                    "mood"            => "http://URL OF MOOD MINI-ICON",
                    "music"           => "http://URL OF MUSIC MINI-ICON",
                    "picture_keyword" => "",
                    "tags"            => "http://URL OF TAGS MINI-ICON"

    var string   tags_header      = """Tags:""";
    var string   currents_open    = """<div class="lj-currents">\n<ul>\n""";  # html to open  currents container
    var string   currents_close   = """</ul>\n</div>\n""";                    # html to close currents container

    var string   meta_label_open  = """<li><span class="entryMetadata-label">"""; # html to open  metadata label
    var string   meta_label_close = """</span>""";                         # html to close metadata label
    var string   meta_val_open    = """<span class="entryMetadata-content">""";   # html to open  metadata value
    var string   meta_val_close   = """</span></li>""";                    # html to close metadata value
    # tags module has its own HTML in Expressive
    var string   tags_cont_open   = """<div class="asset-tags">""";
    var string   tags_cont_close  = """\n</ul>\n</div>\n""";
    var string   tags_label_open  = """<h4 class="asset-tags-header page-header-4">""";
    var string   tags_label_close = """</h4>\n<ul class="asset-tags-list">\n """;
    var string   tags_item_open   = """<li class="item">""";
    var string   tags_item_close  = """</li>""";

    var bool     vanilla_loc      = false;                              # strip current location value?
    var bool     have_meta        = (size($.metadata) > 0);                # do we have meta?
    var bool     have_tags        = ((size($.tags) > 0) and $*tags_aware); # do we have tags?
    var int      tcount           = 0;
    var string   currents         = "";
    var string   image            = "";
    var string   k                = "";
    var string   label            = "";
    var string   meta             = "";
    var string   tag              = "";
    var string   val              = "";
    var Tag      t                = new Tag;

    # if we have meta
    if($have_meta) {
        # add opening of metadata container
        $currents = $currents + $currents_open;

        # if our meta order is empty, add 'em
        if(size($metadata) < 1) {
            foreach $k ($.metadata) {
                $metadata[size($metadata)] = $k;

        # cycle thru meta
        foreach $k ($metadata) {
            $label = lang_metadata_title($k);                         # get label
            $image = $meta_images{$k} != "" ? $meta_images{$k} : "";  # get image
            $val   = $.metadata{$k};                                  # get value

            # if we have an image
            if($image != "") {
                # add it
                $label = """<img src="$image" alt="$label" title="$label" />""";

            # add mood icon if present
            if($k == "mood") {
                if($.mood_icon) {
                    $val = " $.mood_icon " + $val;

            # if we're doing the location and we're stripping it
            if(($k == "location") and $vanilla_loc) {
                # do it
                $val = striphtml($val);

            # if we have a val
            if($val != "") {
                # build meta row
                $meta = """$meta_label_open$label$meta_label_close$meta_val_open$val$meta_val_close""";
            } else {
                # don't add row if there's missing meta
                $meta = "";

            # add meta
            $currents = $currents + $meta;

        # add closing of metadata container
        $currents = $currents + $currents_close;

    # if we have tags, put them at the end
    # this section could also go above the metadata
    if($have_tags) {
        # add an image for tag header, if present
        if($meta_images{"tags"} != ""){
            $label = $tags_header;
            $image = $meta_images{"tags"};
            $tags_header = """<img src="$image" alt="$label" title="$label" />""";

        $currents = $currents + """$tags_cont_open$tags_label_open$tags_header$tags_label_close""";

        # cycle thru tags
        foreach $t ($.tags) {
            $tag = """$tags_item_open<a rel="tag" href="$t.url">$t.name</a>"""; # build tag
            $currents = $currents + $tag;              # add tag to val
            $tcount++;                                 # increment tag counter

            # if current count is less than the size of the tags
            if($tcount < size($.tags)) {
                # add a sep
                $currents = $currents + ", ";
            $currents = $currents + $tags_item_close;
        $currents = $currents + $tags_cont_close;

    # print metadata
    print $currents;
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.


May. 31st, 2009 06:27 pm (UTC)
I'm hoping you might be able to help me since the layout I'm now using uses both this theme layer business for the metadata AND a custom CSS layout. The layout designer doesn't know how to do the theme layer stuff to ask there.

Okay, if you view my LJ in Firefox, everything looks fine. In IE, however, the metadata area is showing up with little red boxes for all the metadata titles.

I'm beyond clueless as to what is making that happen in IE-only let alone how to fix that. The layout designer's thought had been that the theme would need ".currents" but it looks like this theme layer has that (if I am reading what I do not understand correctly, lol).

Any thoughts? Thanks a bunch!
Jun. 2nd, 2009 08:47 pm (UTC)
I took a look at the theme layer on your journal. In the code, where it says "http://URL OF MOOD MINI-ICON", you actually have to change that to a URL to an icon. IE just isn't showing the alternate text like Firefox is. If you're not going to use an icon, remove that text, like it says in the first paragraph of the post.
Jun. 3rd, 2009 12:16 am (UTC)
Oh ok! Thanks a bunch - I'll go fix that then!

Latest Month

March 2016

S2 Help Communities


Powered by LiveJournal.com
Designed by chasethestars